fix(matcher): remove unused params

posva · posva · commit e8875705eb8b · 2022-08-16T15:56:08.000+02:00
Fix #1497 NOTES: if you were relying on passing `params` that were not defined as part of the `path`, eg: having a route defined as follows: ```js { path: '/somewhere', name: 'somewhere' } ``` And pushing with an _artificial_ param: ```js router.push({ name: 'somewhere', params: { oops: 'gets removed' }}) ``` This change will break your app. This behavior has worked in some scenarios but has been **advised against** for years as it's an antipattern in routing. You can still put the data in `query` or as an actual param.
diff --git a/packages/router/__tests__/matcher/resolve.spec.ts b/packages/router/__tests__/matcher/resolve.spec.ts
@@ -775,6 +775,19 @@ describe('RouterMatcher.resolve', () => {
       )
     })
 
+    it('drops non existent params', () => {
+      assertRecordMatch(
+        { path: '/', name: 'home', components },
+        { name: 'home', params: { a: 'b' } },
+        { name: 'home', path: '/', params: {} }
+      )
+      assertRecordMatch(
+        { path: '/:b', name: 'a', components },
+        { name: 'a', params: { a: 'a', b: 'b' } },
+        { name: 'a', path: '/b', params: { b: 'b' } }
+      )
+    })
+
     it('drops optional params', () => {
       assertRecordMatch(
         { path: '/:a/:b?', name: 'p', components },
diff --git a/packages/router/src/matcher/index.ts b/packages/router/src/matcher/index.ts
@@ -256,7 +256,13 @@ export function createRouterMatcher(
           // TODO: only keep optional params coming from a parent record
           matcher.keys.filter(k => !k.optional).map(k => k.name)
         ),
-        location.params
+        // discard any existing params in the current location that do not exist here
+        // #1497 this ensures better active/exact matching
+        location.params &&
+          paramsFromLocation(
+            location.params,
+            matcher.keys.map(k => k.name)
+          )
       )
       // throws if cannot be stringified
       path = matcher.stringify(params)
@@ -275,7 +281,6 @@ export function createRouterMatcher(
       // matcher should have a value after the loop
 
       if (matcher) {
-        // TODO: dev warning of unused params if provided
         // we know the matcher works because we tested the regexp
         params = matcher.parse(path)!
         name = matcher.record.name
