From 41e04e5608e42e446b7ba4a04f097d857e8dc4b3 Mon Sep 17 00:00:00 2001 From: Matt Brophy Date: Mon, 27 Feb 2023 14:34:52 -0500 Subject: [PATCH 1/4] Revert "bug(remix-react): add failing test for scroll-restoration (#3171)" This reverts commit ba4dba9b4a0e99c80b4218156facb6a7b93a4f61. --- contributors.yml | 1 - integration/bug-report-test.ts | 52 ++++++++++++---------------------- 2 files changed, 18 insertions(+), 35 deletions(-) diff --git a/contributors.yml b/contributors.yml index 8b0df208ae8..37e6332ae7b 100644 --- a/contributors.yml +++ b/contributors.yml @@ -319,7 +319,6 @@ - Matthew-Mallimo - MatthewAlbrecht - matthova -- Mattinton - mattmazzola - mattstobbs - maxprilutskiy diff --git a/integration/bug-report-test.ts b/integration/bug-report-test.ts index f4f7c27f321..c8a9f18ac1b 100644 --- a/integration/bug-report-test.ts +++ b/integration/bug-report-test.ts @@ -48,37 +48,27 @@ test.beforeAll(async () => { //////////////////////////////////////////////////////////////////////////// files: { "app/routes/index.jsx": js` - import { redirect } from "@remix-run/node"; - import { Form } from "@remix-run/react"; - - export const action = async () => { - await new Promise((resolve) => setTimeout(resolve, 500)); - - return redirect("/test"); - }; - + import { json } from "@remix-run/node"; + import { useLoaderData, Link } from "@remix-run/react"; + + export function loader() { + return json("pizza"); + } + export default function Index() { + let data = useLoaderData(); return (
-

Scroll down to test

- -
-

Test here

- -
+ {data} + Other Route
- ); - } + ) + } `, - "app/routes/test.jsx": js` + "app/routes/burgers.jsx": js` export default function Index() { - return ( -
-

This is the top

-

This is the bottom

-
- ) + return
cheeseburger
; } `, }, @@ -97,22 +87,16 @@ test.afterAll(() => { // add a good description for what you expect Remix to do 👇🏽 //////////////////////////////////////////////////////////////////////////////// -test("page scroll should be at the top on the new page", async ({ page }) => { +test("[description of what you expect it to do]", async ({ page }) => { let app = new PlaywrightFixture(appFixture, page); // You can test any request your app might get using `fixture`. let response = await fixture.requestDocument("/"); - expect(await response.text()).toMatch("Scroll down to test"); + expect(await response.text()).toMatch("pizza"); // If you need to test interactivity use the `app` await app.goto("/"); - // scroll to the bottom - await page.evaluate(() => window.scrollTo(0, document.body.scrollHeight)); - await app.clickSubmitButton("/?index"); - - expect(await app.getHtml()).toMatch("This is the bottom"); - - let newScrollY = await page.evaluate(() => window.scrollY); - expect(newScrollY).toBe(0); + await app.clickLink("/burgers"); + expect(await app.getHtml()).toMatch("cheeseburger"); // If you're not sure what's going on, you can "poke" the app, it'll // automatically open up in your browser for 20 seconds, so be quick! From a15027e41f449d752ba8a105b4f653826c47a6fe Mon Sep 17 00:00:00 2001 From: Matt Brophy Date: Mon, 27 Feb 2023 14:47:00 -0500 Subject: [PATCH 2/4] Acc scroll test --- integration/scroll-test.ts | 68 ++++++++++++++++++++++++++++++++++++++ 1 file changed, 68 insertions(+) create mode 100644 integration/scroll-test.ts diff --git a/integration/scroll-test.ts b/integration/scroll-test.ts new file mode 100644 index 00000000000..0ab416e7a84 --- /dev/null +++ b/integration/scroll-test.ts @@ -0,0 +1,68 @@ +import { test, expect } from "@playwright/test"; + +import { PlaywrightFixture } from "./helpers/playwright-fixture"; +import type { Fixture, AppFixture } from "./helpers/create-fixture"; +import { createAppFixture, createFixture, js } from "./helpers/create-fixture"; + +let fixture: Fixture; +let appFixture: AppFixture; + +test.beforeAll(async () => { + fixture = await createFixture({ + files: { + "app/routes/index.jsx": js` + import { redirect } from "@remix-run/node"; + import { Form } from "@remix-run/react"; + + export function action() { + return redirect("/test"); + }; + + export default function Component() { + return ( + <> +

Index Page - Scroll Down

+
+ +
+ + ); + } + `, + + "app/routes/test.jsx": js` + export default function Component() { + return ( + <> +

Redirected!

+

I should not be visible!!

+ + ); + } + `, + }, + }); + + // This creates an interactive app using puppeteer. + appFixture = await createAppFixture(fixture); +}); + +test.afterAll(() => { + appFixture.close(); +}); + +test("page scroll should be at the top on the new page", async ({ page }) => { + let app = new PlaywrightFixture(appFixture, page); + await app.goto("/"); + + // Scroll to the bottom and submit + await page.evaluate(() => window.scrollTo(0, document.body.scrollHeight)); + let scroll = await page.evaluate(() => window.scrollY); + expect(scroll).toBeGreaterThan(0); + await app.clickSubmitButton("/?index"); + await page.waitForSelector("#redirected"); + + // Ensure we scrolled back to the top + scroll = await page.evaluate(() => window.scrollY); + expect(scroll).toBe(0); +}); From 3c1aae9a4186b4a351625de3b126a9fcefcd0a78 Mon Sep 17 00:00:00 2001 From: Matt Brophy Date: Mon, 27 Feb 2023 14:53:27 -0500 Subject: [PATCH 3/4] Add back contributor --- contributors.yml | 1 + 1 file changed, 1 insertion(+) diff --git a/contributors.yml b/contributors.yml index 37e6332ae7b..8b0df208ae8 100644 --- a/contributors.yml +++ b/contributors.yml @@ -319,6 +319,7 @@ - Matthew-Mallimo - MatthewAlbrecht - matthova +- Mattinton - mattmazzola - mattstobbs - maxprilutskiy From 2d667cf18dfd123c33188b1ed3604e8e30d93fe1 Mon Sep 17 00:00:00 2001 From: Matt Brophy Date: Mon, 27 Feb 2023 15:00:04 -0500 Subject: [PATCH 4/4] Add changeset --- .changeset/red-kids-look.md | 5 +++++ 1 file changed, 5 insertions(+) create mode 100644 .changeset/red-kids-look.md diff --git a/.changeset/red-kids-look.md b/.changeset/red-kids-look.md new file mode 100644 index 00000000000..e2ad1ee4340 --- /dev/null +++ b/.changeset/red-kids-look.md @@ -0,0 +1,5 @@ +--- +"remix": patch +--- + +Restore bug-report-test.ts (Can be removed from final release notes)