test(active-links): add more tests for redirects

Author: posva

Diff for: examples/active-links/app.js

@@ -34,15 +34,33 @@ const router = new VueRouter({
   routes: [
     { path: '/', component: Home },
     { path: '/about', component: About },
-    { path: '/users', component: Users,
-      children: [
-        { path: ':username', name: 'user', component: User }
-      ]
+    {
+      path: '/redirect-gallery',
+      name: 'redirect-gallery',
+      redirect: { name: 'gallery' }
+    },
+    {
+      path: '/redirect-image',
+      name: 'redirect-image',
+      redirect: { name: 'image', params: { imageId: 'image1' }}
     },
-    { path: '/gallery', component: Gallery, name: 'gallery',
+    {
+      path: '/users',
+      component: Users,
+      children: [{ path: ':username', name: 'user', component: User }]
+    },
+    {
+      path: '/gallery',
+      component: Gallery,
       children: [
+        {
+          path: '',
+          name: 'gallery',
+          redirect: { name: 'image', params: { imageId: 'image1' }}
+        },
         { path: ':imageId', component: Image, name: 'image' }
-      ], redirect: { name: 'image', params: { imageId: 'image1' }}}
+      ]
+    }
   ]
 })
 
@@ -82,9 +100,14 @@ new Vue({
           <a>/about (active class on outer element)</a>
         </router-link>
 
-        <li><router-link :to="{ name: 'gallery' }">/gallery (redirect to /gallery/image1)</router-link></li>
+        <li><router-link to="/gallery">/gallery (redirect to /gallery/image1)</router-link></li>
+        <li><router-link :to="{ name: 'gallery' }">/gallery named link (redirect to /gallery/image1)</router-link></li>
         <li><router-link :to="{ name: 'image', params: {imageId: 'image2'} }">/gallery/image2</router-link></li>
         <li><router-link :to="{ name: 'image', params: {imageId: 'image1'} }">/gallery/image1</router-link></li>
+        <li><router-link to="/redirect-gallery">/redirect-gallery (redirect to /gallery)</router-link></li>
+        <li><router-link :to="{ name: 'redirect-gallery' }">/redirect-gallery named (redirect to /gallery)</router-link></li>
+        <li><router-link to="/redirect-image">/redirect-image (redirect to /gallery/image1)</router-link></li>
+        <li><router-link :to="{ name: 'redirect-image' }" >/redirect-image named (redirect to /gallery/image1)</router-link></li>
       </ul>
       <router-view class="view"></router-view>
     </div>

Diff for: src/components/link.js

@@ -32,24 +32,31 @@ export default {
   render (h: Function) {
     const router = this.$router
     const current = this.$route
-    const { location, route, href } = router.resolve(this.to, current, this.append)
+    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 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
     const compareTarget = route.redirectedFrom
       ? createRoute(null, normalizeLocation(route.redirectedFrom), null, router)
       : route
@@ -71,7 +78,9 @@ export default {
 
     const on = { click: guardEvent }
     if (Array.isArray(this.event)) {
-      this.event.forEach(e => { on[e] = handler })
+      this.event.forEach(e => {
+        on[e] = handler
+      })
     } else {
       on[this.event] = handler
     }
@@ -89,9 +98,9 @@ export default {
       if (a) {
         // in case the <a> is a static node
         a.isStatic = false
-        const aData = a.data = extend({}, a.data)
+        const aData = (a.data = extend({}, a.data))
         aData.on = on
-        const aAttrs = a.data.attrs = extend({}, a.data.attrs)
+        const aAttrs = (a.data.attrs = extend({}, a.data.attrs))
         aAttrs.href = href
       } else {
         // doesn't have <a> child, apply listener to self