fix(link): preserve the alias path

diff --git a/__tests__/RouterLink.spec.ts b/__tests__/RouterLink.spec.ts
index 4cc0168c7b2e32a2932415474b7be40425cf4488..34cf3adc6b8098fe5f4e5a875faa1328e438685c 100644 (file)
--- a/__tests__/RouterLink.spec.ts
+++ b/__tests__/RouterLink.spec.ts
@@ -54,7 +54,7 @@ const locations: Record<
       hash: '',
       matched: [records.home],
       redirectedFrom: undefined,
-      name: undefined,
+      name: 'home',
     },
   },
   foo: {
@@ -131,7 +131,7 @@ const locations: Record<
       hash: '',
       matched: [records.homeAlias],
       redirectedFrom: undefined,
-      name: undefined,
+      name: 'home',
     },
   },
 
@@ -564,7 +564,24 @@ describe('RouterLink', () => {
     wrapper.find('a')!.click()
     await nextTick()
     expect(router.push).toHaveBeenCalledTimes(1)
-    expect(router.push).toHaveBeenCalledWith(locations.basic.normalized)
+  })
+
+  it('calls router.push with the correct location for aliases', async () => {
+    const { router, wrapper } = await factory(
+      START_LOCATION_NORMALIZED,
+      { to: locations.alias.string },
+      locations.alias.normalized
+    )
+    wrapper.find('a')!.click()
+    await nextTick()
+    expect(router.push).toHaveBeenCalledTimes(1)
+    expect(router.push).not.toHaveBeenCalledWith(
+      expect.objectContaining({
+        // this is the original name but if we push with this location, we will
+        // not have the alias on the url
+        name: 'home',
+      })
+    )
   })
 
   describe('v-slot', () => {

diff --git a/__tests__/__snapshots__/RouterLink.spec.ts.snap b/__tests__/__snapshots__/RouterLink.spec.ts.snap
index 933038ad851f2bd8c6f0699b8995e517835fce18..360a57a3754a99e095b1c409664436682fc56621 100644 (file)
--- a/__tests__/__snapshots__/RouterLink.spec.ts.snap
+++ b/__tests__/__snapshots__/RouterLink.spec.ts.snap
@@ -1,3 +1,3 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
-exports[`RouterLink v-slot provides information on v-slot 1`] = `"<a aria-current=\\"page\\" href=\\"/home\\" class=\\"router-link-active router-link-exact-active\\"><span> route: {\\"href\\":\\"/home\\",\\"fullPath\\":\\"/home\\",\\"path\\":\\"/home\\",\\"params\\":{},\\"meta\\":{},\\"query\\":{},\\"hash\\":\\"\\",\\"matched\\":[{}]} href: \\"/home\\" isActive: \\"true\\" isExactActive: \\"true\\" </span></a>"`;
+exports[`RouterLink v-slot provides information on v-slot 1`] = `"<a aria-current=\\"page\\" href=\\"/home\\" class=\\"router-link-active router-link-exact-active\\"><span> route: {\\"href\\":\\"/home\\",\\"fullPath\\":\\"/home\\",\\"path\\":\\"/home\\",\\"params\\":{},\\"meta\\":{},\\"query\\":{},\\"hash\\":\\"\\",\\"matched\\":[{}],\\"name\\":\\"home\\"} href: \\"/home\\" isActive: \\"true\\" isExactActive: \\"true\\" </span></a>"`;

diff --git a/src/components/Link.ts b/src/components/Link.ts
index 9428b7e4e750d136079328df6085d71f0ed4ae5c..d6295f34fc6e0593ce9623b86195f1711e5e354a 100644 (file)
--- a/src/components/Link.ts
+++ b/src/components/Link.ts
@@ -56,7 +56,7 @@ export function useLink(props: UseLinkOptions) {
 
   function navigate(e: MouseEvent = {} as MouseEvent) {
     // TODO: handle navigate with empty parameters for scoped slot and composition api
-    if (guardEvent(e)) router.push(route.value)
+    if (guardEvent(e)) router.push(unref(props.to))
   }
 
   return {