Skip to content

Commit

Permalink
Adjust flaky tests (#7241)
Browse files Browse the repository at this point in the history
  • Loading branch information
@brophdawg11
brophdawg11 authored Aug 23, 2023
1 parent 42412bc commit 8cb33ce
Showing 1 changed file with 29 additions and 165 deletions.
194 changes: 29 additions & 165 deletions integration/redirects-test.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -15,155 +15,48 @@ 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 (
<div id="app">
<p id="count">{data.count}</p>
<>
<button
id="increment"
onClick={() => setCount(count + 1)}>
{"Count:" + count}
</button>
<Outlet/>
</div>
);
}
`,

"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 (
<Form method="post">
<button type="submit">Submit</button>
</Form>
</>
);
}
`,

"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 <h1>Page 2</h1>
}
`,

"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 (
<Form method="post">
<button type="submit">Submit</button>
</Form>
);
}
`,
"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 (
<div id="app">
<p id="count">{data.count}</p>
{data.value ? <p>{data.value}</p> : null}
<Outlet/>
</div>
);
}
`,

"app/routes/loader.link.tsx": js`
import { Link } from "@remix-run/react";
export default function Parent() {
return <Link to="/loader/redirect">Redirect</Link>;
"app/routes/absolute.landing.tsx": js`
export default function Component() {
return <h1>Landing</h1>
}
`,

"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 <h1>Page 2</h1>
}
`,
"app/routes/loader.external.ts": js`
import { redirect } from "@remix-run/node";
export const loader = () => {
Expand Down Expand Up @@ -215,55 +108,26 @@ 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);

await app.waitForNetworkAfter(() => app.goto("/loader/external"));
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 ({
Expand All @@ -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");
});
Expand Down

0 comments on commit 8cb33ce

Please sign in to comment.