fix(types): allow simpler type check of route records (#1453)

Fix #1452

diff --git a/packages/router/__tests__/matcher/resolve.spec.ts b/packages/router/__tests__/matcher/resolve.spec.ts
index 3e13f666adc39e1ad80cc2c0a0e28fc69853e57f..672e79bb3d6b65c81f138c820ea45bed0f70999f 100644 (file)
--- a/packages/router/__tests__/matcher/resolve.spec.ts
+++ b/packages/router/__tests__/matcher/resolve.spec.ts
@@ -42,11 +42,9 @@ describe('RouterMatcher.resolve', () => {
       throw new Error('not handled')
     } else {
       // use one single record
-      // @ts-expect-error: One way or the other it false
       if (!resolved.matched) resolved.matched = record.map(normalizeRouteRecord)
       // allow passing an expect.any(Array)
       else if (Array.isArray(resolved.matched))
-        // @ts-expect-error: same as above
         resolved.matched = resolved.matched.map(m => ({
           ...normalizeRouteRecord(m as any),
           aliasOf: m.aliasOf,

diff --git a/packages/router/src/matcher/index.ts b/packages/router/src/matcher/index.ts
index e6d2ceac4b67f37adcf5fead716c46143b033bcc..eda41a87ea10360a0bc66799a899056aaa3e5a46 100644 (file)
--- a/packages/router/src/matcher/index.ts
+++ b/packages/router/src/matcher/index.ts
@@ -159,7 +159,7 @@ export function createRouterMatcher(
           removeRoute(record.name)
       }
 
-      if ('children' in mainNormalizedRecord) {
+      if (mainNormalizedRecord.children) {
         const children = mainNormalizedRecord.children
         for (let i = 0; i < children.length; i++) {
           addRoute(
@@ -353,7 +353,6 @@ export function normalizeRouteRecord(
     aliasOf: undefined,
     beforeEnter: record.beforeEnter,
     props: normalizeRecordProps(record),
-    // @ts-expect-error: record.children only exists in some cases
     children: record.children || [],
     instances: {},
     leaveGuards: new Set(),

diff --git a/packages/router/src/matcher/types.ts b/packages/router/src/matcher/types.ts
index f48c752215f962f834c2a2805a22f14d1d7cffa4..a4288610ea419e5ca100ec169d80d755ef26c6e2 100644 (file)
--- a/packages/router/src/matcher/types.ts
+++ b/packages/router/src/matcher/types.ts
@@ -4,7 +4,7 @@ import {
   _RouteRecordBase,
   _RouteRecordProps,
   NavigationGuardNextCallback,
-  RouteRecordSingleViewWithChildren,
+  RouteRecordRaw,
 } from '../types'
 import { ComponentPublicInstance } from 'vue'
 
@@ -32,7 +32,7 @@ export interface RouteRecordNormalized {
   /**
    * Nested route records.
    */
-  children: RouteRecordSingleViewWithChildren['children']
+  children: RouteRecordRaw[]
   /**
    * {@inheritDoc _RouteRecordBase.meta}
    */

diff --git a/packages/router/src/types/index.ts b/packages/router/src/types/index.ts
index b13e936d9c05296bdec479543d7ffe9a4edcc65e..865d510f0df27a0332af9388b56fe8c9501e18a6 100644 (file)
--- a/packages/router/src/types/index.ts
+++ b/packages/router/src/types/index.ts
@@ -262,6 +262,11 @@ export interface _RouteRecordBase extends PathParserOptions {
    * Arbitrary data attached to the record.
    */
   meta?: RouteMeta
+
+  /**
+   * Array of nested routes.
+   */
+  children?: RouteRecordRaw[]
 }
 
 /**
@@ -298,6 +303,9 @@ export interface RouteRecordSingleView extends _RouteRecordBase {
    */
   component: RawRouteComponent
   components?: never
+  children?: never
+  redirect?: never
+
   /**
    * Allow passing down params as props to the component rendered by `router-view`.
    */
@@ -314,9 +322,6 @@ export interface RouteRecordSingleViewWithChildren extends _RouteRecordBase {
   component?: RawRouteComponent | null | undefined
   components?: never
 
-  /**
-   * Array of nested routes.
-   */
   children: RouteRecordRaw[]
 
   /**
@@ -334,6 +339,8 @@ export interface RouteRecordMultipleViews extends _RouteRecordBase {
    */
   components: Record<string, RawRouteComponent>
   component?: never
+  children?: never
+  redirect?: never
 
   /**
    * Allow passing down params as props to the component rendered by
@@ -352,6 +359,7 @@ export interface RouteRecordMultipleViewsWithChildren extends _RouteRecordBase {
    */
   components?: Record<string, RawRouteComponent> | null | undefined
   component?: never
+  redirect?: never
 
   children: RouteRecordRaw[]
 

diff --git a/packages/router/test-dts/perfNamedRoutes.test-d.ts b/packages/router/test-dts/perfNamedRoutes.test-d.ts
deleted file mode 100644 (file)
index 4b841f5..0000000
--- a/packages/router/test-dts/perfNamedRoutes.test-d.ts
+++ /dev/null
@@ -1,182 +0,0 @@
-import { createRouter, createMemoryHistory } from '.'
-import { defineComponent } from 'vue'
-
-const Home = defineComponent({})
-const User = defineComponent({})
-const LongView = defineComponent({})
-const component = defineComponent({})
-
-const router = createRouter({
-  history: createMemoryHistory(),
-  routes: [
-    { path: '/home', redirect: '/' },
-    {
-      path: '/',
-      components: { default: Home, other: component },
-    },
-    {
-      path: '/always-redirect',
-      component,
-    },
-    { path: '/users/:id', name: 'user', component: User, props: true },
-    { path: '/documents/:id', name: 'docs', component: User, props: true },
-    { path: '/optional/:id?', name: 'optional', component: User, props: true },
-    // { path: encodeURI('/n/€'), name: 'euro', component },
-    { path: '/n/:n', name: 'increment', component },
-    { path: '/multiple/:a/:b', name: 'multiple', component },
-    { path: '/long-:n', name: 'long', component: LongView },
-    {
-      path: '/lazy',
-      component,
-    },
-    {
-      path: '/with-guard/:n',
-      name: 'guarded',
-      component,
-    },
-    { path: '/cant-leave', component },
-    {
-      path: '/children',
-      name: 'WithChildren',
-      component,
-      children: [
-        { path: '', alias: 'alias', name: 'default-child', component },
-        { path: 'a', name: 'a-child', component },
-        {
-          path: 'b',
-          name: 'WithChildrenB',
-          component,
-          children: [
-            {
-              path: '',
-              name: 'b-child',
-              component,
-            },
-            { path: 'a2', component },
-            { path: 'b2', component },
-          ],
-        },
-      ],
-    },
-    { path: '/with-data', component, name: 'WithData' },
-    { path: '/rep/:a*', component, name: 'repeat' },
-    { path: '/:data(.*)' as '/:data', component, name: 'NotFound' },
-    {
-      path: '/nested',
-      alias: '/anidado',
-      component,
-      name: 'Nested',
-      children: [
-        {
-          path: 'nested',
-          alias: 'a',
-          name: 'NestedNested',
-          component,
-          children: [
-            {
-              name: 'NestedNestedNested',
-              path: 'nested',
-              component,
-            },
-          ],
-        },
-        {
-          path: 'other',
-          alias: 'otherAlias',
-          component,
-          name: 'NestedOther',
-        },
-        {
-          path: 'also-as-absolute',
-          alias: '/absolute',
-          name: 'absolute-child',
-          component,
-        },
-      ],
-    },
-
-    {
-      path: '/parent/:id',
-      name: 'parent',
-      component,
-      props: true,
-      alias: '/p/:id',
-      children: [
-        // empty child
-        { path: '', name: 'child-id', component },
-        // child with absolute path. we need to add an `id` because the parent needs it
-        { path: '/p_:id/absolute-a', alias: 'as-absolute-a', component },
-        // same as above but the alias is absolute
-        { path: 'as-absolute-b', alias: '/p_:id/absolute-b', component },
-      ],
-    },
-    {
-      path: '/dynamic',
-      name: 'dynamic',
-      component,
-      end: false,
-      strict: true,
-    },
-
-    {
-      path: '/admin',
-      children: [
-        { path: '', component },
-        { path: 'dashboard', component },
-        { path: 'settings', component },
-      ],
-    },
-  ] as const,
-})
-
-router.resolve('/hello')
-
-router.push('/admin')
-router.push('/admin2')
-router.push('/adminaoeu')
-router.push('/admin/settings')
-router.push('/admin')
-router.push('/admin')
-router.push('/children')
-router.push('/admin')
-router.push('/admin')
-router.push('/admin')
-router.push('/admin?[{}')
-router.push('/admin')
-router.push('/admin')
-router.push('/admin')
-router.push('/admin')
-router.push('/admin')
-router.push('/admin')
-router.push('/admin')
-
-// router.pushNamed({name: ''})
-// router.pushNamed({ name: 'Nested' })
-
-export type LiteralUnion<LiteralType, BaseType extends string = string> =
-  | LiteralType
-  | (BaseType & Record<never, never>)
-
-// function pushStr(
-//   route: LiteralUnion<keyof RouteStaticPathMap<typeof routes>>
-// ) {}
-// pushStr('/admin/dashboard')
-
-// function push1(
-//   route: RouteNamedMap<typeof routes>[keyof RouteNamedMap<typeof routes>]
-// ) {}
-// push1({ })
-
-// function pushEnd(route: keyof RouteNamedMap<typeof routes>) {}
-
-// pushEnd('NotFound')
-
-// function push(
-//   route:
-//     | LiteralUnion<keyof RouteStaticPathMap<typeof routes>>
-//     | {
-//         name: keyof RouteNamedMap<typeof routes>
-//       }
-// ) {}
-
-// push('/documents/:id')

diff --git a/packages/router/test-dts/routeRecords.test-d.ts b/packages/router/test-dts/routeRecords.test-d.ts
index bcc59d9b35cf3f8f26a1a8b61aa0759ec5431a28..e806dad1c487fec0280dc14d9f665204b7462e0e 100644 (file)
--- a/packages/router/test-dts/routeRecords.test-d.ts
+++ b/packages/router/test-dts/routeRecords.test-d.ts
@@ -11,10 +11,29 @@ routes.push({ path: '/', redirect: '/foo' })
 // @ts-expect-error cannot have components and component at the same time
 routes.push({ path: '/', components, component })
 
+// a redirect record with children to point to a child
 routes.push({
   path: '/',
   redirect: '/foo',
-  children: [],
+  children: [
+    {
+      path: 'foo',
+      component,
+    },
+  ],
+})
+
+// same but with a nested route
+routes.push({
+  path: '/',
+  component,
+  redirect: '/foo',
+  children: [
+    {
+      path: 'foo',
+      component,
+    },
+  ],
 })
 
 routes.push({ path: '/', component, props: true })
@@ -29,3 +48,14 @@ routes.push({ path: '/', components, props: true })
 //   component,
 //   components,
 // }
+
+export function filterNestedChildren(children: RouteRecordRaw[]) {
+  return children.filter(r => {
+    if (r.redirect) {
+      r.children?.map(() => {})
+    }
+    if (r.children) {
+      r.children = filterNestedChildren(r.children)
+    }
+  })
+}