Skip to content

Commit

Permalink
Add same fixes for flat routes
Browse files Browse the repository at this point in the history
  • Loading branch information
@brophdawg11
brophdawg11 committed Apr 21, 2023
1 parent a41fd13 commit 63400c6
Show file tree
Hide file tree
Showing 5 changed files with 396 additions and 15 deletions.
129 changes: 129 additions & 0 deletions integration/flat-routes-test.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -312,3 +312,132 @@ test.describe("", () => {
expect(buildOutput).not.toContain(`Route Path Collision`);
});
});

test.describe("pathless routes and route collisions", () => {
test.beforeAll(async () => {
fixture = await createFixture({
future: { v2_routeConvention: true },
files: {
"app/root.tsx": js`
import { Link, Outlet, Scripts, useMatches } from "@remix-run/react";
export default function App() {
let matches = 'Number of matches: ' + useMatches().length;
return (
<html lang="en">
<body>
<nav>
<Link to="/nested">/nested</Link>
<br />
<Link to="/nested/foo">/nested/foo</Link>
<br />
</nav>
<p>{matches}</p>
<Outlet />
<Scripts />
</body>
</html>
);
}
`,
"app/routes/nested._index.jsx": js`
export default function Index() {
return <h1>Index</h1>;
}
`,
"app/routes/nested._pathless.jsx": js`
import { Outlet } from "@remix-run/react";
export default function Layout() {
return (
<>
<div>Pathless Layout</div>
<Outlet />
</>
);
}
`,
"app/routes/nested._pathless.foo.jsx": js`
export default function Foo() {
return <h1>Foo</h1>;
}
`,
"app/routes/nested._pathless2.jsx": js`
import { Outlet } from "@remix-run/react";
export default function Layout() {
return (
<>
<div>Pathless 2 Layout</div>
<Outlet />
</>
);
}
`,
"app/routes/nested._pathless2.bar.jsx": js`
export default function Bar() {
return <h1>Bar</h1>;
}
`,
},
});

appFixture = await createAppFixture(fixture);
});

test.afterAll(async () => appFixture.close());

test.describe("with JavaScript", () => {
runTests();
});

test.describe("without JavaScript", () => {
test.use({ javaScriptEnabled: false });
runTests();
});

/**
* Routes for this test look like this, for reference for the matches assertions:
*
* <Routes>
* <Route file="root.jsx">
* <Route path="nested" file="routes/nested/__pathless.jsx">
* <Route path="foo" file="routes/nested/__pathless/foo.jsx" />
* </Route>
* <Route path="nested" index file="routes/nested/index.jsx" />
* <Route index file="routes/index.jsx" />
* </Route>
* </Routes>
*/

function runTests() {
test("displays index page and not pathless layout page", async ({
page,
}) => {
let app = new PlaywrightFixture(appFixture, page);
await app.goto("/nested");
expect(await app.getHtml()).toMatch("Index");
expect(await app.getHtml()).not.toMatch("Pathless Layout");
expect(await app.getHtml()).toMatch("Number of matches: 2");
});

test("displays page inside of pathless layout", async ({ page }) => {
let app = new PlaywrightFixture(appFixture, page);
await app.goto("/nested/foo");
expect(await app.getHtml()).not.toMatch("Index");
expect(await app.getHtml()).toMatch("Pathless Layout");
expect(await app.getHtml()).toMatch("Foo");
expect(await app.getHtml()).toMatch("Number of matches: 3");
});

// This also asserts that we support multiple sibling pathless route layouts
test("displays page inside of second pathless layout", async ({ page }) => {
let app = new PlaywrightFixture(appFixture, page);
await app.goto("/nested/bar");
expect(await app.getHtml()).not.toMatch("Index");
expect(await app.getHtml()).toMatch("Pathless 2 Layout");
expect(await app.getHtml()).toMatch("Bar");
expect(await app.getHtml()).toMatch("Number of matches: 3");
});
}
});
146 changes: 145 additions & 1 deletion integration/route-collisions-test.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -31,7 +31,7 @@ let LEAF_FILE_CONTENTS = js`
}
`;

test.describe("build failures", () => {
test.describe("build failures (v1 routes)", () => {
let errorLogs: string[];
let oldConsoleError: typeof console.error;

Expand All @@ -48,6 +48,7 @@ test.describe("build failures", () => {
test("detects path collisions inside pathless layout routes", async () => {
try {
await createFixture({
future: { v2_routeConvention: false },
files: {
"app/root.tsx": ROOT_FILE_CONTENTS,
"app/routes/foo.jsx": LEAF_FILE_CONTENTS,
Expand All @@ -67,6 +68,7 @@ test.describe("build failures", () => {
test("detects path collisions across pathless layout routes", async () => {
try {
await createFixture({
future: { v2_routeConvention: false },
files: {
"app/root.tsx": ROOT_FILE_CONTENTS,
"app/routes/__pathless.jsx": LAYOUT_FILE_CONTENTS,
Expand All @@ -87,6 +89,7 @@ test.describe("build failures", () => {
test("detects path collisions inside multiple pathless layout routes", async () => {
try {
await createFixture({
future: { v2_routeConvention: false },
files: {
"app/root.tsx": ROOT_FILE_CONTENTS,
"app/routes/foo.jsx": LEAF_FILE_CONTENTS,
Expand All @@ -107,6 +110,7 @@ test.describe("build failures", () => {
test("detects path collisions of index files inside pathless layouts", async () => {
try {
await createFixture({
future: { v2_routeConvention: false },
files: {
"app/root.tsx": ROOT_FILE_CONTENTS,
"app/routes/index.jsx": LEAF_FILE_CONTENTS,
Expand All @@ -126,6 +130,7 @@ test.describe("build failures", () => {
test("detects path collisions of index files across multiple pathless layouts", async () => {
try {
await createFixture({
future: { v2_routeConvention: false },
files: {
"app/root.tsx": ROOT_FILE_CONTENTS,
"app/routes/nested/__pathless.jsx": LAYOUT_FILE_CONTENTS,
Expand All @@ -146,6 +151,7 @@ test.describe("build failures", () => {
test("detects path collisions of param routes inside pathless layouts", async () => {
try {
await createFixture({
future: { v2_routeConvention: false },
files: {
"app/root.tsx": ROOT_FILE_CONTENTS,
"app/routes/$param.jsx": LEAF_FILE_CONTENTS,
Expand All @@ -162,3 +168,141 @@ test.describe("build failures", () => {
}
});
});

test.describe("build failures (v2 routes)", () => {
let errorLogs: string[];
let oldConsoleError: typeof console.error;

test.beforeEach(() => {
errorLogs = [];
oldConsoleError = console.error;
console.error = (str) => errorLogs.push(str);
});

test.afterEach(() => {
console.error = oldConsoleError;
});

test("detects path collisions inside pathless layout routes", async () => {
try {
await createFixture({
future: { v2_routeConvention: true },
files: {
"app/root.tsx": ROOT_FILE_CONTENTS,
"app/routes/foo.jsx": LEAF_FILE_CONTENTS,
"app/routes/_pathless.jsx": LAYOUT_FILE_CONTENTS,
"app/routes/_pathless.foo.jsx": LEAF_FILE_CONTENTS,
},
});
expect(false).toBe(true);
} catch (e) {
expect(errorLogs[0]).toMatch(
'Error: Path "foo" defined by route "routes/foo" conflicts with route "routes/__pathless/foo"'
);
expect(errorLogs.length).toBe(1);
}
});

test("detects path collisions across pathless layout routes", async () => {
try {
await createFixture({
future: { v2_routeConvention: true },
files: {
"app/root.tsx": ROOT_FILE_CONTENTS,
"app/routes/_pathless.jsx": LAYOUT_FILE_CONTENTS,
"app/routes/_pathless.foo.jsx": LEAF_FILE_CONTENTS,
"app/routes/_pathless2.jsx": LAYOUT_FILE_CONTENTS,
"app/routes/_pathless2.foo.jsx": LEAF_FILE_CONTENTS,
},
});
expect(false).toBe(true);
} catch (e) {
expect(errorLogs[0]).toMatch(
'Error: Path "foo" defined by route "routes/__pathless/foo" conflicts with route "routes/__pathless2/foo"'
);
expect(errorLogs.length).toBe(1);
}
});

test("detects path collisions inside multiple pathless layout routes", async () => {
try {
await createFixture({
future: { v2_routeConvention: true },
files: {
"app/root.tsx": ROOT_FILE_CONTENTS,
"app/routes/foo.jsx": LEAF_FILE_CONTENTS,
"app/routes/_pathless.jsx": LAYOUT_FILE_CONTENTS,
"app/routes/_pathless._again.jsx": LAYOUT_FILE_CONTENTS,
"app/routes/_pathless._again.foo.jsx": LEAF_FILE_CONTENTS,
},
});
expect(false).toBe(true);
} catch (e) {
expect(errorLogs[0]).toMatch(
'Error: Path "foo" defined by route "routes/foo" conflicts with route "routes/__pathless/__again/foo"'
);
expect(errorLogs.length).toBe(1);
}
});

test("detects path collisions of index files inside pathless layouts", async () => {
try {
await createFixture({
future: { v2_routeConvention: true },
files: {
"app/root.tsx": ROOT_FILE_CONTENTS,
"app/routes/_index.jsx": LEAF_FILE_CONTENTS,
"app/routes/_pathless.jsx": LAYOUT_FILE_CONTENTS,
"app/routes/_pathless._index.jsx": LEAF_FILE_CONTENTS,
},
});
expect(false).toBe(true);
} catch (e) {
expect(errorLogs[0]).toMatch(
'Error: Path "/" defined by route "routes/index" conflicts with route "routes/__pathless/index"'
);
expect(errorLogs.length).toBe(1);
}
});

test("detects path collisions of index files across multiple pathless layouts", async () => {
try {
await createFixture({
future: { v2_routeConvention: true },
files: {
"app/root.tsx": ROOT_FILE_CONTENTS,
"app/routes/nested._pathless.jsx": LAYOUT_FILE_CONTENTS,
"app/routes/nested._pathless._index.jsx": LEAF_FILE_CONTENTS,
"app/routes/nested._oops.jsx": LAYOUT_FILE_CONTENTS,
"app/routes/nested._oops._index.jsx": LEAF_FILE_CONTENTS,
},
});
expect(false).toBe(true);
} catch (e) {
expect(errorLogs[0]).toMatch(
'Error: Path "nested" defined by route "routes/nested/__oops/index" conflicts with route "routes/nested/__pathless/index"'
);
expect(errorLogs.length).toBe(1);
}
});

test("detects path collisions of param routes inside pathless layouts", async () => {
try {
await createFixture({
future: { v2_routeConvention: true },
files: {
"app/root.tsx": ROOT_FILE_CONTENTS,
"app/routes/$param.jsx": LEAF_FILE_CONTENTS,
"app/routes/_pathless.jsx": LAYOUT_FILE_CONTENTS,
"app/routes/_pathless.$param.jsx": LEAF_FILE_CONTENTS,
},
});
expect(false).toBe(true);
} catch (e) {
expect(errorLogs[0]).toMatch(
'Error: Path ":param" defined by route "routes/$param" conflicts with route "routes/__pathless/$param"'
);
expect(errorLogs.length).toBe(1);
}
});
});
Loading

0 comments on commit 63400c6

Please sign in to comment.