fix(query): check existing keys

Fix #3341

Author: posva

package.json

@@ -68,13 +68,13 @@
     "babel-plugin-syntax-dynamic-import": "^6.18.0",
     "babel-preset-env": "^1.6.1",
     "babel-preset-flow-vue": "^1.0.0",
-    "browserstack-local": "^1.4.0",
+    "browserstack-local": "^1.4.8",
     "buble": "^0.19.8",
-    "chromedriver": "^83.0.0",
+    "chromedriver": "^86.0.0",
     "conventional-changelog-cli": "^2.0.11",
-    "cross-spawn": "^6.0.5",
+    "cross-spawn": "^7.0.3",
     "css-loader": "^2.1.1",
-    "dotenv": "^8.0.0",
+    "dotenv": "^8.2.0",
     "es6-promise": "^4.2.8",
     "eslint": "^4.19.1",
     "eslint-plugin-flowtype": "^2.46.1",
@@ -83,7 +83,7 @@
     "express": "^4.17.1",
     "express-urlrewrite": "^1.2.0",
     "flow-bin": "^0.66.0",
-    "geckodriver": "^1.19.1",
+    "geckodriver": "^1.20.0",
     "jasmine": "2.8.0",
     "lint-staged": "^8.2.0",
     "nightwatch": "^1.3.6",
@@ -99,9 +99,9 @@
     "selenium-server": "^3.141.59",
     "terser": "^4.2.0",
     "typescript": "^3.5.2",
-    "vue": "^2.6.11",
+    "vue": "^2.6.12",
     "vue-loader": "^15.9.3",
-    "vue-template-compiler": "^2.6.11",
+    "vue-template-compiler": "^2.6.12",
     "vuepress": "^1.5.3",
     "vuepress-theme-vue": "^1.1.1",
     "webpack": "^4.35.2",

src/util/route.js

@@ -96,13 +96,15 @@ export function isSameRoute (a: Route, b: ?Route): boolean {
 function isObjectEqual (a = {}, b = {}): boolean {
   // handle null value #1566
   if (!a || !b) return a === b
-  const aKeys = Object.keys(a)
-  const bKeys = Object.keys(b)
+  const aKeys = Object.keys(a).sort()
+  const bKeys = Object.keys(b).sort()
   if (aKeys.length !== bKeys.length) {
     return false
   }
-  return aKeys.every(key => {
+  return aKeys.every((key, i) => {
     const aVal = a[key]
+    const bKey = bKeys[i]
+    if (bKey !== key) return false
     const bVal = b[key]
     // query values can be null and undefined
     if (aVal == null || bVal == null) return aVal === bVal

test/unit/specs/route.spec.js

@@ -9,7 +9,7 @@ describe('Route utils', () => {
         query: { foo: 'bar', arr: [1, 2] }
       }
       const b = {
-        path: '/a/',  // Allow trailing slash
+        path: '/a/', // Allow trailing slash
         hash: '#hi',
         query: { arr: ['1', '2'], foo: 'bar' }
       }
@@ -66,6 +66,31 @@ describe('Route utils', () => {
       expect(isSameRoute(a, b)).toBe(true)
       expect(isSameRoute(a, c)).toBe(false)
     })
+
+    it('queries with undefined values', () => {
+      const a = {
+        path: '/abc',
+        query: { a: 'x' }
+      }
+      const b = {
+        path: '/abc',
+        query: { id: undefined }
+      }
+      const c = {
+        path: '/abc',
+        query: {}
+      }
+      expect(() => isSameRoute(a, b)).not.toThrow()
+      expect(() => isSameRoute(a, c)).not.toThrow()
+      expect(() => isSameRoute(b, c)).not.toThrow()
+      expect(isSameRoute(a, b)).toBe(false)
+      expect(isSameRoute(a, c)).toBe(false)
+      // NOTE: in reality this should be true but because we check queries as
+      // objects, they are different objects. We should check queries as their
+      // string representation instead
+      expect(isSameRoute(b, c)).toBe(false)
+      expect(isSameRoute(c, b)).toBe(false)
+    })
   })
 
   describe('isIncludedRoute', () => {