Merge branch 'canary' into patch-1

Author: armand1m

packages/next/build/webpack/loaders/next-serverless-loader.ts

@@ -241,10 +241,10 @@ const nextServerlessLoader: loader.Loader = function () {
       }
 
       const denormalizedPagePath = denormalizePagePath(parsedUrl.pathname || '/')
-      const detectedDefaultLocale = !detectedLocale || detectedLocale === defaultLocale
+      const detectedDefaultLocale = !detectedLocale || detectedLocale.toLowerCase() === defaultLocale.toLowerCase()
       const shouldStripDefaultLocale =
         detectedDefaultLocale &&
-        denormalizedPagePath === \`/\${defaultLocale}\`
+        denormalizedPagePath.toLowerCase() === \`/\${defaultLocale.toLowerCase()}\`
       const shouldAddLocalePrefix =
         !detectedDefaultLocale && denormalizedPagePath === '/'
 

packages/next/client/index.tsx

@@ -92,7 +92,7 @@ if (process.env.__NEXT_i18n_SUPPORT) {
     const localePathResult = normalizeLocalePath(asPath, locales)
 
     if (localePathResult.detectedLocale) {
-      asPath = asPath.substr(localePathResult.detectedLocale.length + 1)
+      asPath = asPath.substr(localePathResult.detectedLocale.length + 1) || '/'
     } else {
       // derive the default locale if it wasn't detected in the asPath
       // since we don't prerender static pages with all possible default

packages/next/next-server/lib/i18n/detect-locale-cookie.ts

@@ -1,15 +1,10 @@
 import { IncomingMessage } from 'http'
 
 export function detectLocaleCookie(req: IncomingMessage, locales: string[]) {
-  let detectedLocale: string | undefined
-
   if (req.headers.cookie && req.headers.cookie.includes('NEXT_LOCALE')) {
     const { NEXT_LOCALE } = (req as any).cookies
-
-    if (locales.some((locale: string) => NEXT_LOCALE === locale)) {
-      detectedLocale = NEXT_LOCALE
-    }
+    return locales.find(
+      (locale: string) => NEXT_LOCALE.toLowerCase() === locale.toLowerCase()
+    )
   }
-
-  return detectedLocale
 }

packages/next/next-server/lib/i18n/normalize-locale-path.ts

@@ -10,7 +10,7 @@ export function normalizeLocalePath(
   const pathnameParts = pathname.split('/')
 
   ;(locales || []).some((locale) => {
-    if (pathnameParts[1] === locale) {
+    if (pathnameParts[1].toLowerCase() === locale.toLowerCase()) {
       detectedLocale = locale
       pathnameParts.splice(1, 1)
       pathname = pathnameParts.join('/') || '/'

packages/next/next-server/server/next-server.ts

@@ -324,9 +324,11 @@ export default class Server {
 
       const denormalizedPagePath = denormalizePagePath(pathname || '/')
       const detectedDefaultLocale =
-        !detectedLocale || detectedLocale === defaultLocale
+        !detectedLocale ||
+        detectedLocale.toLowerCase() === defaultLocale.toLowerCase()
       const shouldStripDefaultLocale =
-        detectedDefaultLocale && denormalizedPagePath === `/${defaultLocale}`
+        detectedDefaultLocale &&
+        denormalizedPagePath.toLowerCase() === `/${defaultLocale.toLowerCase()}`
       const shouldAddLocalePrefix =
         !detectedDefaultLocale && denormalizedPagePath === '/'
 
@@ -1148,6 +1150,13 @@ export default class Server {
     const isDataReq = !!query._nextDataReq && (isSSG || isServerProps)
     delete query._nextDataReq
 
+    const locale = query.__nextLocale as string
+    const locales = query.__nextLocales as string[]
+    // const defaultLocale = query.__nextDefaultLocale as string
+    delete query.__nextLocale
+    delete query.__nextLocales
+    // delete query.__nextDefaultLocale
+
     let previewData: string | false | object | undefined
     let isPreviewMode = false
 
@@ -1176,7 +1185,7 @@ export default class Server {
       }
 
       if (this.nextConfig.experimental.i18n) {
-        return normalizeLocalePath(path, this.renderOpts.locales).pathname
+        return normalizeLocalePath(path, locales).pathname
       }
       return path
     }
@@ -1188,13 +1197,6 @@ export default class Server {
       urlPathname = stripNextDataPath(urlPathname)
     }
 
-    const locale = query.__nextLocale as string
-    const locales = query.__nextLocales as string[]
-    // const defaultLocale = query.__nextDefaultLocale as string
-    delete query.__nextLocale
-    delete query.__nextLocales
-    // delete query.__nextDefaultLocale
-
     const ssgCacheKey =
       isPreviewMode || !isSSG
         ? undefined // Preview mode bypasses the cache

test/integration/i18n-support/test/index.test.js

@@ -26,7 +26,46 @@ let appPort
 
 const locales = ['en-US', 'nl-NL', 'nl-BE', 'nl', 'fr-BE', 'fr', 'en']
 
-function runTests() {
+function runTests(isDev) {
+  it('should update asPath on the client correctly', async () => {
+    for (const check of ['en', 'En']) {
+      const browser = await webdriver(appPort, `/${check}`)
+
+      expect(await browser.elementByCss('html').getAttribute('lang')).toBe('en')
+      expect(await browser.elementByCss('#router-locale').text()).toBe('en')
+      expect(
+        JSON.parse(await browser.elementByCss('#router-locales').text())
+      ).toEqual(locales)
+      expect(await browser.elementByCss('#router-as-path').text()).toBe('/')
+      expect(await browser.elementByCss('#router-pathname').text()).toBe('/')
+    }
+  })
+
+  if (!isDev) {
+    it('should handle fallback correctly after generating', async () => {
+      const browser = await webdriver(
+        appPort,
+        '/en/gsp/fallback/hello-fallback'
+      )
+
+      // wait for the fallback to be generated/stored to ISR cache
+      browser.waitForElementByCss('#gsp')
+
+      // now make sure we're serving the previously generated file from the cache
+      const html = await renderViaHTTP(
+        appPort,
+        '/en/gsp/fallback/hello-fallback'
+      )
+      const $ = cheerio.load(html)
+
+      expect($('#gsp').text()).toBe('gsp page')
+      expect($('#router-locale').text()).toBe('en')
+      expect(JSON.parse($('#router-locales').text())).toEqual(locales)
+      expect($('#router-pathname').text()).toBe('/gsp/fallback/[slug]')
+      expect($('#router-as-path').text()).toBe('/gsp/fallback/hello-fallback')
+    })
+  }
+
   it('should use correct default locale for locale domains', async () => {
     const res = await fetchViaHTTP(appPort, '/', undefined, {
       headers: {
@@ -173,6 +212,15 @@ function runTests() {
       expect($('#router-as-path').text()).toBe('/gsp')
       expect($('#router-pathname').text()).toBe('/gsp')
       expect(JSON.parse($('#router-locales').text())).toEqual(locales)
+
+      // make sure locale is case-insensitive
+      const html2 = await renderViaHTTP(appPort, `/${locale.toUpperCase()}/gsp`)
+      const $2 = cheerio.load(html2)
+      expect($2('html').attr('lang')).toBe(locale)
+      expect($2('#router-locale').text()).toBe(locale)
+      expect($2('#router-as-path').text()).toBe('/gsp')
+      expect($2('#router-pathname').text()).toBe('/gsp')
+      expect(JSON.parse($2('#router-locales').text())).toEqual(locales)
     }
   })
 
@@ -193,6 +241,21 @@ function runTests() {
 
     expect(parsedUrl.pathname).toBe('/')
     expect(parsedUrl.query).toEqual({})
+
+    // make sure locale is case-insensitive
+    const res2 = await fetchViaHTTP(appPort, '/eN-Us', undefined, {
+      redirect: 'manual',
+      headers: {
+        'Accept-Language': 'en-US;q=0.9',
+      },
+    })
+
+    expect(res2.status).toBe(307)
+
+    const parsedUrl2 = url.parse(res.headers.get('location'), true)
+
+    expect(parsedUrl2.pathname).toBe('/')
+    expect(parsedUrl2.query).toEqual({})
   })
 
   it('should load getStaticProps page correctly SSR (default locale no prefix)', async () => {
@@ -391,8 +454,8 @@ function runTests() {
   it('should navigate client side for default locale with no prefix', async () => {
     const browser = await webdriver(appPort, '/')
     // make sure default locale is used in case browser isn't set to
-    // favor en-US by default
-    await browser.manage().addCookie({ name: 'NEXT_LOCALE', value: 'en-US' })
+    // favor en-US by default, (we use all caps to ensure it's case-insensitive)
+    await browser.manage().addCookie({ name: 'NEXT_LOCALE', value: 'EN-US' })
     await browser.get(browser.initUrl)
 
     const checkIndexValues = async () => {
@@ -705,7 +768,7 @@ describe('i18n Support', () => {
     })
     afterAll(() => killApp(app))
 
-    runTests()
+    runTests(true)
   })
 
   describe('production mode', () => {