Description
Version
3.0.1
Reproduction link
https://jsfiddle.net/c4jkw82o/5/
Steps to reproduce
The JSFiddle shows the broken case.
Given an app/router that includes a wildcard '*' route, calling addRoutes() to dynamically add more routes does not correctly render the page if the CURRENT url matches one of the newly added routes.
If you comment out the wildcard '*' route and re-run then it works as expected.
What is expected?
The "Test" component should be rendered
What is actually happening?
The "NotFound" component is rendered
BACKGROUND...
I am attempting to use webpack code splitting to keep all of my test related code in a different bundle, that includes vue components that are only used in the tests. I wanted to try to dynamically add my "/test" route from within this separate bundle and discovered that serving up that page showed my 404 not found component instead of my (top level) test component.
DEBUGGING NOTES...
From what I can tell, when the router is first constructed - in my main application.js bundle - it checks against the current URL "/test" and matches the wildcard route as $router.currentRoute. Later when the separate test.js bundle adds the new routes it checks again, this time it matches the new test route and tries to transition, but during confirmTransition() it decides that isSameRoute() is true (both matches had path=/test) and does not update.
... after checking isSameRoute() there is actually a small attempt to see if the routes were dynamically changed...
// in the case the route map has been dynamically appended to
route.matched.length === current.matched.length
.. but in this case this check also (incorrectly) returns true because while the length is the same (1) the details of route.matched[0] are different - current.matched is pointing to the wildcard route but route.matched is pointing to the new test route.
P.S. THANK YOU FOR ALL YOUR WORK ON VUE - it is awesome!