fix: trigger onBeforeLocaleSwitch before any locale change

BobbieGoede · Dec 17, 2024 · 820679a · 820679a
1 parent f92763d
commit 820679a
Show file tree

Hide file tree

Showing 4 changed files with 28 additions and 50 deletions.
diff --git a/specs/basic_usage.spec.ts b/specs/basic_usage.spec.ts
@@ -307,17 +307,9 @@ describe('basic usage', async () => {
   test('<NuxtLink> triggers runtime hooks', async () => {
     const { page, consoleLogs } = await renderPage('/kr')
 
-    // click `fr` lang switch with `<NuxtLink>`
-    await page.locator('#nuxt-locale-link-fr').click()
-    await waitForURL(page, '/fr')
-
-    // click `kr` lang switch with `<NuxtLink>`
-    await page.locator('#nuxt-locale-link-kr').click()
-    await waitForURL(page, '/kr')
-
-    // expect(consoleLogs.find(log => log.text.includes('onBeforeLanguageSwitch kr fr true'))).toBeTruthy()
-    expect(consoleLogs.find(log => log.text.includes('onBeforeLanguageSwitch fr kr false'))).toBeTruthy()
+    expect(consoleLogs.find(log => log.text.includes('onBeforeLanguageSwitch kr fr true'))).toBeTruthy()
     expect(consoleLogs.find(log => log.text.includes('onLanguageSwitched kr fr'))).toBeTruthy()
+    expect(consoleLogs.find(log => log.text.includes('onBeforeLanguageSwitch fr fr false'))).toBeTruthy()
 
     // current locale
     expect(await getText(page, '#lang-switcher-current-locale code')).toEqual('fr')
@@ -334,15 +326,9 @@ describe('basic usage', async () => {
   test('setLocale triggers runtime hooks', async () => {
     const { page, consoleLogs } = await renderPage('/kr')
 
-    // click `fr` lang switch link
-    await page.locator('#set-locale-link-fr').click()
-
-    // click `kr` lang switch link
-    // Hook prevents locale change to `kr`, stays `fr`
-    await page.locator('#set-locale-link-kr').click()
-    // expect(consoleLogs.find(log => log.text.includes('onBeforeLanguageSwitch kr fr true'))).toBeTruthy()
+    expect(consoleLogs.find(log => log.text.includes('onBeforeLanguageSwitch kr fr true'))).toBeTruthy()
     expect(consoleLogs.find(log => log.text.includes('onLanguageSwitched kr fr'))).toBeTruthy()
-    expect(consoleLogs.find(log => log.text.includes('onBeforeLanguageSwitch fr kr false'))).toBeTruthy()
+    expect(consoleLogs.find(log => log.text.includes('onBeforeLanguageSwitch fr fr false'))).toBeTruthy()
 
     // current locale
     expect(await getText(page, '#lang-switcher-current-locale code')).toEqual('fr')

diff --git a/specs/basic_usage_compat_4.spec.ts b/specs/basic_usage_compat_4.spec.ts
@@ -307,17 +307,9 @@ describe('basic usage - compatibilityVersion: 4', async () => {
   test('<NuxtLink> triggers runtime hooks', async () => {
     const { page, consoleLogs } = await renderPage('/kr')
 
-    // click `fr` lang switch with `<NuxtLink>`
-    await page.locator('#nuxt-locale-link-fr').click()
-    await waitForURL(page, '/fr')
-
-    // click `kr` lang switch with `<NuxtLink>`
-    await page.locator('#nuxt-locale-link-kr').click()
-    await waitForURL(page, '/kr')
-
-    // expect(consoleLogs.find(log => log.text.includes('onBeforeLanguageSwitch kr fr true'))).toBeTruthy()
-    expect(consoleLogs.find(log => log.text.includes('onBeforeLanguageSwitch fr kr false'))).toBeTruthy()
+    expect(consoleLogs.find(log => log.text.includes('onBeforeLanguageSwitch kr fr true'))).toBeTruthy()
     expect(consoleLogs.find(log => log.text.includes('onLanguageSwitched kr fr'))).toBeTruthy()
+    expect(consoleLogs.find(log => log.text.includes('onBeforeLanguageSwitch fr fr false'))).toBeTruthy()
 
     // current locale
     expect(await getText(page, '#lang-switcher-current-locale code')).toEqual('fr')
@@ -334,15 +326,9 @@ describe('basic usage - compatibilityVersion: 4', async () => {
   test('setLocale triggers runtime hooks', async () => {
     const { page, consoleLogs } = await renderPage('/kr')
 
-    // click `fr` lang switch link
-    await page.locator('#set-locale-link-fr').click()
-
-    // click `kr` lang switch link
-    // Hook prevents locale change to `kr`, stays `fr`
-    await page.locator('#set-locale-link-kr').click()
-    // expect(consoleLogs.find(log => log.text.includes('onBeforeLanguageSwitch kr fr true'))).toBeTruthy()
+    expect(consoleLogs.find(log => log.text.includes('onBeforeLanguageSwitch kr fr true'))).toBeTruthy()
     expect(consoleLogs.find(log => log.text.includes('onLanguageSwitched kr fr'))).toBeTruthy()
-    expect(consoleLogs.find(log => log.text.includes('onBeforeLanguageSwitch fr kr false'))).toBeTruthy()
+    expect(consoleLogs.find(log => log.text.includes('onBeforeLanguageSwitch fr fr false'))).toBeTruthy()
 
     // current locale
     expect(await getText(page, '#lang-switcher-current-locale code')).toEqual('fr')

diff --git a/specs/fixtures/plugins/i18nHooks.ts b/specs/fixtures/plugins/i18nHooks.ts
@@ -2,10 +2,16 @@ import { defineNuxtPlugin } from '#imports'
 
 export default defineNuxtPlugin(nuxtApp => {
   nuxtApp.hook('i18n:beforeLocaleSwitch', ({ oldLocale, newLocale, initialSetup }) => {
-    console.log('onBeforeLanguageSwitch', oldLocale, newLocale, initialSetup)
+    let overrideLocale = newLocale
 
     if (newLocale === 'kr') {
-      return 'fr'
+      overrideLocale = 'fr'
+    }
+
+    console.log('onBeforeLanguageSwitch', oldLocale, overrideLocale, initialSetup)
+
+    if (overrideLocale !== newLocale) {
+      return overrideLocale
     }
   })
 

diff --git a/src/runtime/utils.ts b/src/runtime/utils.ts
@@ -80,6 +80,18 @@ export async function loadAndSetLocale(newLocale: Locale, initial: boolean = fal
     nuxtApp.$i18n.setLocaleCookie(locale)
   }
 
+  // call `onBeforeLanguageSwitch` which may return an override for `newLocale`
+  const localeOverride = await nuxtApp.$i18n.onBeforeLanguageSwitch(oldLocale, newLocale, initial, nuxtApp)
+  if (localeOverride && localeCodes.includes(localeOverride)) {
+    // resolved `localeOverride` is already in use
+    if (oldLocale === localeOverride) {
+      syncCookie()
+      return false
+    }
+
+    newLocale = localeOverride
+  }
+
   __DEBUG__ && logger.log({ newLocale, oldLocale, initial })
 
   // `newLocale` is unset or empty
@@ -99,18 +111,6 @@ export async function loadAndSetLocale(newLocale: Locale, initial: boolean = fal
     return false
   }
 
-  // call `onBeforeLanguageSwitch` which may return an override for `newLocale`
-  const localeOverride = await nuxtApp.$i18n.onBeforeLanguageSwitch(oldLocale, newLocale, initial, nuxtApp)
-  if (localeOverride && localeCodes.includes(localeOverride)) {
-    // resolved `localeOverride` is already in use
-    if (oldLocale === localeOverride) {
-      syncCookie()
-      return false
-    }
-
-    newLocale = localeOverride
-  }
-
   // load locale messages required by `newLocale`
   // if (lazy) {
   const i18nFallbackLocales = unref(nuxtApp.$i18n.fallbackLocale)