feat(warn): warn multiple params with same name

Author: posva

__tests__/warnings.spec.ts

@@ -146,4 +146,21 @@ describe('warnings', () => {
     await expect(router.push({ path: '//not-valid' })).resolves.toBe(undefined)
     expect('cannot start with multiple slashes').toHaveBeenWarned()
   })
+
+  it('warns if path contains the same param multiple times', () => {
+    const history = createMemoryHistory()
+    createRouter({
+      history,
+      routes: [
+        {
+          path: '/:id',
+          component,
+          children: [{ path: ':id', component }],
+        },
+      ],
+    })
+    expect(
+      'duplicated params with name "id" for path "/:id/:id"'
+    ).toHaveBeenWarned()
+  })
 })

src/matcher/pathMatcher.ts

@@ -5,6 +5,7 @@ import {
   PathParserOptions,
 } from './pathParserRanker'
 import { tokenizePath } from './pathTokenizer'
+import { warn } from '../warning'
 
 export interface RouteRecordMatcher extends PathParser {
   record: RouteRecord
@@ -20,6 +21,19 @@ export function createRouteRecordMatcher(
   options?: PathParserOptions
 ): RouteRecordMatcher {
   const parser = tokensToParser(tokenizePath(record.path), options)
+
+  // warn against params with the same name
+  if (__DEV__) {
+    const existingKeys = new Set<string>()
+    for (const key of parser.keys) {
+      if (existingKeys.has(key.name))
+        warn(
+          `Found duplicated params with name "${key.name}" for path "${record.path}". Only the last one will be available on "$route.params".`
+        )
+      existingKeys.add(key.name)
+    }
+  }
+
   const matcher: RouteRecordMatcher = {
     ...parser,
     record,