test: add regression test for #2525

nuxt-modules · Nov 4, 2023 · d425b8b · d425b8b
1 parent 697295f
commit d425b8b
Show file tree

Hide file tree

Showing 2 changed files with 41 additions and 0 deletions.
diff --git a/specs/basic_usage.spec.ts b/specs/basic_usage.spec.ts
@@ -146,3 +146,23 @@ test('fallback to target lang', async () => {
   // current locale
   expect(await getText(page, '#lang-switcher-current-locale code')).toEqual('nl')
 })
+
+test('(#2525) localePath should keep hash', async () => {
+  const { page } = await renderPage('/')
+
+  expect(await page.locator('#link-about-hash').getAttribute('href')).toEqual('/about#my-hash')
+  expect(await page.locator('#link-about-hash-object').getAttribute('href')).toEqual('/about#my-hash')
+
+  expect(await page.locator('#link-about-query-hash').getAttribute('href')).toEqual('/about?foo=bar#my-hash')
+  expect(await page.locator('#link-about-query-hash-object').getAttribute('href')).toEqual('/about?foo=bar#my-hash')
+
+  // click `nl` lang switch with `<NuxtLink>`
+  await page.locator('#switch-locale-path-usages .switch-to-nl a').click()
+  await waitForURL(page, '/nl')
+
+  expect(await page.locator('#link-about-hash').getAttribute('href')).toEqual('/nl/about#my-hash')
+  expect(await page.locator('#link-about-hash-object').getAttribute('href')).toEqual('/nl/about#my-hash')
+
+  expect(await page.locator('#link-about-query-hash').getAttribute('href')).toEqual('/nl/about?foo=bar#my-hash')
+  expect(await page.locator('#link-about-query-hash-object').getAttribute('href')).toEqual('/nl/about?foo=bar#my-hash')
+})
diff --git a/specs/fixtures/basic_usage/pages/index.vue b/specs/fixtures/basic_usage/pages/index.vue
@@ -81,6 +81,27 @@ useHead({
             {{ category.title }}
           </NuxtLink>
         </li>
+        <li class="path-hash">
+          <NuxtLink id="link-about-hash" :to="localePath('/about#my-hash')">{{ $t('about') }}</NuxtLink>
+        </li>
+        <li class="path-query-hash">
+          <NuxtLink id="link-about-query-hash" :to="localePath('/about?foo=bar#my-hash')">
+            {{ $t('about') }}
+          </NuxtLink>
+        </li>
+        <li class="path-hash">
+          <NuxtLink id="link-about-hash-object" :to="localePath({ name: 'about', hash: '#my-hash' })">{{
+            $t('about')
+          }}</NuxtLink>
+        </li>
+        <li class="path-query-hash">
+          <NuxtLink
+            id="link-about-query-hash-object"
+            :to="localePath({ name: 'about', query: { foo: 'bar' }, hash: '#my-hash' })"
+          >
+            {{ $t('about') }}
+          </NuxtLink>
+        </li>
       </ul>
     </section>
     <section id="nuxt-link-locale-usages">