From 8cb33ce3939af24ff9ed710979806a6ac1486ece Mon Sep 17 00:00:00 2001 From: Matt Brophy Date: Wed, 23 Aug 2023 13:08:28 -0400 Subject: [PATCH] Adjust flaky tests (#7241) --- integration/redirects-test.ts | 194 +++++----------------------------- 1 file changed, 29 insertions(+), 165 deletions(-) diff --git a/integration/redirects-test.ts b/integration/redirects-test.ts index 887c70d1028..526eaf7ab33 100644 --- a/integration/redirects-test.ts +++ b/integration/redirects-test.ts @@ -15,74 +15,34 @@ test.describe("redirects", () => { test.beforeAll(async () => { fixture = await createFixture({ files: { - "app/routes/action.tsx": js` - import { Outlet, useLoaderData } from "@remix-run/react"; - - if (typeof global.actionCount === "undefined") { - global.actionCount = 0; - global.actionRequests = new Set(); - } - - export async function loader({ request, context }) { - let count = global.actionCount; - if (!global.actionRequests.has(context)) { - global.actionRequests.add(context); - count = ++global.actionCount; - } - return { count }; - }; + "app/routes/absolute.tsx": js` + import * as React from 'react'; + import { Outlet } from "@remix-run/react"; - export default function Parent() { - let data = useLoaderData(); + export default function Component() { + let [count, setCount] = React.useState(0); return ( -
-

{data.count}

+ <> + -
- ); - } - `, - - "app/routes/action.form.tsx": js` - import { redirect } from "@remix-run/node"; - import { Form } from "@remix-run/react"; - - export async function action({ request }) { - return redirect("/action/1"); - }; - - export default function Login() { - return ( -
- -
+ ); } `, - "app/routes/action.1.tsx": js` - import { redirect } from "@remix-run/node"; - - export async function loader({ request }) { - return redirect("/action/2"); - }; - `, - - "app/routes/action.2.tsx": js` - export default function () { - return

Page 2

- } - `, - - "app/routes/action.absolute.tsx": js` + "app/routes/absolute._index.tsx": js` import { redirect } from "@remix-run/node"; import { Form } from "@remix-run/react"; export async function action({ request }) { - return redirect(new URL(request.url).origin + "/action/1"); + return redirect(new URL(request.url).origin + "/absolute/landing"); }; - export default function Login() { + export default function Component() { return (
@@ -90,80 +50,13 @@ test.describe("redirects", () => { ); } `, - "app/session.server.ts": js` - import { createCookie } from "@remix-run/node"; - export const session = createCookie("session"); - `, - - "app/routes/loader.tsx": js` - import { Outlet, useLoaderData } from "@remix-run/react"; - import { session } from "~/session.server"; - - if (typeof global.loaderCount === "undefined") { - global.loaderCount = 0; - global.loaderRequests = new Set(); - } - - export async function loader({ request, context }) { - const cookieHeader = request.headers.get("Cookie"); - const { value } = (await session.parse(cookieHeader)) || {}; - let count = global.loaderCount; - if (!global.loaderRequests.has(context)) { - global.loaderRequests.add(context); - count = ++global.loaderCount; - } - return { count, value }; - }; - - export default function Parent() { - let data = useLoaderData(); - return ( -
-

{data.count}

- {data.value ?

{data.value}

: null} - -
- ); - } - `, - "app/routes/loader.link.tsx": js` - import { Link } from "@remix-run/react"; - export default function Parent() { - return Redirect; + "app/routes/absolute.landing.tsx": js` + export default function Component() { + return

Landing

} `, - "app/routes/loader.redirect.tsx": js` - import { redirect } from "@remix-run/node"; - import { Form } from "@remix-run/react"; - import { session } from "~/session.server"; - - export async function loader({ request }) { - const cookieHeader = request.headers.get("Cookie"); - const cookie = (await session.parse(cookieHeader)) || {}; - cookie.value = 'cookie-value'; - return redirect("/loader/1", { - headers: { - "Set-Cookie": await session.serialize(cookie), - }, - }); - }; - `, - - "app/routes/loader.1.tsx": js` - import { redirect } from "@remix-run/node"; - - export async function loader({ request }) { - return redirect("/loader/2"); - }; - `, - - "app/routes/loader.2.tsx": js` - export default function () { - return

Page 2

- } - `, "app/routes/loader.external.ts": js` import { redirect } from "@remix-run/node"; export const loader = () => { @@ -215,39 +108,6 @@ test.describe("redirects", () => { appFixture.close(); }); - test("preserves revalidation across action multi-redirects", async ({ - page, - }) => { - let app = new PlaywrightFixture(appFixture, page); - await app.goto(`/action/form`); - expect(await app.getHtml("#count")).toMatch("1"); - // Submitting this form will trigger an action -> redirect -> redirect - // and we need to ensure that the parent loader is called on both redirects - await app.waitForNetworkAfter(() => - app.clickElement('button[type="submit"]') - ); - await page.waitForSelector(`#app:has-text("Page 2")`); - await page.waitForSelector(`#count:has-text("3")`); - }); - - test("preserves revalidation across loader multi-redirects with cookies set", async ({ - page, - }) => { - let app = new PlaywrightFixture(appFixture, page); - await app.goto(`/loader/link`); - expect(await app.getHtml("#count")).toMatch("1"); - // Clicking this link will trigger a normalRedirect -> normalRedirect with - // a cookie set on the first one, and we need to ensure that the parent - // loader is called on both redirects - await app.waitForNetworkAfter(() => - app.clickElement('a[href="/loader/redirect"]') - ); - await page.waitForSelector(`#app:has-text("Page 2")`); - await page.waitForSelector(`#app:has-text("cookie-value")`); - // Loader called twice - await page.waitForSelector(`#count:has-text("3")`); - }); - test("redirects to external URLs", async ({ page }) => { let app = new PlaywrightFixture(appFixture, page); @@ -255,15 +115,19 @@ test.describe("redirects", () => { expect(app.page.url()).toBe("https://remix.run/"); }); - test("redirects to absolute URLs in the app", async ({ page }) => { + test("redirects to absolute URLs in the app with a SPA navigation", async ({ + page, + }) => { let app = new PlaywrightFixture(appFixture, page); - await app.goto(`/action/absolute`); - expect(await app.getHtml("#count")).toMatch("1"); + await app.goto(`/absolute`, true); + await app.clickElement("#increment"); + expect(await app.getHtml("#increment")).toMatch("Count:1"); await app.waitForNetworkAfter(() => - app.clickSubmitButton("/action/absolute") + app.clickSubmitButton("/absolute?index") ); - await page.waitForSelector(`#app:has-text("Page 2")`); - await page.waitForSelector(`#count:has-text("3")`); + await page.waitForSelector(`h1:has-text("Landing")`); + // No hard reload + expect(await app.getHtml("#increment")).toMatch("Count:1"); }); test("supports hard redirects within the app via reloadDocument", async ({ @@ -275,7 +139,7 @@ test.describe("redirects", () => { await app.clickElement("button"); expect(await app.getHtml("button")).toMatch("Count:1"); await app.waitForNetworkAfter(() => app.clickLink("/redirect-document/a")); - await page.waitForSelector(`h1`); + await page.waitForSelector('h1:has-text("Hello B!")'); // Hard reload resets client side react state expect(await app.getHtml("button")).toMatch("Count:0"); });