Repository: dai-shi/waku
Pull request #1020 (2024-11-27 05:38:45)

test: create pages tests to use new create pages

vercel[bot]: [vc]: #ab7Inc+j8b5VJwN1szp/ITWQySIOUV2EEyWf3ClUZeA=:eyJpc01vbm9yZXBvIjp0cnVlLCJ0eXBlIjoiZ2l0aHViIiwicHJvamVjdHMiOlt7Im5hbWUiOiJ3YWt1Iiwicm9vdERpcmVjdG9yeSI6bnVsbCwiaW5zcGVjdG9yVXJsIjoiaHR0cHM6Ly92ZXJjZWwuY29tL2RhaXNoaXMtcHJvamVjdHMvd2FrdS81TWhhY0dSbTJGMnpnQXlYcFZOOGNHWDdmam93IiwicHJldmlld1VybCI6Indha3UtZ2l0LWZvcmstdHlsZXJzYXlzaGktY3JlYXRlLXBhZ2VzLXRlc3RzLWRhaXNoaXMtcHJvamVjdHMudmVyY2VsLmFwcCIsIm5leHRDb21taXRTdGF0dXMiOiJQRU5ESU5HIn1dfQ==
**The latest updates on your projects**. Learn more about [Vercel for Git ↗︎](https://vercel.link/github-learn-more)

| Name | Status | Preview | Updated (UTC) |
| :--- | :----- | :------ | :------ |
| **waku** | 🔄 Building ([Inspect](https://vercel.com/daishis-projects/waku/5MhacGRm2F2zgAyXpVN8cGX7fjow)) | [Visit Preview](https://waku-git-fork-tylersayshi-create-pages-tests-daishis-projects.vercel.app) | Nov 27, 2024 5:38am |



Patch:
diff --git a/packages/waku/src/router/create-pages.ts b/packages/waku/src/router/create-pages.ts
index ac641cc4..324a3a21 100644
--- a/packages/waku/src/router/create-pages.ts
+++ b/packages/waku/src/router/create-pages.ts
@@ -588,7 +588,7 @@ export const new_createPages = <
           }
         });
         staticPathMap.set(
-          page.path,
+          '/' + pathItems.join('/'),
           pathItems.map((name) => ({ type: 'literal', name })),
         );
         const id = joinPath(...pathItems, 'page');


Test patch:
diff --git a/packages/waku/tests/create-pages.test.ts b/packages/waku/tests/create-pages.test.ts
index 3cf836ea..392cfc05 100644
--- a/packages/waku/tests/create-pages.test.ts
+++ b/packages/waku/tests/create-pages.test.ts
@@ -1,6 +1,6 @@
 import { expect, vi, describe, it, beforeEach, assert } from 'vitest';
 import type { MockedFunction } from 'vitest';
-import { createPages } from '../src/router/create-pages.js';
+import { new_createPages as createPages } from '../src/router/create-pages.js';
 import type {
   CreateLayout,
   CreatePage,
@@ -12,10 +12,8 @@ import type {
   PathWithWildcard,
   StaticSlugRoutePathsTuple,
 } from '../src/router/create-pages.js';
-import { unstable_defineRouter } from '../src/router/define-router.js';
-import { createElement } from 'react';
+import { new_defineRouter } from '../src/router/define-router.js';
 import type { PropsWithChildren } from 'react';
-import { renderToString } from 'react-dom/server';
 import { expectType } from 'ts-expect';
 import type { TypeEqual } from 'ts-expect';
 import type { PathsForPages } from '../src/router/base-types.js';
@@ -400,12 +398,12 @@ describe('type tests', () => {
   });
 });
 
-const defineRouterMock = unstable_defineRouter as MockedFunction<
-  typeof unstable_defineRouter
+const defineRouterMock = new_defineRouter as MockedFunction<
+  typeof new_defineRouter
 >;
 
 vi.mock('../src/router/define-router.js', () => ({
-  unstable_defineRouter: vi.fn(),
+  new_defineRouter: vi.fn(),
 }));
 
 beforeEach(() => {
@@ -414,11 +412,11 @@ beforeEach(() => {
 
 function injectedFunctions() {
   expect(defineRouterMock).toHaveBeenCalledTimes(1);
-  assert(defineRouterMock.mock.calls[0]?.[0]);
-  assert(defineRouterMock.mock.calls[0]?.[1]);
+  assert(defineRouterMock.mock.calls[0]?.[0].getPathConfig);
+  assert(defineRouterMock.mock.calls[0]?.[0].renderRoute);
   return {
-    getPathConfig: defineRouterMock.mock.calls[0][0],
-    getComponent: defineRouterMock.mock.calls[0][1],
+    getPathConfig: defineRouterMock.mock.calls[0][0].getPathConfig,
+    renderRoute: defineRouterMock.mock.calls[0][0].renderRoute,
   };
 }
 
@@ -432,12 +430,15 @@ describe('createPages', () => {
         component: TestPage,
       }),
     ]);
-    const { getPathConfig, getComponent } = injectedFunctions();
+    const { getPathConfig, renderRoute } = injectedFunctions();
 
     expect(await getPathConfig()).toEqual([
       {
-        data: undefined,
-        isStatic: true,
+        elements: {
+          root: { isStatic: true },
+          'page:/test': { isStatic: true },
+        },
+        routeElement: { isStatic: true },
         noSsr: false,
         path: [
           {
@@ -449,15 +450,12 @@ describe('createPages', () => {
       },
     ]);
 
-    const setShouldSkip = vi.fn();
-
-    expect(
-      await getComponent('test/page', {
-        unstable_setShouldSkip: setShouldSkip,
-      }),
-    ).toBe(TestPage);
-    expect(setShouldSkip).toHaveBeenCalledTimes(1);
-    expect(setShouldSkip).toHaveBeenCalledWith([]);
+    const route = await renderRoute('/test', {
+      query: '?skip=[]',
+    });
+    expect(route).toBeDefined();
+    expect(route.routeElement).toBeDefined();
+    expect(Object.keys(route.elements)).toEqual(['root', 'page:/test']);
   });
 
   it('creates a simple dynamic page', async () => {
@@ -469,11 +467,14 @@ describe('createPages', () => {
         component: TestPage,
       }),
     ]);
-    const { getPathConfig, getComponent } = injectedFunctions();
+    const { getPathConfig, renderRoute } = injectedFunctions();
     expect(await getPathConfig()).toEqual([
       {
-        data: undefined,
-        isStatic: false,
+        elements: {
+          root: { isStatic: true },
+          'page:/test': { isStatic: false },
+        },
+        routeElement: { isStatic: true },
         noSsr: false,
         path: [
           {
@@ -484,14 +485,12 @@ describe('createPages', () => {
         pattern: '^/test$',
       },
     ]);
-    const setShouldSkip = vi.fn();
-    expect(
-      await getComponent('test/page', {
-        unstable_setShouldSkip: setShouldSkip,
-      }),
-    ).toBe(TestPage);
-    expect(setShouldSkip).toHaveBeenCalledTimes(1);
-    expect(setShouldSkip).toHaveBeenCalledWith();
+    const route = await renderRoute('/test', {
+      query: '?skip=[]',
+    });
+    expect(route).toBeDefined();
+    expect(route.routeElement).toBeDefined();
+    expect(Object.keys(route.elements)).toEqual(['root', 'page:/test']);
   });
 
   it('creates a simple static page with a layout', async () => {
@@ -510,11 +509,15 @@ describe('createPages', () => {
       }),
     ]);
 
-    const { getPathConfig, getComponent } = injectedFunctions();
+    const { getPathConfig, renderRoute } = injectedFunctions();
     expect(await getPathConfig()).toEqual([
       {
-        data: undefined,
-        isStatic: true,
+        elements: {
+          'layout:/': { isStatic: true },
+          root: { isStatic: true },
+          'page:/test': { isStatic: true },
+        },
+        routeElement: { isStatic: true },
         noSsr: false,
         path: [
           {
@@ -525,24 +528,16 @@ describe('createPages', () => {
         pattern: '^/test$',
       },
     ]);
-
-    const setShouldSkip = vi.fn();
-    expect(
-      await getComponent('test/page', {
-        unstable_setShouldSkip: setShouldSkip,
-      }),
-    ).toBe(TestPage);
-    expect(setShouldSkip).toHaveBeenCalledTimes(1);
-    expect(setShouldSkip).toHaveBeenCalledWith([]);
-
-    const setShouldSkipLayout = vi.fn();
-    expect(
-      await getComponent('layout', {
-        unstable_setShouldSkip: setShouldSkipLayout,
-      }),
-    ).toBe(TestLayout);
-    expect(setShouldSkipLayout).toHaveBeenCalledTimes(1);
-    expect(setShouldSkipLayout).toHaveBeenCalledWith([]);
+    const route = await renderRoute('/test', {
+      query: '?skip=[]',
+    });
+    expect(route).toBeDefined();
+    expect(route.routeElement).toBeDefined();
+    expect(Object.keys(route.elements)).toEqual([
+      'root',
+      'page:/test',
+      'layout:/',
+    ]);
   });
 
   it('creates a simple dynamic page with a layout', async () => {
@@ -561,11 +556,15 @@ describe('createPages', () => {
       }),
     ]);
 
-    const { getPathConfig, getComponent } = injectedFunctions();
+    const { getPathConfig, renderRoute } = injectedFunctions();
     expect(await getPathConfig()).toEqual([
       {
-        data: undefined,
-        isStatic: false,
+        elements: {
+          'layout:/': { isStatic: false },
+          root: { isStatic: true },
+          'page:/test': { isStatic: false },
+        },
+        routeElement: { isStatic: true },
         noSsr: false,
         path: [
           {
@@ -577,23 +576,16 @@ describe('createPages', () => {
       },
     ]);
 
-    const setShouldSkip = vi.fn();
-    expect(
-      await getComponent('test/page', {
-        unstable_setShouldSkip: setShouldSkip,
-      }),
-    ).toBe(TestPage);
-    expect(setShouldSkip).toHaveBeenCalledTimes(1);
-    expect(setShouldSkip).toHaveBeenCalledWith();
-
-    const setShouldSkipLayout = vi.fn();
-    expect(
-      await getComponent('layout', {
-        unstable_setShouldSkip: setShouldSkipLayout,
-      }),
-    ).toBe(TestLayout);
-    expect(setShouldSkipLayout).toHaveBeenCalledTimes(1);
-    expect(setShouldSkipLayout).toHaveBeenCalledWith();
+    const route = await renderRoute('/test', {
+      query: '?skip=[]',
+    });
+    expect(route).toBeDefined();
+    expect(route.routeElement).toBeDefined();
+    expect(Object.keys(route.elements)).toEqual([
+      'root',
+      'page:/test',
+      'layout:/',
+    ]);
   });
 
   it('creates a nested static page', async () => {
@@ -605,11 +597,14 @@ describe('createPages', () => {
         component: TestPage,
       }),
     ]);
-    const { getPathConfig, getComponent } = injectedFunctions();
+    const { getPathConfig, renderRoute } = injectedFunctions();
     expect(await getPathConfig()).toEqual([
       {
-        data: undefined,
-        isStatic: true,
+        elements: {
+          root: { isStatic: true },
+          'page:/test/nested': { isStatic: true },
+        },
+        routeElement: { isStatic: true },
         noSsr: false,
         path: [
           {
@@ -624,14 +619,12 @@ describe('createPages', () => {
         pattern: '^/test/nested$',
       },
     ]);
-    const setShouldSkip = vi.fn();
-    expect(
-      await getComponent('test/nested/page', {
-        unstable_setShouldSkip: setShouldSkip,
-      }),
-    ).toBe(TestPage);
-    expect(setShouldSkip).toHaveBeenCalledTimes(1);
-    expect(setShouldSkip).toHaveBeenCalledWith([]);
+    const route = await renderRoute('/test/nested', {
+      query: '?skip=[]',
+    });
+    expect(route).toBeDefined();
+    expect(route.routeElement).toBeDefined();
+    expect(Object.keys(route.elements)).toEqual(['root', 'page:/test/nested']);
   });
 
   it('creates a nested dynamic page', async () => {
@@ -643,11 +636,14 @@ describe('createPages', () => {
         component: TestPage,
       }),
     ]);
-    const { getPathConfig, getComponent } = injectedFunctions();
+    const { getPathConfig, renderRoute } = injectedFunctions();
     expect(await getPathConfig()).toEqual([
       {
-        data: undefined,
-        isStatic: false,
+        elements: {
+          root: { isStatic: true },
+          'page:/test/nested': { isStatic: false },
+        },
+        routeElement: { isStatic: true },
         noSsr: false,
         path: [
           {
@@ -662,14 +658,13 @@ describe('createPages', () => {
         pattern: '^/test/nested$',
       },
     ]);
-    const setShouldSkip = vi.fn();
-    expect(
-      await getComponent('test/nested/page', {
-        unstable_setShouldSkip: setShouldSkip,
-      }),
-    ).toBe(TestPage);
-    expect(setShouldSkip).toHaveBeenCalledTimes(1);
-    expect(setShouldSkip).toHaveBeenCalledWith();
+
+    const route = await renderRoute('/test/nested', {
+      query: '?skip=[]',
+    });
+    expect(route).toBeDefined();
+    expect(route.routeElement).toBeDefined();
+    expect(Object.keys(route.elements)).toEqual(['root', 'page:/test/nested']);
   });
 
   it('creates a static page with slugs', async () => {
@@ -685,11 +680,14 @@ describe('createPages', () => {
         component: TestPage,
       }),
     ]);
-    const { getPathConfig, getComponent } = injectedFunctions();
+    const { getPathConfig, renderRoute } = injectedFunctions();
     expect(await getPathConfig()).toEqual([
       {
-        data: undefined,
-        isStatic: true,
+        elements: {
+          root: { isStatic: true },
+          'page:/test/w/x': { isStatic: true },
+        },
+        routeElement: { isStatic: true },
         noSsr: false,
         path: [
           {
@@ -705,11 +703,14 @@ describe('createPages', () => {
             type: 'literal',
           },
         ],
-        pattern: '^/test/([^/]+)/([^/]+)$',
+        pattern: '^/test/w/x$',
       },
       {
-        data: undefined,
-        isStatic: true,
+        elements: {
+          root: { isStatic: true },
+          'page:/test/y/z': { isStatic: true },
+        },
+        routeElement: { isStatic: true },
         noSsr: false,
         path: [
           {
@@ -725,19 +726,15 @@ describe('createPages', () => {
             type: 'literal',
           },
         ],
-        pattern: '^/test/([^/]+)/([^/]+)$',
+        pattern: '^/test/y/z$',
       },
     ]);
-    const setShouldSkip = vi.fn();
-    const WrappedComponent = await getComponent('test/w/x/page', {
-      unstable_setShouldSkip: setShouldSkip,
+    const route = await renderRoute('/test/y/z', {
+      query: '?skip=[]',
     });
-    assert(WrappedComponent);
-    expect(setShouldSkip).toHaveBeenCalledTimes(1);
-    expect(setShouldSkip).toHaveBeenCalledWith([]);
-    renderToString(createElement(WrappedComponent as any));
-    expect(TestPage).toHaveBeenCalledTimes(1);
-    expect(TestPage).toHaveBeenCalledWith({ a: 'w', b: 'x' }, undefined);
+    expect(route).toBeDefined();
+    expect(route.routeElement).toBeDefined();
+    expect(Object.keys(route.elements)).toEqual(['root', 'page:/test/y/z']);
   });
 
   it('creates a dynamic page with slugs', async () => {
@@ -749,11 +746,14 @@ describe('createPages', () => {
         component: TestPage,
       }),
     ]);
-    const { getPathConfig, getComponent } = injectedFunctions();
+    const { getPathConfig, renderRoute } = injectedFunctions();
     expect(await getPathConfig()).toEqual([
       {
-        data: undefined,
-        isStatic: false,
+        elements: {
+          root: { isStatic: true },
+          'page:/test/[a]/[b]': { isStatic: false },
+        },
+        routeElement: { isStatic: true },
         noSsr: false,
         path: [
           {
@@ -772,16 +772,12 @@ describe('createPages', () => {
         pattern: '^/test/([^/]+)/([^/]+)$',
       },
     ]);
-    const setShouldSkip = vi.fn();
-    const WrappedComponent = await getComponent('test/w/x/page', {
-      unstable_setShouldSkip: setShouldSkip,
+    const route = await renderRoute('/test/w/x', {
+      query: '?skip=[]',
     });
-    assert(WrappedComponent);
-    expect(setShouldSkip).toHaveBeenCalledTimes(1);
-    expect(setShouldSkip).toHaveBeenCalledWith();
-    renderToString(createElement(WrappedComponent as any));
-    expect(TestPage).toHaveBeenCalledTimes(1);
-    expect(TestPage).toHaveBeenCalledWith({ a: 'w', b: 'x' }, undefined);
+    expect(route).toBeDefined();
+    expect(route.routeElement).toBeDefined();
+    expect(Object.keys(route.elements)).toEqual(['root', 'page:/test/[a]/[b]']);
   });
 
   it('creates a static page with wildcards', async () => {
@@ -794,11 +790,14 @@ describe('createPages', () => {
         component: TestPage,
       }),
     ]);
-    const { getPathConfig, getComponent } = injectedFunctions();
+    const { getPathConfig, renderRoute } = injectedFunctions();
     expect(await getPathConfig()).toEqual([
       {
-        data: undefined,
-        isStatic: true,
+        elements: {
+          root: { isStatic: true },
+          'page:/test/a/b': { isStatic: true },
+        },
+        routeElement: { isStatic: true },
         noSsr: false,
         path: [
           {
@@ -814,19 +813,15 @@ describe('createPages', () => {
             type: 'literal',
           },
         ],
-        pattern: '^/test/(.*)$',
+        pattern: '^/test/a/b$',
       },
     ]);
-    const setShouldSkip = vi.fn();
-    const WrappedComponent = await getComponent('test/a/b/page', {
-      unstable_setShouldSkip: setShouldSkip,
+    const route = await renderRoute('/test/a/b', {
+      query: '?skip=[]',
     });
-    assert(WrappedComponent);
-    expect(setShouldSkip).toHaveBeenCalledTimes(1);
-    expect(setShouldSkip).toHaveBeenCalledWith([]);
-    renderToString(createElement(WrappedComponent as any));
-    expect(TestPage).toHaveBeenCalledTimes(1);
-    expect(TestPage).toHaveBeenCalledWith({ path: ['a', 'b'] }, undefined);
+    expect(route).toBeDefined();
+    expect(route.routeElement).toBeDefined();
+    expect(Object.keys(route.elements)).toEqual(['root', 'page:/test/a/b']);
   });
 
   it('creates a dynamic page with wildcards', async () => {
@@ -838,11 +833,14 @@ describe('createPages', () => {
         component: TestPage,
       }),
     ]);
-    const { getPathConfig, getComponent } = injectedFunctions();
+    const { getPathConfig, renderRoute } = injectedFunctions();
     expect(await getPathConfig()).toEqual([
       {
-        data: undefined,
-        isStatic: false,
+        routeElement: { isStatic: true },
+        elements: {
+          root: { isStatic: true },
+          'page:/test/[...path]': { isStatic: false },
+        },
         noSsr: false,
         path: [
           {
@@ -857,16 +855,15 @@ describe('createPages', () => {
         pattern: '^/test/(.*)$',
       },
     ]);
-    const setShouldSkip = vi.fn();
-    const WrappedComponent = await getComponent('test/a/b/page', {
-      unstable_setShouldSkip: setShouldSkip,
+    const route = await renderRoute('/test/a/b', {
+      query: '?skip=[]',
     });
-    assert(WrappedComponent);
-    expect(setShouldSkip).toHaveBeenCalledTimes(1);
-    expect(setShouldSkip).toHaveBeenCalledWith();
-    renderToString(createElement(WrappedComponent as any));
-    expect(TestPage).toHaveBeenCalledTimes(1);
-    expect(TestPage).toHaveBeenCalledWith({ path: ['a', 'b'] }, undefined);
+    expect(route).toBeDefined();
+    expect(route.routeElement).toBeDefined();
+    expect(Object.keys(route.elements)).toEqual([
+      'root',
+      'page:/test/[...path]',
+    ]);
   });
 
   it('fails if static paths do not match the slug pattern', async () => {
@@ -903,8 +900,11 @@ describe('createPages', () => {
     const { getPathConfig } = injectedFunctions();
     expect(await getPathConfig()).toEqual([
       {
-        data: undefined,
-        isStatic: true,
+        routeElement: { isStatic: true },
+        elements: {
+          root: { isStatic: true },
+          'page:/static': { isStatic: true },
+        },
         noSsr: true,
         path: [
           {
@@ -915,8 +915,11 @@ describe('createPages', () => {
         pattern: '^/static$',
       },
       {
-        data: undefined,
-        isStatic: false,
+        routeElement: { isStatic: true },
+        elements: {
+          root: { isStatic: true },
+          'page:/dynamic': { isStatic: false },
+        },
         noSsr: true,
         path: [
           {
@@ -993,10 +996,15 @@ describe('createPages', () => {
     const TestPage = vi.fn();
     complexTestRouter(createPages, TestPage);
 
-    const { getPathConfig, getComponent } = injectedFunctions();
+    const { getPathConfig, renderRoute } = injectedFunctions();
 
     expect(await getPathConfig()).toEqual([
       {
+        elements: {
+          root: { isStatic: true },
+          'page:/client/static': { isStatic: true },
+        },
+        routeElement: { isStatic: true },
         pattern: '^/client/static$',
         path: [
           {
@@ -1008,11 +1016,15 @@ describe('createPages', () => {
             name: 'static',
           },
         ],
-        isStatic: true,
         noSsr: false,
       },
       {
-        pattern: '^/server/static/([^/]+)$',
+        elements: {
+          root: { isStatic: true },
+          'page:/server/static/static-echo': { isStatic: true },
+        },
+        routeElement: { isStatic: true },
+        pattern: '^/server/static/static-echo$',
         path: [
           {
             type: 'literal',
@@ -1027,11 +1039,15 @@ describe('createPages', () => {
             name: 'static-echo',
           },
         ],
-        isStatic: true,
         noSsr: false,
       },
       {
-        pattern: '^/server/static/([^/]+)$',
+        elements: {
+          root: { isStatic: true },
+          'page:/server/static/static-echo-2': { isStatic: true },
+        },
+        routeElement: { isStatic: true },
+        pattern: '^/server/static/static-echo-2$',
         path: [
           {
             type: 'literal',
@@ -1046,11 +1062,15 @@ describe('createPages', () => {
             name: 'static-echo-2',
           },
         ],
-        isStatic: true,
         noSsr: false,
       },
       {
-        pattern: '^/server/static/([^/]+)/([^/]+)$',
+        elements: {
+          root: { isStatic: true },
+          'page:/server/static/static-echo/static-echo-2': { isStatic: true },
+        },
+        routeElement: { isStatic: true },
+        pattern: '^/server/static/static-echo/static-echo-2$',
         path: [
           {
             type: 'literal',
@@ -1069,11 +1089,15 @@ describe('createPages', () => {
             name: 'static-echo-2',
           },
         ],
-        isStatic: true,
         noSsr: false,
       },
       {
-        pattern: '^/server/static/([^/]+)/([^/]+)$',
+        elements: {
+          root: { isStatic: true },
+          'page:/server/static/hello/hello-2': { isStatic: true },
+        },
+        routeElement: { isStatic: true },
+        pattern: '^/server/static/hello/hello-2$',
         path: [
           {
             type: 'literal',
@@ -1092,11 +1116,15 @@ describe('createPages', () => {
             name: 'hello-2',
           },
         ],
-        isStatic: true,
         noSsr: false,
       },
       {
-        pattern: '^/static/wild/(.*)$',
+        elements: {
+          root: { isStatic: true },
+          'page:/static/wild/bar': { isStatic: true },
+        },
+        routeElement: { isStatic: true },
+        pattern: '^/static/wild/bar$',
         path: [
           {
             type: 'literal',
@@ -1111,11 +1139,15 @@ describe('createPages', () => {
             name: 'bar',
           },
         ],
-        isStatic: true,
         noSsr: false,
       },
       {
-        pattern: '^/static/wild/(.*)$',
+        elements: {
+          root: { isStatic: true },
+          'page:/static/wild/hello/hello-2': { isStatic: true },
+        },
+        routeElement: { isStatic: true },
+        pattern: '^/static/wild/hello/hello-2$',
         path: [
           {
             type: 'literal',
@@ -1134,11 +1166,15 @@ describe('createPages', () => {
             name: 'hello-2',
           },
         ],
-        isStatic: true,
         noSsr: false,
       },
       {
-        pattern: '^/static/wild/(.*)$',
+        elements: {
+          root: { isStatic: true },
+          'page:/static/wild/foo/foo-2/foo-3': { isStatic: true },
+        },
+        routeElement: { isStatic: true },
+        pattern: '^/static/wild/foo/foo-2/foo-3$',
         path: [
           {
             type: 'literal',
@@ -1161,10 +1197,14 @@ describe('createPages', () => {
             name: 'foo-3',
           },
         ],
-        isStatic: true,
         noSsr: false,
       },
       {
+        elements: {
+          root: { isStatic: true },
+          'page:/client/dynamic': { isStatic: false },
+        },
+        routeElement: { isStatic: true },
         pattern: '^/client/dynamic$',
         path: [
           {
@@ -1176,10 +1216,14 @@ describe('createPages', () => {
             name: 'dynamic',
           },
         ],
-        isStatic: false,
         noSsr: false,
       },
       {
+        elements: {
+          root: { isStatic: true },
+          'page:/server/one/[echo]': { isStatic: false },
+        },
+        routeElement: { isStatic: true },
         pattern: '^/server/one/([^/]+)$',
         path: [
           {
@@ -1195,10 +1239,14 @@ describe('createPages', () => {
             name: 'echo',
           },
         ],
-        isStatic: false,
         noSsr: false,
       },
       {
+        elements: {
+          root: { isStatic: true },
+          'page:/server/two/[echo]/[echo2]': { isStatic: false },
+        },
+        routeElement: { isStatic: true },
         pattern: '^/server/two/([^/]+)/([^/]+)$',
         path: [
           {
@@ -1218,10 +1266,14 @@ describe('createPages', () => {
             name: 'echo2',
           },
         ],
-        isStatic: false,
         noSsr: false,
       },
       {
+        elements: {
+          root: { isStatic: true },
+          'page:/server/wild/[...wild]': { isStatic: false },
+        },
+        routeElement: { isStatic: true },
         pattern: '^/server/wild/(.*)$',
         path: [
           {
@@ -1237,10 +1289,14 @@ describe('createPages', () => {
             name: 'wild',
           },
         ],
-        isStatic: false,
         noSsr: false,
       },
       {
+        elements: {
+          root: { isStatic: true },
+          'page:/server/oneAndWild/[slug]/[...wild]': { isStatic: false },
+        },
+        routeElement: { isStatic: true },
         pattern: '^/server/oneAndWild/([^/]+)/(.*)$',
         path: [
           {
@@ -1260,19 +1316,17 @@ describe('createPages', () => {
             name: 'wild',
           },
         ],
-        isStatic: false,
         noSsr: false,
       },
     ]);
-    const setShouldSkip = vi.fn();
-    const WrappedComponent = await getComponent('server/two/a/b/page', {
-      unstable_setShouldSkip: setShouldSkip,
+    const route = await renderRoute('/server/two/a/b', {
+      query: '?skip=[]',
     });
-    assert(WrappedComponent);
-    expect(setShouldSkip).toHaveBeenCalledTimes(1);
-    expect(setShouldSkip).toHaveBeenCalledWith();
-    renderToString(createElement(WrappedComponent as any));
-    expect(TestPage).toHaveBeenCalledTimes(1);
-    expect(TestPage).toHaveBeenCalledWith({ echo: 'a', echo2: 'b' }, undefined);
+    assert(route);
+    expect(route.routeElement).toBeDefined();
+    expect(Object.keys(route.elements)).toEqual([
+      'root',
+      'page:/server/two/[echo]/[echo2]',
+    ]);
   });
 });