kdu-router 3.0.7 → 3.1.7

package/dist/kdu-router.esm.browser.js

@@ -1,5 +1,5 @@
 /*!
-  * kdu-router v3.0.7
+  * kdu-router v3.1.7
   * (c) 2022 NKDuy
   * @license MIT
   */
@@ -12,7 +12,7 @@ function assert (condition, message) {
 }
 
 function warn (condition, message) {
-  if ("development" !== 'production' && !condition) {
+  if ( !condition) {
     typeof console !== 'undefined' && console.warn(`[kdu-router] ${message}`);
   }
 }
@@ -21,6 +21,14 @@ function isError (err) {
   return Object.prototype.toString.call(err).indexOf('Error') > -1
 }
 
+function isExtendedError (constructor, err) {
+  return (
+    err instanceof constructor ||
+    // _name is to support IE9 too
+    (err && (err.name === constructor.name || err._name === constructor._name))
+  )
+}
+
 function extend (a, b) {
   for (const key in b) {
     a[key] = b[key];
@@ -53,14 +61,12 @@ var View = {
     let depth = 0;
     let inactive = false;
     while (parent && parent._routerRoot !== parent) {
-      const knodeData = parent.$knode && parent.$knode.data;
-      if (knodeData) {
-        if (knodeData.routerView) {
-          depth++;
-        }
-        if (knodeData.keepAlive && parent._inactive) {
-          inactive = true;
-        }
+      const knodeData = parent.$knode ? parent.$knode.data : {};
+      if (knodeData.routerView) {
+        depth++;
+      }
+      if (knodeData.keepAlive && parent._directInactive && parent._inactive) {
+        inactive = true;
       }
       parent = parent.$parent;
     }
@@ -68,17 +74,32 @@ var View = {
 
     // render previous view if the tree is inactive and kept-alive
     if (inactive) {
-      return h(cache[name], data, children)
+      const cachedData = cache[name];
+      const cachedComponent = cachedData && cachedData.component;
+      if (cachedComponent) {
+        // #2301
+        // pass props
+        if (cachedData.configProps) {
+          fillPropsinData(cachedComponent, data, cachedData.route, cachedData.configProps);
+        }
+        return h(cachedComponent, data, children)
+      } else {
+        // render previous empty view
+        return h()
+      }
     }
 
     const matched = route.matched[depth];
-    // render empty node if no matched route
-    if (!matched) {
+    const component = matched && matched.components[name];
+
+    // render empty node if no matched route or no config component
+    if (!matched || !component) {
       cache[name] = null;
       return h()
     }
 
-    const component = cache[name] = matched.components[name];
+    // cache component
+    cache[name] = { component };
 
     // attach instance registration hook
     // this will be called in the instance's injected lifecycle hooks
@@ -110,23 +131,35 @@ var View = {
       }
     };
 
-    // resolve props
-    let propsToPass = data.props = resolveProps(route, matched.props && matched.props[name]);
-    if (propsToPass) {
-      // clone to prevent mutation
-      propsToPass = data.props = extend({}, propsToPass);
-      // pass non-declared props as attrs
-      const attrs = data.attrs = data.attrs || {};
-      for (const key in propsToPass) {
-        if (!component.props || !(key in component.props)) {
-          attrs[key] = propsToPass[key];
-          delete propsToPass[key];
-        }
-      }
+    const configProps = matched.props && matched.props[name];
+    // save route and configProps in cachce
+    if (configProps) {
+      extend(cache[name], {
+        route,
+        configProps
+      });
+      fillPropsinData(component, data, route, configProps);
     }
 
     return h(component, data, children)
   }
+};
+
+function fillPropsinData (component, data, route, configProps) {
+  // resolve props
+  let propsToPass = data.props = resolveProps(route, configProps);
+  if (propsToPass) {
+    // clone to prevent mutation
+    propsToPass = data.props = extend({}, propsToPass);
+    // pass non-declared props as attrs
+    const attrs = data.attrs = data.attrs || {};
+    for (const key in propsToPass) {
+      if (!component.props || !(key in component.props)) {
+        attrs[key] = propsToPass[key];
+        delete propsToPass[key];
+      }
+    }
+  }
 }
 
 function resolveProps (route, config) {
@@ -175,7 +208,7 @@ function resolveQuery (
   try {
     parsedQuery = parse(query || '');
   } catch (e) {
-    "development" !== 'production' && warn(false, e.message);
+     warn(false, e.message);
     parsedQuery = {};
   }
   for (const key in extraQuery) {
@@ -254,7 +287,7 @@ function createRoute (
   redirectedFrom,
   router
 ) {
-  const stringifyQuery$$1 = router && router.options.stringifyQuery;
+  const stringifyQuery = router && router.options.stringifyQuery;
 
   let query = location.query || {};
   try {
@@ -268,11 +301,11 @@ function createRoute (
     hash: location.hash || '',
     query,
     params: location.params || {},
-    fullPath: getFullPath(location, stringifyQuery$$1),
+    fullPath: getFullPath(location, stringifyQuery),
     matched: record ? formatMatch(record) : []
   };
   if (redirectedFrom) {
-    route.redirectedFrom = getFullPath(redirectedFrom, stringifyQuery$$1);
+    route.redirectedFrom = getFullPath(redirectedFrom, stringifyQuery);
   }
   return Object.freeze(route)
 }
@@ -376,195 +409,6 @@ function queryIncludes (current, target) {
 
 /*  */
 
-// work around weird flow bug
-const toTypes = [String, Object];
-const eventTypes = [String, Array];
-
-var Link = {
-  name: 'RouterLink',
-  props: {
-    to: {
-      type: toTypes,
-      required: true
-    },
-    tag: {
-      type: String,
-      default: 'a'
-    },
-    exact: Boolean,
-    append: Boolean,
-    replace: Boolean,
-    activeClass: String,
-    exactActiveClass: String,
-    event: {
-      type: eventTypes,
-      default: 'click'
-    }
-  },
-  render (h) {
-    const router = this.$router;
-    const current = this.$route;
-    const { location, route, href } = router.resolve(this.to, current, this.append);
-
-    const classes = {};
-    const globalActiveClass = router.options.linkActiveClass;
-    const globalExactActiveClass = router.options.linkExactActiveClass;
-    // Support global empty active class
-    const activeClassFallback = globalActiveClass == null
-      ? 'router-link-active'
-      : globalActiveClass;
-    const exactActiveClassFallback = globalExactActiveClass == null
-      ? 'router-link-exact-active'
-      : globalExactActiveClass;
-    const activeClass = this.activeClass == null
-      ? activeClassFallback
-      : this.activeClass;
-    const exactActiveClass = this.exactActiveClass == null
-      ? exactActiveClassFallback
-      : this.exactActiveClass;
-    const compareTarget = location.path
-      ? createRoute(null, location, null, router)
-      : route;
-
-    classes[exactActiveClass] = isSameRoute(current, compareTarget);
-    classes[activeClass] = this.exact
-      ? classes[exactActiveClass]
-      : isIncludedRoute(current, compareTarget);
-
-    const handler = e => {
-      if (guardEvent(e)) {
-        if (this.replace) {
-          router.replace(location);
-        } else {
-          router.push(location);
-        }
-      }
-    };
-
-    const on = { click: guardEvent };
-    if (Array.isArray(this.event)) {
-      this.event.forEach(e => { on[e] = handler; });
-    } else {
-      on[this.event] = handler;
-    }
-
-    const data = {
-      class: classes
-    };
-
-    if (this.tag === 'a') {
-      data.on = on;
-      data.attrs = { href };
-    } else {
-      // find the first <a> child and apply listener and href
-      const a = findAnchor(this.$slots.default);
-      if (a) {
-        // in case the <a> is a static node
-        a.isStatic = false;
-        const aData = a.data = extend({}, a.data);
-        aData.on = on;
-        const aAttrs = a.data.attrs = extend({}, a.data.attrs);
-        aAttrs.href = href;
-      } else {
-        // doesn't have <a> child, apply listener to self
-        data.on = on;
-      }
-    }
-
-    return h(this.tag, data, this.$slots.default)
-  }
-}
-
-function guardEvent (e) {
-  // don't redirect with control keys
-  if (e.metaKey || e.altKey || e.ctrlKey || e.shiftKey) return
-  // don't redirect when preventDefault called
-  if (e.defaultPrevented) return
-  // don't redirect on right click
-  if (e.button !== undefined && e.button !== 0) return
-  // don't redirect if `target="_blank"`
-  if (e.currentTarget && e.currentTarget.getAttribute) {
-    const target = e.currentTarget.getAttribute('target');
-    if (/\b_blank\b/i.test(target)) return
-  }
-  // this may be a Weex event which doesn't have this method
-  if (e.preventDefault) {
-    e.preventDefault();
-  }
-  return true
-}
-
-function findAnchor (children) {
-  if (children) {
-    let child;
-    for (let i = 0; i < children.length; i++) {
-      child = children[i];
-      if (child.tag === 'a') {
-        return child
-      }
-      if (child.children && (child = findAnchor(child.children))) {
-        return child
-      }
-    }
-  }
-}
-
-let _Kdu;
-
-function install (Kdu) {
-  if (install.installed && _Kdu === Kdu) return
-  install.installed = true;
-
-  _Kdu = Kdu;
-
-  const isDef = v => v !== undefined;
-
-  const registerInstance = (vm, callVal) => {
-    let i = vm.$options._parentKnode;
-    if (isDef(i) && isDef(i = i.data) && isDef(i = i.registerRouteInstance)) {
-      i(vm, callVal);
-    }
-  };
-
-  Kdu.mixin({
-    beforeCreate () {
-      if (isDef(this.$options.router)) {
-        this._routerRoot = this;
-        this._router = this.$options.router;
-        this._router.init(this);
-        Kdu.util.defineReactive(this, '_route', this._router.history.current);
-      } else {
-        this._routerRoot = (this.$parent && this.$parent._routerRoot) || this;
-      }
-      registerInstance(this, this);
-    },
-    destroyed () {
-      registerInstance(this);
-    }
-  });
-
-  Object.defineProperty(Kdu.prototype, '$router', {
-    get () { return this._routerRoot._router }
-  });
-
-  Object.defineProperty(Kdu.prototype, '$route', {
-    get () { return this._routerRoot._route }
-  });
-
-  Kdu.component('RouterView', View);
-  Kdu.component('RouterLink', Link);
-
-  const strats = Kdu.config.optionMergeStrategies;
-  // use the same hook merging strategy for route hooks
-  strats.beforeRouteEnter = strats.beforeRouteLeave = strats.beforeRouteUpdate = strats.created;
-}
-
-/*  */
-
-const inBrowser = typeof window !== 'undefined';
-
-/*  */
-
 function resolvePath (
   relative,
   base,
@@ -1052,51 +896,356 @@ function pathToRegexp (path, keys, options) {
 
   options = options || {};
 
-  if (path instanceof RegExp) {
-    return regexpToRegexp(path, /** @type {!Array} */ (keys))
-  }
+  if (path instanceof RegExp) {
+    return regexpToRegexp(path, /** @type {!Array} */ (keys))
+  }
+
+  if (isarray(path)) {
+    return arrayToRegexp(/** @type {!Array} */ (path), /** @type {!Array} */ (keys), options)
+  }
+
+  return stringToRegexp(/** @type {string} */ (path), /** @type {!Array} */ (keys), options)
+}
+pathToRegexp_1.parse = parse_1;
+pathToRegexp_1.compile = compile_1;
+pathToRegexp_1.tokensToFunction = tokensToFunction_1;
+pathToRegexp_1.tokensToRegExp = tokensToRegExp_1;
+
+/*  */
+
+// $flow-disable-line
+const regexpCompileCache = Object.create(null);
+
+function fillParams (
+  path,
+  params,
+  routeMsg
+) {
+  params = params || {};
+  try {
+    const filler =
+      regexpCompileCache[path] ||
+      (regexpCompileCache[path] = pathToRegexp_1.compile(path));
+
+    // Fix #2505 resolving asterisk routes { name: 'not-found', params: { pathMatch: '/not-found' }}
+    // and fix #3106 so that you can work with location descriptor object having params.pathMatch equal to empty string
+    if (typeof params.pathMatch === 'string') params[0] = params.pathMatch;
+
+    return filler(params, { pretty: true })
+  } catch (e) {
+    {
+      // Fix #3072 no warn if `pathMatch` is string
+      warn(typeof params.pathMatch === 'string', `missing param for ${routeMsg}: ${e.message}`);
+    }
+    return ''
+  } finally {
+    // delete the 0 if it was added
+    delete params[0];
+  }
+}
+
+/*  */
+
+function normalizeLocation (
+  raw,
+  current,
+  append,
+  router
+) {
+  let next = typeof raw === 'string' ? { path: raw } : raw;
+  // named target
+  if (next._normalized) {
+    return next
+  } else if (next.name) {
+    next = extend({}, raw);
+    const params = next.params;
+    if (params && typeof params === 'object') {
+      next.params = extend({}, params);
+    }
+    return next
+  }
+
+  // relative params
+  if (!next.path && next.params && current) {
+    next = extend({}, next);
+    next._normalized = true;
+    const params = extend(extend({}, current.params), next.params);
+    if (current.name) {
+      next.name = current.name;
+      next.params = params;
+    } else if (current.matched.length) {
+      const rawPath = current.matched[current.matched.length - 1].path;
+      next.path = fillParams(rawPath, params, `path ${current.path}`);
+    } else {
+      warn(false, `relative params navigation requires a current route.`);
+    }
+    return next
+  }
+
+  const parsedPath = parsePath(next.path || '');
+  const basePath = (current && current.path) || '/';
+  const path = parsedPath.path
+    ? resolvePath(parsedPath.path, basePath, append || next.append)
+    : basePath;
+
+  const query = resolveQuery(
+    parsedPath.query,
+    next.query,
+    router && router.options.parseQuery
+  );
+
+  let hash = next.hash || parsedPath.hash;
+  if (hash && hash.charAt(0) !== '#') {
+    hash = `#${hash}`;
+  }
+
+  return {
+    _normalized: true,
+    path,
+    query,
+    hash
+  }
+}
+
+/*  */
+
+// work around weird flow bug
+const toTypes = [String, Object];
+const eventTypes = [String, Array];
+
+const noop = () => {};
+
+var Link = {
+  name: 'RouterLink',
+  props: {
+    to: {
+      type: toTypes,
+      required: true
+    },
+    tag: {
+      type: String,
+      default: 'a'
+    },
+    exact: Boolean,
+    append: Boolean,
+    replace: Boolean,
+    activeClass: String,
+    exactActiveClass: String,
+    event: {
+      type: eventTypes,
+      default: 'click'
+    }
+  },
+  render (h) {
+    const router = this.$router;
+    const current = this.$route;
+    const { location, route, href } = router.resolve(
+      this.to,
+      current,
+      this.append
+    );
+
+    const classes = {};
+    const globalActiveClass = router.options.linkActiveClass;
+    const globalExactActiveClass = router.options.linkExactActiveClass;
+    // Support global empty active class
+    const activeClassFallback =
+      globalActiveClass == null ? 'router-link-active' : globalActiveClass;
+    const exactActiveClassFallback =
+      globalExactActiveClass == null
+        ? 'router-link-exact-active'
+        : globalExactActiveClass;
+    const activeClass =
+      this.activeClass == null ? activeClassFallback : this.activeClass;
+    const exactActiveClass =
+      this.exactActiveClass == null
+        ? exactActiveClassFallback
+        : this.exactActiveClass;
+
+    const compareTarget = route.redirectedFrom
+      ? createRoute(null, normalizeLocation(route.redirectedFrom), null, router)
+      : route;
+
+    classes[exactActiveClass] = isSameRoute(current, compareTarget);
+    classes[activeClass] = this.exact
+      ? classes[exactActiveClass]
+      : isIncludedRoute(current, compareTarget);
+
+    const handler = e => {
+      if (guardEvent(e)) {
+        if (this.replace) {
+          router.replace(location, noop);
+        } else {
+          router.push(location, noop);
+        }
+      }
+    };
+
+    const on = { click: guardEvent };
+    if (Array.isArray(this.event)) {
+      this.event.forEach(e => {
+        on[e] = handler;
+      });
+    } else {
+      on[this.event] = handler;
+    }
+
+    const data = { class: classes };
+
+    const scopedSlot =
+      !this.$scopedSlots.$hasNormal &&
+      this.$scopedSlots.default &&
+      this.$scopedSlots.default({
+        href,
+        route,
+        navigate: handler,
+        isActive: classes[activeClass],
+        isExactActive: classes[exactActiveClass]
+      });
+
+    if (scopedSlot) {
+      if (scopedSlot.length === 1) {
+        return scopedSlot[0]
+      } else if (scopedSlot.length > 1 || !scopedSlot.length) {
+        {
+          warn(
+            false,
+            `RouterLink with to="${
+              this.to
+            }" is trying to use a scoped slot but it didn't provide exactly one child. Wrapping the content with a span element.`
+          );
+        }
+        return scopedSlot.length === 0 ? h() : h('span', {}, scopedSlot)
+      }
+    }
+
+    if (this.tag === 'a') {
+      data.on = on;
+      data.attrs = { href };
+    } else {
+      // find the first <a> child and apply listener and href
+      const a = findAnchor(this.$slots.default);
+      if (a) {
+        // in case the <a> is a static node
+        a.isStatic = false;
+        const aData = (a.data = extend({}, a.data));
+        aData.on = aData.on || {};
+        // transform existing events in both objects into arrays so we can push later
+        for (const event in aData.on) {
+          const handler = aData.on[event];
+          if (event in on) {
+            aData.on[event] = Array.isArray(handler) ? handler : [handler];
+          }
+        }
+        // append new listeners for router-link
+        for (const event in on) {
+          if (event in aData.on) {
+            // on[event] is always a function
+            aData.on[event].push(on[event]);
+          } else {
+            aData.on[event] = handler;
+          }
+        }
+
+        const aAttrs = (a.data.attrs = extend({}, a.data.attrs));
+        aAttrs.href = href;
+      } else {
+        // doesn't have <a> child, apply listener to self
+        data.on = on;
+      }
+    }
+
+    return h(this.tag, data, this.$slots.default)
+  }
+};
+
+function guardEvent (e) {
+  // don't redirect with control keys
+  if (e.metaKey || e.altKey || e.ctrlKey || e.shiftKey) return
+  // don't redirect when preventDefault called
+  if (e.defaultPrevented) return
+  // don't redirect on right click
+  if (e.button !== undefined && e.button !== 0) return
+  // don't redirect if `target="_blank"`
+  if (e.currentTarget && e.currentTarget.getAttribute) {
+    const target = e.currentTarget.getAttribute('target');
+    if (/\b_blank\b/i.test(target)) return
+  }
+  // this may be a Weex event which doesn't have this method
+  if (e.preventDefault) {
+    e.preventDefault();
+  }
+  return true
+}
+
+function findAnchor (children) {
+  if (children) {
+    let child;
+    for (let i = 0; i < children.length; i++) {
+      child = children[i];
+      if (child.tag === 'a') {
+        return child
+      }
+      if (child.children && (child = findAnchor(child.children))) {
+        return child
+      }
+    }
+  }
+}
+
+let _Kdu;
+
+function install (Kdu) {
+  if (install.installed && _Kdu === Kdu) return
+  install.installed = true;
+
+  _Kdu = Kdu;
+
+  const isDef = v => v !== undefined;
+
+  const registerInstance = (vm, callVal) => {
+    let i = vm.$options._parentKnode;
+    if (isDef(i) && isDef(i = i.data) && isDef(i = i.registerRouteInstance)) {
+      i(vm, callVal);
+    }
+  };
+
+  Kdu.mixin({
+    beforeCreate () {
+      if (isDef(this.$options.router)) {
+        this._routerRoot = this;
+        this._router = this.$options.router;
+        this._router.init(this);
+        Kdu.util.defineReactive(this, '_route', this._router.history.current);
+      } else {
+        this._routerRoot = (this.$parent && this.$parent._routerRoot) || this;
+      }
+      registerInstance(this, this);
+    },
+    destroyed () {
+      registerInstance(this);
+    }
+  });
+
+  Object.defineProperty(Kdu.prototype, '$router', {
+    get () { return this._routerRoot._router }
+  });
+
+  Object.defineProperty(Kdu.prototype, '$route', {
+    get () { return this._routerRoot._route }
+  });
 
-  if (isarray(path)) {
-    return arrayToRegexp(/** @type {!Array} */ (path), /** @type {!Array} */ (keys), options)
-  }
+  Kdu.component('RouterView', View);
+  Kdu.component('RouterLink', Link);
 
-  return stringToRegexp(/** @type {string} */ (path), /** @type {!Array} */ (keys), options)
+  const strats = Kdu.config.optionMergeStrategies;
+  // use the same hook merging strategy for route hooks
+  strats.beforeRouteEnter = strats.beforeRouteLeave = strats.beforeRouteUpdate = strats.created;
 }
-pathToRegexp_1.parse = parse_1;
-pathToRegexp_1.compile = compile_1;
-pathToRegexp_1.tokensToFunction = tokensToFunction_1;
-pathToRegexp_1.tokensToRegExp = tokensToRegExp_1;
 
 /*  */
 
-// $flow-disable-line
-const regexpCompileCache = Object.create(null);
-
-function fillParams (
-  path,
-  params,
-  routeMsg
-) {
-  params = params || {};
-  try {
-    const filler =
-      regexpCompileCache[path] ||
-      (regexpCompileCache[path] = pathToRegexp_1.compile(path));
-
-    // Fix #2505 resolving asterisk routes { name: 'not-found', params: { pathMatch: '/not-found' }}
-    if (params.pathMatch) params[0] = params.pathMatch;
-
-    return filler(params, { pretty: true })
-  } catch (e) {
-    {
-      warn(false, `missing param for ${routeMsg}: ${e.message}`);
-    }
-    return ''
-  } finally {
-    // delete the 0 if it was added
-    delete params[0];
-  }
-}
+const inBrowser = typeof window !== 'undefined';
 
 /*  */
 
@@ -1126,6 +1275,18 @@ function createRouteMap (
     }
   }
 
+  {
+    // warn if routes do not include leading slashes
+    const found = pathList
+    // check for missing leading slash
+      .filter(path => path && path.charAt(0) !== '*' && path.charAt(0) !== '/');
+
+    if (found.length > 0) {
+      const pathNames = found.map(path => `- ${path}`).join('\n');
+      warn(false, `Non-nested routes must include a leading slash character. Fix the following routes: \n${pathNames}`);
+    }
+  }
+
   return {
     pathList,
     pathMap,
@@ -1146,17 +1307,15 @@ function addRouteRecord (
     assert(path != null, `"path" is required in a route configuration.`);
     assert(
       typeof route.component !== 'string',
-      `route config "component" for path: ${String(path || name)} cannot be a ` +
-      `string id. Use an actual component instead.`
+      `route config "component" for path: ${String(
+        path || name
+      )} cannot be a ` + `string id. Use an actual component instead.`
     );
   }
 
-  const pathToRegexpOptions = route.pathToRegexpOptions || {};
-  const normalizedPath = normalizePath(
-    path,
-    parent,
-    pathToRegexpOptions.strict
-  );
+  const pathToRegexpOptions =
+    route.pathToRegexpOptions || {};
+  const normalizedPath = normalizePath(path, parent, pathToRegexpOptions.strict);
 
   if (typeof route.caseSensitive === 'boolean') {
     pathToRegexpOptions.sensitive = route.caseSensitive;
@@ -1173,11 +1332,12 @@ function addRouteRecord (
     redirect: route.redirect,
     beforeEnter: route.beforeEnter,
     meta: route.meta || {},
-    props: route.props == null
-      ? {}
-      : route.components
-        ? route.props
-        : { default: route.props }
+    props:
+      route.props == null
+        ? {}
+        : route.components
+          ? route.props
+          : { default: route.props }
   };
 
   if (route.children) {
@@ -1185,14 +1345,20 @@ function addRouteRecord (
     // If users navigate to this route by name, the default child will
     // not be rendered (GH Issue #629)
     {
-      if (route.name && !route.redirect && route.children.some(child => /^\/?$/.test(child.path))) {
+      if (
+        route.name &&
+        !route.redirect &&
+        route.children.some(child => /^\/?$/.test(child.path))
+      ) {
         warn(
           false,
           `Named Route '${route.name}' has a default child route. ` +
-          `When navigating to this named route (:to="{name: '${route.name}'"), ` +
-          `the default child route will not be rendered. Remove the name from ` +
-          `this route and use the name of the default child route for named ` +
-          `links instead.`
+            `When navigating to this named route (:to="{name: '${
+              route.name
+            }'"), ` +
+            `the default child route will not be rendered. Remove the name from ` +
+            `this route and use the name of the default child route for named ` +
+            `links instead.`
         );
       }
     }
@@ -1204,12 +1370,24 @@ function addRouteRecord (
     });
   }
 
+  if (!pathMap[record.path]) {
+    pathList.push(record.path);
+    pathMap[record.path] = record;
+  }
+
   if (route.alias !== undefined) {
-    const aliases = Array.isArray(route.alias)
-      ? route.alias
-      : [route.alias];
+    const aliases = Array.isArray(route.alias) ? route.alias : [route.alias];
+    for (let i = 0; i < aliases.length; ++i) {
+      const alias = aliases[i];
+      if ( alias === path) {
+        warn(
+          false,
+          `Found an alias with the same value as the path: "${path}". You have to remove that alias. It will be ignored in development.`
+        );
+        // skip in dev to make it work
+        continue
+      }
 
-    aliases.forEach(alias => {
       const aliasRoute = {
         path: alias,
         children: route.children
@@ -1222,40 +1400,45 @@ function addRouteRecord (
         parent,
         record.path || '/' // matchAs
       );
-    });
-  }
-
-  if (!pathMap[record.path]) {
-    pathList.push(record.path);
-    pathMap[record.path] = record;
+    }
   }
 
   if (name) {
     if (!nameMap[name]) {
       nameMap[name] = record;
-    } else if ("development" !== 'production' && !matchAs) {
+    } else if ( !matchAs) {
       warn(
         false,
         `Duplicate named routes definition: ` +
-        `{ name: "${name}", path: "${record.path}" }`
+          `{ name: "${name}", path: "${record.path}" }`
       );
     }
   }
 }
 
-function compileRouteRegex (path, pathToRegexpOptions) {
+function compileRouteRegex (
+  path,
+  pathToRegexpOptions
+) {
   const regex = pathToRegexp_1(path, [], pathToRegexpOptions);
   {
     const keys = Object.create(null);
     regex.keys.forEach(key => {
-      warn(!keys[key.name], `Duplicate param keys in route with path: "${path}"`);
+      warn(
+        !keys[key.name],
+        `Duplicate param keys in route with path: "${path}"`
+      );
       keys[key.name] = true;
     });
   }
   return regex
 }
 
-function normalizePath (path, parent, strict) {
+function normalizePath (
+  path,
+  parent,
+  strict
+) {
   if (!strict) path = path.replace(/\/$/, '');
   if (path[0] === '/') return path
   if (parent == null) return path
@@ -1264,64 +1447,6 @@ function normalizePath (path, parent, strict) {
 
 /*  */
 
-function normalizeLocation (
-  raw,
-  current,
-  append,
-  router
-) {
-  let next = typeof raw === 'string' ? { path: raw } : raw;
-  // named target
-  if (next._normalized) {
-    return next
-  } else if (next.name) {
-    return extend({}, raw)
-  }
-
-  // relative params
-  if (!next.path && next.params && current) {
-    next = extend({}, next);
-    next._normalized = true;
-    const params = extend(extend({}, current.params), next.params);
-    if (current.name) {
-      next.name = current.name;
-      next.params = params;
-    } else if (current.matched.length) {
-      const rawPath = current.matched[current.matched.length - 1].path;
-      next.path = fillParams(rawPath, params, `path ${current.path}`);
-    } else {
-      warn(false, `relative params navigation requires a current route.`);
-    }
-    return next
-  }
-
-  const parsedPath = parsePath(next.path || '');
-  const basePath = (current && current.path) || '/';
-  const path = parsedPath.path
-    ? resolvePath(parsedPath.path, basePath, append || next.append)
-    : basePath;
-
-  const query = resolveQuery(
-    parsedPath.query,
-    next.query,
-    router && router.options.parseQuery
-  );
-
-  let hash = next.hash || parsedPath.hash;
-  if (hash && hash.charAt(0) !== '#') {
-    hash = `#${hash}`;
-  }
-
-  return {
-    _normalized: true,
-    path,
-    query,
-    hash
-  }
-}
-
-/*  */
-
 
 
 function createMatcher (
@@ -1512,6 +1637,28 @@ function resolveRecordPath (path, record) {
 
 /*  */
 
+// use User Timing api (if present) for more accurate key precision
+const Time =
+  inBrowser && window.performance && window.performance.now
+    ? window.performance
+    : Date;
+
+function genStateKey () {
+  return Time.now().toFixed(3)
+}
+
+let _key = genStateKey();
+
+function getStateKey () {
+  return _key
+}
+
+function setStateKey (key) {
+  return (_key = key)
+}
+
+/*  */
+
 const positionStore = Object.create(null);
 
 function setupScroll () {
@@ -1522,7 +1669,10 @@ function setupScroll () {
   // location.host contains the port and location.hostname doesn't
   const protocolAndPath = window.location.protocol + '//' + window.location.host;
   const absolutePath = window.location.href.replace(protocolAndPath, '');
-  window.history.replaceState({ key: getStateKey() }, '', absolutePath);
+  // preserve existing history state as it could be overriden by the user
+  const stateCopy = extend({}, window.history.state);
+  stateCopy.key = getStateKey();
+  window.history.replaceState(stateCopy, '', absolutePath);
   window.addEventListener('popstate', e => {
     saveScrollPosition();
     if (e.state && e.state.key) {
@@ -1553,20 +1703,27 @@ function handleScroll (
   // wait until re-render finishes before scrolling
   router.app.$nextTick(() => {
     const position = getScrollPosition();
-    const shouldScroll = behavior.call(router, to, from, isPop ? position : null);
+    const shouldScroll = behavior.call(
+      router,
+      to,
+      from,
+      isPop ? position : null
+    );
 
     if (!shouldScroll) {
       return
     }
 
     if (typeof shouldScroll.then === 'function') {
-      shouldScroll.then(shouldScroll => {
-        scrollToPosition((shouldScroll), position);
-      }).catch(err => {
-        {
-          assert(false, err.toString());
-        }
-      });
+      shouldScroll
+        .then(shouldScroll => {
+          scrollToPosition((shouldScroll), position);
+        })
+        .catch(err => {
+          {
+            assert(false, err.toString());
+          }
+        });
     } else {
       scrollToPosition(shouldScroll, position);
     }
@@ -1622,12 +1779,22 @@ function isNumber (v) {
   return typeof v === 'number'
 }
 
+const hashStartsWithNumberRE = /^#\d/;
+
 function scrollToPosition (shouldScroll, position) {
   const isObject = typeof shouldScroll === 'object';
   if (isObject && typeof shouldScroll.selector === 'string') {
-    const el = document.querySelector(shouldScroll.selector);
+    // getElementById would still fail if the selector contains a more complicated query like #main[data-attr]
+    // but at the same time, it doesn't make much sense to select an element with an id and an extra selector
+    const el = hashStartsWithNumberRE.test(shouldScroll.selector) // $flow-disable-line
+      ? document.getElementById(shouldScroll.selector.slice(1)) // $flow-disable-line
+      : document.querySelector(shouldScroll.selector);
+
     if (el) {
-      let offset = shouldScroll.offset && typeof shouldScroll.offset === 'object' ? shouldScroll.offset : {};
+      let offset =
+        shouldScroll.offset && typeof shouldScroll.offset === 'object'
+          ? shouldScroll.offset
+          : {};
       offset = normalizeOffset(offset);
       position = getElementPosition(el, offset);
     } else if (isValidPosition(shouldScroll)) {
@@ -1644,39 +1811,22 @@ function scrollToPosition (shouldScroll, position) {
 
 /*  */
 
-const supportsPushState = inBrowser && (function () {
-  const ua = window.navigator.userAgent;
-
-  if (
-    (ua.indexOf('Android 2.') !== -1 || ua.indexOf('Android 4.0') !== -1) &&
-    ua.indexOf('Mobile Safari') !== -1 &&
-    ua.indexOf('Chrome') === -1 &&
-    ua.indexOf('Windows Phone') === -1
-  ) {
-    return false
-  }
-
-  return window.history && 'pushState' in window.history
-})();
-
-// use User Timing api (if present) for more accurate key precision
-const Time = inBrowser && window.performance && window.performance.now
-  ? window.performance
-  : Date;
-
-let _key = genKey();
+const supportsPushState =
+  inBrowser &&
+  (function () {
+    const ua = window.navigator.userAgent;
 
-function genKey () {
-  return Time.now().toFixed(3)
-}
-
-function getStateKey () {
-  return _key
-}
+    if (
+      (ua.indexOf('Android 2.') !== -1 || ua.indexOf('Android 4.0') !== -1) &&
+      ua.indexOf('Mobile Safari') !== -1 &&
+      ua.indexOf('Chrome') === -1 &&
+      ua.indexOf('Windows Phone') === -1
+    ) {
+      return false
+    }
 
-function setStateKey (key) {
-  _key = key;
-}
+    return window.history && 'pushState' in window.history
+  })();
 
 function pushState (url, replace) {
   saveScrollPosition();
@@ -1685,10 +1835,12 @@ function pushState (url, replace) {
   const history = window.history;
   try {
     if (replace) {
-      history.replaceState({ key: _key }, '', url);
+      // preserve existing history state as it could be overriden by the user
+      const stateCopy = extend({}, history.state);
+      stateCopy.key = getStateKey();
+      history.replaceState(stateCopy, '', url);
     } else {
-      _key = genKey();
-      history.pushState({ key: _key }, '', url);
+      history.pushState({ key: setStateKey(genStateKey()) }, '', url);
     }
   } catch (e) {
     window.location[replace ? 'replace' : 'assign'](url);
@@ -1753,7 +1905,7 @@ function resolveAsyncComponents (matched) {
 
         const reject = once(reason => {
           const msg = `Failed to resolve async component ${key}: ${reason}`;
-          "development" !== 'production' && warn(false, msg);
+           warn(false, msg);
           if (!error) {
             error = isError(reason)
               ? reason
@@ -1824,6 +1976,29 @@ function once (fn) {
   }
 }
 
+class NavigationDuplicated extends Error {
+  constructor (normalizedLocation) {
+    super();
+    this.name = this._name = 'NavigationDuplicated';
+    // passing the message to super() doesn't seem to work in the transpiled version
+    this.message = `Navigating to current location ("${
+      normalizedLocation.fullPath
+    }") is not allowed`;
+    // add a stack property so services like Sentry can correctly display it
+    Object.defineProperty(this, 'stack', {
+      value: new Error().stack,
+      writable: true,
+      configurable: true
+    });
+    // we could also have used
+    // Error.captureStackTrace(this, this.constructor)
+    // but it only exists on node and chrome
+  }
+}
+
+// support IE9
+NavigationDuplicated._name = 'NavigationDuplicated';
+
 /*  */
 
 class History {
@@ -1875,35 +2050,52 @@ class History {
     this.errorCbs.push(errorCb);
   }
 
-  transitionTo (location, onComplete, onAbort) {
+  transitionTo (
+    location,
+    onComplete,
+    onAbort
+  ) {
     const route = this.router.match(location, this.current);
-    this.confirmTransition(route, () => {
-      this.updateRoute(route);
-      onComplete && onComplete(route);
-      this.ensureURL();
-
-      // fire ready cbs once
-      if (!this.ready) {
-        this.ready = true;
-        this.readyCbs.forEach(cb => { cb(route); });
-      }
-    }, err => {
-      if (onAbort) {
-        onAbort(err);
-      }
-      if (err && !this.ready) {
-        this.ready = true;
-        this.readyErrorCbs.forEach(cb => { cb(err); });
+    this.confirmTransition(
+      route,
+      () => {
+        this.updateRoute(route);
+        onComplete && onComplete(route);
+        this.ensureURL();
+
+        // fire ready cbs once
+        if (!this.ready) {
+          this.ready = true;
+          this.readyCbs.forEach(cb => {
+            cb(route);
+          });
+        }
+      },
+      err => {
+        if (onAbort) {
+          onAbort(err);
+        }
+        if (err && !this.ready) {
+          this.ready = true;
+          this.readyErrorCbs.forEach(cb => {
+            cb(err);
+          });
+        }
       }
-    });
+    );
   }
 
   confirmTransition (route, onComplete, onAbort) {
     const current = this.current;
     const abort = err => {
-      if (isError(err)) {
+      // When the user navigates through history through back/forward buttons
+      // we do not want to throw the error. We only throw it if directly calling
+      // push/replace. That's why it's not included in isError
+      if (!isExtendedError(NavigationDuplicated, err) && isError(err)) {
         if (this.errorCbs.length) {
-          this.errorCbs.forEach(cb => { cb(err); });
+          this.errorCbs.forEach(cb => {
+            cb(err);
+          });
         } else {
           warn(false, 'uncaught error during route navigation:');
           console.error(err);
@@ -1917,14 +2109,13 @@ class History {
       route.matched.length === current.matched.length
     ) {
       this.ensureURL();
-      return abort()
+      return abort(new NavigationDuplicated(route))
     }
 
-    const {
-      updated,
-      deactivated,
-      activated
-    } = resolveQueue(this.current.matched, route.matched);
+    const { updated, deactivated, activated } = resolveQueue(
+      this.current.matched,
+      route.matched
+    );
 
     const queue = [].concat(
       // in-component leave guards
@@ -1952,10 +2143,8 @@ class History {
             abort(to);
           } else if (
             typeof to === 'string' ||
-            (typeof to === 'object' && (
-              typeof to.path === 'string' ||
-              typeof to.name === 'string'
-            ))
+            (typeof to === 'object' &&
+              (typeof to.path === 'string' || typeof to.name === 'string'))
           ) {
             // next('/') or next({ path: '/' }) -> redirect
             abort();
@@ -1989,7 +2178,9 @@ class History {
         onComplete(route);
         if (this.router.app) {
           this.router.app.$nextTick(() => {
-            postEnterCbs.forEach(cb => { cb(); });
+            postEnterCbs.forEach(cb => {
+              cb();
+            });
           });
         }
       });
@@ -2093,9 +2284,13 @@ function extractEnterGuards (
   cbs,
   isValid
 ) {
-  return extractGuards(activated, 'beforeRouteEnter', (guard, _, match, key) => {
-    return bindEnterGuard(guard, match, key, cbs, isValid)
-  })
+  return extractGuards(
+    activated,
+    'beforeRouteEnter',
+    (guard, _, match, key) => {
+      return bindEnterGuard(guard, match, key, cbs, isValid)
+    }
+  )
 }
 
 function bindEnterGuard (
@@ -2237,38 +2432,49 @@ class HashHistory extends History {
       setupScroll();
     }
 
-    window.addEventListener(supportsPushState ? 'popstate' : 'hashchange', () => {
-      const current = this.current;
-      if (!ensureSlash()) {
-        return
-      }
-      this.transitionTo(getHash(), route => {
-        if (supportsScroll) {
-          handleScroll(this.router, route, current, true);
-        }
-        if (!supportsPushState) {
-          replaceHash(route.fullPath);
+    window.addEventListener(
+      supportsPushState ? 'popstate' : 'hashchange',
+      () => {
+        const current = this.current;
+        if (!ensureSlash()) {
+          return
         }
-      });
-    });
+        this.transitionTo(getHash(), route => {
+          if (supportsScroll) {
+            handleScroll(this.router, route, current, true);
+          }
+          if (!supportsPushState) {
+            replaceHash(route.fullPath);
+          }
+        });
+      }
+    );
   }
 
   push (location, onComplete, onAbort) {
     const { current: fromRoute } = this;
-    this.transitionTo(location, route => {
-      pushHash(route.fullPath);
-      handleScroll(this.router, route, fromRoute, false);
-      onComplete && onComplete(route);
-    }, onAbort);
+    this.transitionTo(
+      location,
+      route => {
+        pushHash(route.fullPath);
+        handleScroll(this.router, route, fromRoute, false);
+        onComplete && onComplete(route);
+      },
+      onAbort
+    );
   }
 
   replace (location, onComplete, onAbort) {
     const { current: fromRoute } = this;
-    this.transitionTo(location, route => {
-      replaceHash(route.fullPath);
-      handleScroll(this.router, route, fromRoute, false);
-      onComplete && onComplete(route);
-    }, onAbort);
+    this.transitionTo(
+      location,
+      route => {
+        replaceHash(route.fullPath);
+        handleScroll(this.router, route, fromRoute, false);
+        onComplete && onComplete(route);
+      },
+      onAbort
+    );
   }
 
   go (n) {
@@ -2290,9 +2496,7 @@ class HashHistory extends History {
 function checkFallback (base) {
   const location = getLocation(base);
   if (!/^\/#/.test(location)) {
-    window.location.replace(
-      cleanPath(base + '/#' + location)
-    );
+    window.location.replace(cleanPath(base + '/#' + location));
     return true
   }
 }
@@ -2320,10 +2524,11 @@ function getHash () {
   const searchIndex = href.indexOf('?');
   if (searchIndex < 0) {
     const hashIndex = href.indexOf('#');
-    if (hashIndex > -1) href = decodeURI(href.slice(0, hashIndex)) + href.slice(hashIndex);
-    else href = decodeURI(href);
+    if (hashIndex > -1) {
+      href = decodeURI(href.slice(0, hashIndex)) + href.slice(hashIndex);
+    } else href = decodeURI(href);
   } else {
-    if (searchIndex > -1) href = decodeURI(href.slice(0, searchIndex)) + href.slice(searchIndex);
+    href = decodeURI(href.slice(0, searchIndex)) + href.slice(searchIndex);
   }
 
   return href
@@ -2365,18 +2570,26 @@ class AbstractHistory extends History {
   }
 
   push (location, onComplete, onAbort) {
-    this.transitionTo(location, route => {
-      this.stack = this.stack.slice(0, this.index + 1).concat(route);
-      this.index++;
-      onComplete && onComplete(route);
-    }, onAbort);
+    this.transitionTo(
+      location,
+      route => {
+        this.stack = this.stack.slice(0, this.index + 1).concat(route);
+        this.index++;
+        onComplete && onComplete(route);
+      },
+      onAbort
+    );
   }
 
   replace (location, onComplete, onAbort) {
-    this.transitionTo(location, route => {
-      this.stack = this.stack.slice(0, this.index).concat(route);
-      onComplete && onComplete(route);
-    }, onAbort);
+    this.transitionTo(
+      location,
+      route => {
+        this.stack = this.stack.slice(0, this.index).concat(route);
+        onComplete && onComplete(route);
+      },
+      onAbort
+    );
   }
 
   go (n) {
@@ -2385,10 +2598,18 @@ class AbstractHistory extends History {
       return
     }
     const route = this.stack[targetIndex];
-    this.confirmTransition(route, () => {
-      this.index = targetIndex;
-      this.updateRoute(route);
-    });
+    this.confirmTransition(
+      route,
+      () => {
+        this.index = targetIndex;
+        this.updateRoute(route);
+      },
+      err => {
+        if (isExtendedError(NavigationDuplicated, err)) {
+          this.index = targetIndex;
+        }
+      }
+    );
   }
 
   getCurrentLocation () {
@@ -2471,7 +2692,7 @@ class KduRouter {
   }
 
   init (app /* Kdu component instance */) {
-    "development" !== 'production' && assert(
+     assert(
       install.installed,
       `not installed. Make sure to call \`Kdu.use(KduRouter)\` ` +
       `before creating root instance.`
@@ -2540,11 +2761,25 @@ class KduRouter {
   }
 
   push (location, onComplete, onAbort) {
-    this.history.push(location, onComplete, onAbort);
+    // $flow-disable-line
+    if (!onComplete && !onAbort && typeof Promise !== 'undefined') {
+      return new Promise((resolve, reject) => {
+        this.history.push(location, resolve, reject);
+      })
+    } else {
+      this.history.push(location, onComplete, onAbort);
+    }
   }
 
   replace (location, onComplete, onAbort) {
-    this.history.replace(location, onComplete, onAbort);
+    // $flow-disable-line
+    if (!onComplete && !onAbort && typeof Promise !== 'undefined') {
+      return new Promise((resolve, reject) => {
+        this.history.replace(location, resolve, reject);
+      })
+    } else {
+      this.history.replace(location, onComplete, onAbort);
+    }
   }
 
   go (n) {
@@ -2623,7 +2858,7 @@ function createHref (base, fullPath, mode) {
 }
 
 KduRouter.install = install;
-KduRouter.version = '3.0.7';
+KduRouter.version = '3.1.7';
 
 if (inBrowser && window.Kdu) {
   window.Kdu.use(KduRouter);