fix(vue-router): Prev route last pathname incorrect

packages/vue-router/package.json

@@ -16,7 +16,8 @@
   "module": "./dist/index.esm.js",
   "types": "./dist/types/index.d.ts",
   "files": [
-    "dist/"
+    "dist/",
+    "dist-transpiled/"
   ],
   "repository": {
     "type": "git",
@@ -66,5 +67,15 @@
       "json",
       "jsx"
     ]
+  },
+  "eslintConfig": {
+    "root": true,
+    "parserOptions": {
+      "ecmaVersion": 6,
+      "sourceType": "module"
+    },
+    "env": {
+      "es6": true
+    }
   }
 }

packages/vue-router/src/locationHistory.ts

@@ -1,9 +1,15 @@
 import { RouteInfo } from './types';
 
+//@TODO: declare types
 export const createLocationHistory = () => {
   const locationHistory: RouteInfo[] = [];
+  const replacedRoutes: RouteInfo[] = [];
   const tabsHistory: { [k: string]: RouteInfo[] } = {};
 
+  /**
+   * @TODO: refactor method, add is misleading as the behavior could remove,replace or add, maybe a method called `handle`
+   * @param routeInfo
+   */
   const add = (routeInfo: RouteInfo) => {
     switch (routeInfo.routerAction) {
       case "replace":
@@ -41,43 +47,63 @@ export const createLocationHistory = () => {
     }
   }
 
+  /**
+   *
+   * @param routeInfo
+   */
   const replaceRoute = (routeInfo: RouteInfo) => {
     const routeInfos = getTabsHistory(routeInfo.tab);
-    routeInfos && routeInfos.pop();
+    if (routeInfos !== undefined) {
+      routeInfos.pop();
+    }
+
     locationHistory.pop();
     addRoute(routeInfo);
   }
 
+  /**
+   *
+   * @param routeInfo
+   */
   const pop = (routeInfo: RouteInfo) => {
     const tabHistory = getTabsHistory(routeInfo.tab);
-    let ri;
+    let _routeInfo
     if (tabHistory) {
+      /**
+       * When navigating between tabs, each tab is added onto history stack, but using device back we will pop all instances of that tab from the stack
+       */
       // Pop all routes until we are back
-      ri = tabHistory[tabHistory.length - 1];
-      while (ri && ri.id !== routeInfo.id) {
+      _routeInfo = lastTab(routeInfo.tab);// tabHistory[tabHistory.length - 1];
+      while (_routeInfo && _routeInfo.id !== routeInfo.id) {
         tabHistory.pop();
-        ri = tabHistory[tabHistory.length - 1];
+        _routeInfo = lastTab(routeInfo.tab);
       }
       // Replace with updated route
       tabHistory.pop();
       tabHistory.push(routeInfo);
     }
 
-    ri = locationHistory[locationHistory.length - 1];
-    while (ri && ri.id !== routeInfo.id) {
+    _routeInfo = last();
+    while (_routeInfo && _routeInfo.id !== routeInfo.id) {
       locationHistory.pop();
-      ri = locationHistory[locationHistory.length - 1];
+      _routeInfo = last();
     }
     // Replace with updated route
     locationHistory.pop();
     locationHistory.push(routeInfo);
   }
 
+  /**
+   *
+   * @param routeInfo
+   */
   const addRoute = (routeInfo: RouteInfo) => {
     const tabHistory = getTabsHistory(routeInfo.tab);
     if (tabHistory) {
       // If the latest routeInfo is the same (going back and forth between tabs), replace it
-      if (tabHistory[tabHistory.length - 1] && tabHistory[tabHistory.length - 1].id === routeInfo.id) {
+      const previousTabHistory = tabHistory[tabHistory.length - 1];
+      const hasPreviousHistory = previousTabHistory !== undefined;
+      if (hasPreviousHistory && previousTabHistory.id === routeInfo.id) {
         tabHistory.pop();
       }
       tabHistory.push(routeInfo);
@@ -91,6 +117,11 @@ export const createLocationHistory = () => {
       tabsHistory[key] = [];
     });
   }
+
+  /**
+   *
+   * @param tab
+   */
   const getTabsHistory = (tab: string): RouteInfo[] => {
     let history;
     if (tab) {
@@ -105,15 +136,40 @@ export const createLocationHistory = () => {
 
   const size = () => locationHistory.length;
 
-  const updateByHistoryPosition = (routeInfo: RouteInfo, updateEntries: boolean) => {
+  /**
+   * When performing a router.replace, we need to replace the routeInfo at the route index
+   * @param routeInfo
+   */
+  const updateByHistoryPosition = (routeInfo: RouteInfo) => {
     const existingRouteIndex = locationHistory.findIndex(r => r.position === routeInfo.position);
-    if (existingRouteIndex === -1) return;
+    if (existingRouteIndex === -1) {
+      console.error('Trying to update history position for non-existing route');
+      return;
+    }
 
-    locationHistory[existingRouteIndex].pathname = routeInfo.pathname;
+    let previous = locationHistory[existingRouteIndex];
 
-    if (updateEntries) {
-      locationHistory[existingRouteIndex].pushedByRoute = routeInfo.pushedByRoute;
+    //is a different matchedPath, same matched paths do not need to be replaced
+    if (previous.matchedPath !== routeInfo.matchedPath) {
+      replacedRoutes.push(previous);
     }
+
+    locationHistory[existingRouteIndex] = routeInfo;
+  }
+
+  /**
+   * When a route is `updateByHistoryPosition` and replaced, it is added to replacedRoutes
+   */
+  const getReplacedRoutes = () => {
+    return replacedRoutes;
+  }
+
+  /**
+   * When the RouteInfo is properly demounted, remove from here
+   * @param index
+   */
+  const clearReplacedRouteByIndex = (index: number) => {
+    replacedRoutes.splice(index, 1);
   }
 
   /**
@@ -131,9 +187,31 @@ export const createLocationHistory = () => {
     const index = currentHistory - initialHistory;
     return locationHistory[index] || last();
   }
+
+  /**
+   *
+   * @param index
+   */
+  const getHistoryByIndex = (index: number) => {
+    return locationHistory[index];
+  }
+
+  /**
+   * This assumes the user is at the current index
+   */
   const previous = () => locationHistory[locationHistory.length - 2] || last();
+  /**
+   * This assumes the user is at the current index
+   */
   const last = () => locationHistory[locationHistory.length - 1];
+  const lastTab = (tab: string) => {
+    let tabHistory = getTabsHistory(tab);
+    if (tabHistory === undefined) {
+      return undefined;
+    }
 
+    return tabHistory[tabHistory.length - 1];
+  }
   /**
    * With the introduction of router.go support, we no longer remove
    * items from locationHistory as they may be needed again in the future.
@@ -162,6 +240,32 @@ export const createLocationHistory = () => {
     return undefined;
   }
 
+  /**
+   *
+   * @param routeInfo
+   * @param delta
+   */
+  const findTabLastLocation = (routeInfo: RouteInfo, delta: number = -1): RouteInfo | undefined => {
+    const routeInfos = getTabsHistory(routeInfo.tab);
+    if (routeInfos === undefined) {
+      return undefined;
+    }
+    if (delta < -1) {
+      return routeInfos[routeInfos.length - 1 + delta];
+    }
+
+    for (let i = routeInfos.length - 2; i >= 0; i--) {
+      const ri = routeInfos[i];
+      if (ri) {
+        if (ri.pathname === routeInfo.pushedByRoute) {
+          return ri;
+        }
+      }
+    }
+
+    return undefined;
+  }
+
   /**
    * Finds and returns the previous view based upon
    * what originally pushed it (pushedByRoute).
@@ -173,39 +277,33 @@ export const createLocationHistory = () => {
    * not update pushedByRoute anyways.
    */
   const findLastLocation = (routeInfo: RouteInfo, delta: number = -1): RouteInfo | undefined => {
-    const routeInfos = getTabsHistory(routeInfo.tab);
-    if (routeInfos) {
-      if (delta < -1) {
-        return routeInfos[routeInfos.length - 1 + delta];
-      } else {
-        for (let i = routeInfos.length - 2; i >= 0; i--) {
-          const ri = routeInfos[i];
-          if (ri) {
-            if (ri.pathname === routeInfo.pushedByRoute) {
-              return ri;
-            }
-          }
-        }
-      }
+    const lastTabLocation = findTabLastLocation(routeInfo, delta);
+    if (lastTabLocation !== undefined) {
+      return lastTabLocation;
     }
+
     if (delta < -1) {
       return locationHistory[locationHistory.length - 1 + delta];
-    } else {
-      for (let i = locationHistory.length - 2; i >= 0; i--) {
-        const ri = locationHistory[i];
-        if (ri) {
-          if (ri.pathname === routeInfo.pushedByRoute) {
-            return ri;
-          }
+    }
+
+    for (let i = locationHistory.length - 2; i >= 0; i--) {
+      const ri = locationHistory[i];
+      if (ri) {
+        if (ri.pathname === routeInfo.pushedByRoute) {
+          return ri;
         }
       }
     }
+
     return undefined;
   }
 
   return {
     current,
     updateByHistoryPosition,
+    getHistoryByIndex,
+    getReplacedRoutes,
+    clearReplacedRouteByIndex,
     size,
     last,
     previous,