fix: locale not set with differentDomains enabled

Fixed by re-introducing setting of app.i18n.locale when differentDomains is enabled. Previous refactorings has disabled that code accidentally. Changed code to match previous behavior where, with differentDomains enabled, plugin sets locale while middleware does not.
nuxt-modules · Aug 28, 2019 · 634690a · 634690a
1 parent 1198423
commit 634690a
Show file tree

Hide file tree

Showing 5 changed files with 97 additions and 8 deletions.
diff --git a/src/plugins/main.js b/src/plugins/main.js
@@ -121,7 +121,7 @@ export default async (context) => {
 
   const loadAndSetLocale = async (newLocale, { initialSetup = false } = {}) => {
     // Abort if different domains option enabled
-    if (app.i18n.differentDomains) {
+    if (!initialSetup && app.i18n.differentDomains) {
       return
     }
 
@@ -131,6 +131,7 @@ export default async (context) => {
     }
 
     const oldLocale = app.i18n.locale
+
     if (!initialSetup) {
       app.i18n.beforeLanguageSwitch(oldLocale, newLocale)
 

diff --git a/src/templates/middleware.js b/src/templates/middleware.js
@@ -68,15 +68,15 @@ middleware['i18n'] = async (context) => {
           if (redirectToLocale !== app.i18n.locale) {
             // We switch the locale before redirect to prevent loops
             await app.i18n.setLocale(redirectToLocale)
-            }
-          } else if (useCookie && !getLocaleCookie()) {
-            app.i18n.setLocaleCookie(redirectToLocale)
           }
-
-          return
+        } else if (useCookie && !getLocaleCookie()) {
+          app.i18n.setLocaleCookie(redirectToLocale)
         }
+
+        return
       }
     }
+  }
 
   await app.i18n.setLocale(routeLocale ? routeLocale : locale)
 }
diff --git a/test/__snapshots__/module.test.js.snap b/test/__snapshots__/module.test.js.snap
@@ -9,7 +9,7 @@ exports[`basic / contains EN text, link to /fr/ & link /about-us 1`] = `
   <body >
     <div data-server-rendered=\\"true\\" id=\\"__nuxt\\"><!----><div id=\\"__layout\\"><div><div><a href=\\"/fr\\">Français</a></div>
   Homepage
-  <a href=\\"/about-us\\">About us</a></div></div></div>
+  <a href=\\"/about-us\\">About us</a> <div>locale: en</div></div></div></div>
   </body>
 </html>
 "
@@ -54,7 +54,7 @@ exports[`basic /fr contains FR text, link to / & link to /fr/a-propos 1`] = `
   <body >
     <div data-server-rendered=\\"true\\" id=\\"__nuxt\\"><!----><div id=\\"__layout\\"><div><div><a href=\\"/\\">English</a></div>
   Accueil
-  <a href=\\"/fr/a-propos\\">À propos</a></div></div></div>
+  <a href=\\"/fr/a-propos\\">À propos</a> <div>locale: fr</div></div></div></div>
   </body>
 </html>
 "
@@ -111,6 +111,36 @@ exports[`basic sets SEO metadata properly 1`] = `
   "
 `;
 
+exports[`differentDomains enabled matches domain's locale (en) 1`] = `
+"<!doctype html>
+<html data-n-head-ssr lang=\\"en-US\\" data-n-head=\\"lang\\">
+  <head >
+    <meta data-n-head=\\"ssr\\" data-hid=\\"og:locale\\" property=\\"og:locale\\" content=\\"en_US\\"><meta data-n-head=\\"ssr\\" data-hid=\\"og:locale:alternate-fr-FR\\" property=\\"og:locale:alternate\\" content=\\"fr_FR\\"><link data-n-head=\\"ssr\\" data-hid=\\"alternate-hreflang-en-US\\" rel=\\"alternate\\" href=\\"nuxt-app.localhosthttp://en.nuxt-app.localhost/\\" hreflang=\\"en-US\\"><link data-n-head=\\"ssr\\" data-hid=\\"alternate-hreflang-fr-FR\\" rel=\\"alternate\\" href=\\"nuxt-app.localhosthttp://fr.nuxt-app.localhost/\\" hreflang=\\"fr-FR\\"><style data-vue-ssr-id=\\"4d2c2316:0\\">.nuxt-progress{position:fixed;top:0;left:0;right:0;height:2px;width:0;opacity:1;transition:width .1s,opacity .4s;background-color:#000;z-index:999999}.nuxt-progress.nuxt-progress-notransition{transition:none}.nuxt-progress-failed{background-color:red}</style>
+  </head>
+  <body >
+    <div data-server-rendered=\\"true\\" id=\\"__nuxt\\"><!----><div id=\\"__layout\\"><div><div><a href=\\"/http://fr.nuxt-app.localhost/\\">Français</a></div>
+  Homepage
+  <a href=\\"/about-us\\">About us</a> <div>locale: en</div></div></div></div>
+  </body>
+</html>
+"
+`;
+
+exports[`differentDomains enabled matches domain's locale (fr) 1`] = `
+"<!doctype html>
+<html data-n-head-ssr lang=\\"fr-FR\\" data-n-head=\\"lang\\">
+  <head >
+    <meta data-n-head=\\"ssr\\" data-hid=\\"og:locale\\" property=\\"og:locale\\" content=\\"fr_FR\\"><meta data-n-head=\\"ssr\\" data-hid=\\"og:locale:alternate-en-US\\" property=\\"og:locale:alternate\\" content=\\"en_US\\"><link data-n-head=\\"ssr\\" data-hid=\\"alternate-hreflang-en-US\\" rel=\\"alternate\\" href=\\"nuxt-app.localhosthttp://en.nuxt-app.localhost/\\" hreflang=\\"en-US\\"><link data-n-head=\\"ssr\\" data-hid=\\"alternate-hreflang-fr-FR\\" rel=\\"alternate\\" href=\\"nuxt-app.localhosthttp://fr.nuxt-app.localhost/\\" hreflang=\\"fr-FR\\"><style data-vue-ssr-id=\\"4d2c2316:0\\">.nuxt-progress{position:fixed;top:0;left:0;right:0;height:2px;width:0;opacity:1;transition:width .1s,opacity .4s;background-color:#000;z-index:999999}.nuxt-progress.nuxt-progress-notransition{transition:none}.nuxt-progress-failed{background-color:red}</style>
+  </head>
+  <body >
+    <div data-server-rendered=\\"true\\" id=\\"__nuxt\\"><!----><div id=\\"__layout\\"><div><div><a href=\\"/http://en.nuxt-app.localhost/\\">English</a></div>
+  Accueil
+  <a href=\\"/a-propos\\">À propos</a> <div>locale: fr</div></div></div></div>
+  </body>
+</html>
+"
+`;
+
 exports[`no_prefix strategy / contains EN text & link /about 1`] = `
 "<!doctype html>
 <html data-n-head-ssr lang=\\"en-US\\" data-n-head=\\"lang\\">

diff --git a/test/fixture/basic/pages/index.vue b/test/fixture/basic/pages/index.vue
@@ -3,6 +3,7 @@
   <LangSwitcher />
   {{ $t('home') }}
   <nuxt-link exact :to="localePath('about')">{{ $t('about') }}</nuxt-link>
+  <div>locale: {{ $i18n.locale }}</div>
 </div>
 </template>
 

diff --git a/test/module.test.js b/test/module.test.js
@@ -300,3 +300,60 @@ describe('with router base', () => {
     expect(newRoute).toBe('/about-us')
   })
 })
+
+describe('differentDomains enabled', () => {
+  let nuxt
+
+  beforeAll(async () => {
+    const override = {
+      i18n: {
+        differentDomains: true,
+        seo: false
+      }
+    }
+
+    const localConfig = loadConfig(__dirname, 'basic', override, { merge: true })
+
+    // Override after merging options to avoid arrays being merged.
+    localConfig.i18n.locales = [
+      {
+        code: 'en',
+        iso: 'en-US',
+        name: 'English',
+        domain: 'en.nuxt-app.localhost'
+      },
+      {
+        code: 'fr',
+        iso: 'fr-FR',
+        name: 'Français',
+        domain: 'fr.nuxt-app.localhost'
+      }
+    ]
+
+    nuxt = (await setup(localConfig)).nuxt
+  })
+
+  afterAll(async () => {
+    await nuxt.close()
+  })
+
+  test('matches domain\'s locale (en)', async () => {
+    const requestOptions = {
+      headers: {
+        Host: 'en.nuxt-app.localhost'
+      }
+    }
+    const html = await get('/', requestOptions)
+    expect(cleanUpScripts(html)).toMatchSnapshot()
+  })
+
+  test('matches domain\'s locale (fr)', async () => {
+    const requestOptions = {
+      headers: {
+        Host: 'fr.nuxt-app.localhost'
+      }
+    }
+    const html = await get('/', requestOptions)
+    expect(cleanUpScripts(html)).toMatchSnapshot()
+  })
+})