From 89e9584754bc08a11085e9c2b7a555f1acb5e628 Mon Sep 17 00:00:00 2001 From: Luigi Colombi Date: Sat, 6 Feb 2021 16:51:30 +0100 Subject: [PATCH 01/11] add locales props in initialProps context --- packages/next/next-server/server/render.tsx | 4 ++++ 1 file changed, 4 insertions(+) diff --git a/packages/next/next-server/server/render.tsx b/packages/next/next-server/server/render.tsx index 2044373d6a447..3e913b226d8ae 100644 --- a/packages/next/next-server/server/render.tsx +++ b/packages/next/next-server/server/render.tsx @@ -559,6 +559,10 @@ export async function renderToHTML( pathname, query, asPath, + locale: renderOpts.locale, + locales: renderOpts.locales, + defaultLocale: renderOpts.defaultLocale, + domainLocales: renderOpts.domainLocales, AppTree: (props: any) => { return ( From 805057e61390f319b89c2df13e7ad12e04a377d6 Mon Sep 17 00:00:00 2001 From: Luigi Colombi Date: Sat, 6 Feb 2021 17:16:33 +0100 Subject: [PATCH 02/11] init: setup new test folder --- .../i18n-support-custom-error/next.config.js | 6 +++ .../i18n-support-custom-error/pages/[slug].js | 41 +++++++++++++++++++ .../i18n-support-custom-error/pages/index.js | 3 ++ 3 files changed, 50 insertions(+) create mode 100644 test/integration/i18n-support-custom-error/next.config.js create mode 100644 test/integration/i18n-support-custom-error/pages/[slug].js create mode 100644 test/integration/i18n-support-custom-error/pages/index.js diff --git a/test/integration/i18n-support-custom-error/next.config.js b/test/integration/i18n-support-custom-error/next.config.js new file mode 100644 index 0000000000000..548eeb7f713ce --- /dev/null +++ b/test/integration/i18n-support-custom-error/next.config.js @@ -0,0 +1,6 @@ +module.exports = { + i18n: { + locales: ['en', 'fr', 'de', 'it'], + defaultLocale: 'en', + }, +} diff --git a/test/integration/i18n-support-custom-error/pages/[slug].js b/test/integration/i18n-support-custom-error/pages/[slug].js new file mode 100644 index 0000000000000..33ad9f46bd0c5 --- /dev/null +++ b/test/integration/i18n-support-custom-error/pages/[slug].js @@ -0,0 +1,41 @@ +import { useRouter } from 'next/router' + +const SlugPage = (props) => { + const router = useRouter() + + return router.isFallback ? null : ( + <> +
{props.title}
+ + ) +} + +export const getStaticProps = async (ctx) => { + if (ctx.params.slug === 'my-custom-path-3') { + return { + notFound: true, + } + } + return { + props: { + title: ctx.params.slug, + }, + } +} + +export const getStaticPaths = async ({ locales }) => { + const mySlugs = ['my-custom-path-1', 'my-custom-path-1'] + + return { + paths: locales.reduce( + (paths, locale) => [ + ...paths, + ...mySlugs.map((slug) => ({ locale, params: { slug } })), + ], + [] + ), + fallback: 'blocking', + } +} + +export default SlugPage diff --git a/test/integration/i18n-support-custom-error/pages/index.js b/test/integration/i18n-support-custom-error/pages/index.js new file mode 100644 index 0000000000000..cec75d9a29fe1 --- /dev/null +++ b/test/integration/i18n-support-custom-error/pages/index.js @@ -0,0 +1,3 @@ +export default function IndexPage() { + return

Hi 👋

+} From 42bec7be8c10a015226c020f3bb7cc8667fe449e Mon Sep 17 00:00:00 2001 From: Luigi Colombi Date: Sat, 6 Feb 2021 17:20:17 +0100 Subject: [PATCH 03/11] init: create custom error component for intergration test --- .../i18n-support-custom-error/pages/[slug].js | 2 +- .../i18n-support-custom-error/pages/_error.js | 19 +++++++++++++++++++ 2 files changed, 20 insertions(+), 1 deletion(-) create mode 100644 test/integration/i18n-support-custom-error/pages/_error.js diff --git a/test/integration/i18n-support-custom-error/pages/[slug].js b/test/integration/i18n-support-custom-error/pages/[slug].js index 33ad9f46bd0c5..c757ad1ab235c 100644 --- a/test/integration/i18n-support-custom-error/pages/[slug].js +++ b/test/integration/i18n-support-custom-error/pages/[slug].js @@ -24,7 +24,7 @@ export const getStaticProps = async (ctx) => { } export const getStaticPaths = async ({ locales }) => { - const mySlugs = ['my-custom-path-1', 'my-custom-path-1'] + const mySlugs = ['my-custom-path-1', 'my-custom-path-2'] return { paths: locales.reduce( diff --git a/test/integration/i18n-support-custom-error/pages/_error.js b/test/integration/i18n-support-custom-error/pages/_error.js new file mode 100644 index 0000000000000..470120ab6a376 --- /dev/null +++ b/test/integration/i18n-support-custom-error/pages/_error.js @@ -0,0 +1,19 @@ +function CustomError({ statusCode }) { + return statusCode === 410 ? ( +
410 - Gone page
+ ) : ( +
Other error (404, etc..)
+ ) +} + +CustomError.getInitialProps = ({ res, err, ...context }) => { + // 410 - GONE + if (context.asPath === '/my-custom-path-3') { + res.statusCode = 410 + } + + const statusCode = res ? res.statusCode : err ? err.statusCode : 404 + return { statusCode } +} + +export default CustomError From cc23ffaf6cb0773568603450fb8d5a35047f14ad Mon Sep 17 00:00:00 2001 From: Luigi Colombi Date: Sat, 6 Feb 2021 18:05:57 +0100 Subject: [PATCH 04/11] render props stringify --- .../i18n-support-custom-error/pages/[slug].js | 9 ++++++--- .../i18n-support-custom-error/pages/_error.js | 15 ++++++++------- 2 files changed, 14 insertions(+), 10 deletions(-) diff --git a/test/integration/i18n-support-custom-error/pages/[slug].js b/test/integration/i18n-support-custom-error/pages/[slug].js index c757ad1ab235c..4cc9eb2cac788 100644 --- a/test/integration/i18n-support-custom-error/pages/[slug].js +++ b/test/integration/i18n-support-custom-error/pages/[slug].js @@ -6,19 +6,22 @@ const SlugPage = (props) => { return router.isFallback ? null : ( <>
{props.title}
+
{JSON.stringify(props)}
) } -export const getStaticProps = async (ctx) => { - if (ctx.params.slug === 'my-custom-path-3') { +export const getStaticProps = async ({ locale, params }) => { + if (params.slug === 'my-custom-gone-path') { return { notFound: true, } } return { props: { - title: ctx.params.slug, + locale, + params, + title: params.slug, }, } } diff --git a/test/integration/i18n-support-custom-error/pages/_error.js b/test/integration/i18n-support-custom-error/pages/_error.js index 470120ab6a376..49fed6d92ded2 100644 --- a/test/integration/i18n-support-custom-error/pages/_error.js +++ b/test/integration/i18n-support-custom-error/pages/_error.js @@ -1,19 +1,20 @@ -function CustomError({ statusCode }) { - return statusCode === 410 ? ( -
410 - Gone page
- ) : ( -
Other error (404, etc..)
+function CustomError(props) { + return ( + <> +
My Custom {props.statusCode} page
+
{JSON.stringify(props)}
+ ) } CustomError.getInitialProps = ({ res, err, ...context }) => { // 410 - GONE - if (context.asPath === '/my-custom-path-3') { + if (context.asPath === '/my-custom-gone-path') { res.statusCode = 410 } const statusCode = res ? res.statusCode : err ? err.statusCode : 404 - return { statusCode } + return { statusCode, locale: context.locale } } export default CustomError From db9fb02b9b99dcade5c0a6a4735402b7dc0dde71 Mon Sep 17 00:00:00 2001 From: Luigi Colombi Date: Sat, 6 Feb 2021 18:06:26 +0100 Subject: [PATCH 05/11] testing render custom error page with locale props --- .../test/index.test.js | 94 +++++++++++++++++++ 1 file changed, 94 insertions(+) create mode 100644 test/integration/i18n-support-custom-error/test/index.test.js diff --git a/test/integration/i18n-support-custom-error/test/index.test.js b/test/integration/i18n-support-custom-error/test/index.test.js new file mode 100644 index 0000000000000..99717a6ed7310 --- /dev/null +++ b/test/integration/i18n-support-custom-error/test/index.test.js @@ -0,0 +1,94 @@ +/* eslint-env jest */ + +import { join } from 'path' +import webdriver from 'next-webdriver' +import { + launchApp, + killApp, + findPort, + nextBuild, + nextStart, +} from 'next-test-utils' + +jest.setTimeout(1000 * 60 * 2) + +const appDir = join(__dirname, '..') +const locales = ['en', 'fr', 'de', 'it'] +let appPort +let app + +const runTests = () => { + it('should localized [slug] routes render correctly', async () => { + for (const locale of locales) { + const browser = await webdriver( + appPort, + `${locale === 'en' ? '' : `/${locale}`}/my-custom-path-1` + ) + + expect(JSON.parse(await browser.elementByCss('#props').text())).toEqual({ + locale, + params: { + slug: 'my-custom-path-1', + }, + title: 'my-custom-path-1', + }) + } + }) + + it('handle custom http status maintaining locale props in custom _error page', async () => { + for (const locale of locales) { + const browser = await webdriver( + appPort, + `${locale === 'en' ? '' : `/${locale}`}/my-custom-gone-path` + ) + + expect( + JSON.parse(await browser.elementByCss('#error-props').text()) + ).toEqual( + expect.objectContaining({ + locale, + statusCode: 410, + }) + ) + } + }) + + it('handle default http status maintaining locale props in custom _error page', async () => { + for (const locale of locales) { + const browser = await webdriver( + appPort, + `${locale === 'en' ? '' : `/${locale}`}/my-custom-gone-path/other-path` + ) + + expect( + JSON.parse(await browser.elementByCss('#error-props').text()) + ).toEqual( + expect.objectContaining({ + locale, + statusCode: 404, + }) + ) + } + }) +} + +describe('Custom routes i18n', () => { + describe('dev mode', () => { + beforeAll(async () => { + appPort = await findPort() + app = await launchApp(appDir, appPort) + }) + afterAll(() => killApp(app)) + runTests(true) + }) + + describe('production mode', () => { + beforeAll(async () => { + await nextBuild(appDir) + appPort = await findPort() + app = await nextStart(appDir, appPort) + }) + afterAll(() => killApp(app)) + runTests() + }) +}) From 29c7678ca3619007e5ea4457df1812508a8dd0c4 Mon Sep 17 00:00:00 2001 From: Luigi Colombi Date: Fri, 12 Feb 2021 17:19:13 +0100 Subject: [PATCH 06/11] add locale props on client side routing --- packages/next/next-server/lib/router/router.ts | 4 ++++ 1 file changed, 4 insertions(+) diff --git a/packages/next/next-server/lib/router/router.ts b/packages/next/next-server/lib/router/router.ts index a783d6b1c45a5..3179b91e72b5e 100644 --- a/packages/next/next-server/lib/router/router.ts +++ b/packages/next/next-server/lib/router/router.ts @@ -1306,6 +1306,10 @@ export default class Router implements BaseRouter { pathname, query, asPath: as, + locale: this.locale, + locales: this.locales, + defaultLocale: this.defaultLocale, + domainLocales: this.domainLocales, } as any ) ) From 92d61df33f7335802eb0d21d0b36c47b0a0f0eb5 Mon Sep 17 00:00:00 2001 From: Luigi Colombi Date: Fri, 12 Feb 2021 17:19:29 +0100 Subject: [PATCH 07/11] add client side test --- .../test/index.test.js | 35 +++++++++++++++++++ 1 file changed, 35 insertions(+) diff --git a/test/integration/i18n-support-custom-error/test/index.test.js b/test/integration/i18n-support-custom-error/test/index.test.js index 99717a6ed7310..6514902181f28 100644 --- a/test/integration/i18n-support-custom-error/test/index.test.js +++ b/test/integration/i18n-support-custom-error/test/index.test.js @@ -70,6 +70,41 @@ const runTests = () => { ) } }) + + it('should work with nested folder with same name as basePath', async () => { + for (const locale of locales) { + const browser = await webdriver(appPort, `/${locale}/my-custom-path-1`) + + expect(JSON.parse(await browser.elementByCss('#props').text())).toEqual({ + locale, + params: { + slug: 'my-custom-path-1', + }, + title: 'my-custom-path-1', + }) + + await browser.eval('window.next.router.push("/my-custom-path-2")') + + expect(JSON.parse(await browser.elementByCss('#props').text())).toEqual({ + locale, + params: { + slug: 'my-custom-path-2', + }, + title: 'my-custom-path-2', + }) + + await browser.eval('window.next.router.push("/my-custom-gone-path")') + + expect( + JSON.parse(await browser.elementByCss('#error-props').text()) + ).toEqual( + expect.objectContaining({ + locale, + statusCode: 404, + }) + ) + } + }) } describe('Custom routes i18n', () => { From 87acab2aeb73ec60d71d7b0e99313b772a119e65 Mon Sep 17 00:00:00 2001 From: Luigi Colombi Date: Fri, 12 Feb 2021 20:41:47 +0100 Subject: [PATCH 08/11] fix initialProps for client side --- test/integration/i18n-support-custom-error/pages/_error.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/test/integration/i18n-support-custom-error/pages/_error.js b/test/integration/i18n-support-custom-error/pages/_error.js index 49fed6d92ded2..b4856fb5cd0ea 100644 --- a/test/integration/i18n-support-custom-error/pages/_error.js +++ b/test/integration/i18n-support-custom-error/pages/_error.js @@ -9,7 +9,7 @@ function CustomError(props) { CustomError.getInitialProps = ({ res, err, ...context }) => { // 410 - GONE - if (context.asPath === '/my-custom-gone-path') { + if (res && context.asPath === '/my-custom-gone-path') { res.statusCode = 410 } From 7fb307a069e872aaec49d0901e5503388bf5c8cd Mon Sep 17 00:00:00 2001 From: Luigi Colombi Date: Fri, 12 Feb 2021 20:46:24 +0100 Subject: [PATCH 09/11] fix test --- .../test/index.test.js | 36 ++++++++++--------- 1 file changed, 19 insertions(+), 17 deletions(-) diff --git a/test/integration/i18n-support-custom-error/test/index.test.js b/test/integration/i18n-support-custom-error/test/index.test.js index 6514902181f28..60d64158d3f27 100644 --- a/test/integration/i18n-support-custom-error/test/index.test.js +++ b/test/integration/i18n-support-custom-error/test/index.test.js @@ -71,27 +71,30 @@ const runTests = () => { } }) - it('should work with nested folder with same name as basePath', async () => { + it('should work also on client side routing', async () => { for (const locale of locales) { - const browser = await webdriver(appPort, `/${locale}/my-custom-path-1`) + const browser = await webdriver( + appPort, + `${locale === 'en' ? '' : `/${locale}`}/my-custom-path-1` + ) - expect(JSON.parse(await browser.elementByCss('#props').text())).toEqual({ - locale, - params: { - slug: 'my-custom-path-1', - }, - title: 'my-custom-path-1', - }) + expect(JSON.parse(await browser.elementByCss('#props').text())).toEqual( + expect.objectContaining({ + locale, + params: { slug: 'my-custom-path-1' }, + title: 'my-custom-path-1', + }) + ) await browser.eval('window.next.router.push("/my-custom-path-2")') - expect(JSON.parse(await browser.elementByCss('#props').text())).toEqual({ - locale, - params: { - slug: 'my-custom-path-2', - }, - title: 'my-custom-path-2', - }) + expect(JSON.parse(await browser.elementByCss('#props').text())).toEqual( + expect.objectContaining({ + locale, + params: { slug: 'my-custom-path-2' }, + title: 'my-custom-path-2', + }) + ) await browser.eval('window.next.router.push("/my-custom-gone-path")') @@ -100,7 +103,6 @@ const runTests = () => { ).toEqual( expect.objectContaining({ locale, - statusCode: 404, }) ) } From a37cc2c8bf494de85c75f05378aedf5d068dbbc7 Mon Sep 17 00:00:00 2001 From: Luigi Colombi Date: Mon, 8 Mar 2021 11:42:06 +0100 Subject: [PATCH 10/11] resizing bundle --- packages/next/next-server/lib/router/router.ts | 1 - packages/next/next-server/server/render.tsx | 1 - 2 files changed, 2 deletions(-) diff --git a/packages/next/next-server/lib/router/router.ts b/packages/next/next-server/lib/router/router.ts index d91d534e7e15a..e8db149e16736 100644 --- a/packages/next/next-server/lib/router/router.ts +++ b/packages/next/next-server/lib/router/router.ts @@ -1364,7 +1364,6 @@ export default class Router implements BaseRouter { locale: this.locale, locales: this.locales, defaultLocale: this.defaultLocale, - domainLocales: this.domainLocales, } as any ) ) diff --git a/packages/next/next-server/server/render.tsx b/packages/next/next-server/server/render.tsx index 5f40206302b95..9aa2a65ec8461 100644 --- a/packages/next/next-server/server/render.tsx +++ b/packages/next/next-server/server/render.tsx @@ -595,7 +595,6 @@ export async function renderToHTML( locale: renderOpts.locale, locales: renderOpts.locales, defaultLocale: renderOpts.defaultLocale, - domainLocales: renderOpts.domainLocales, AppTree: (props: any) => { return ( From 2bd9c9e680b9a788e5f58d5b678a4304039b53fe Mon Sep 17 00:00:00 2001 From: Luigi Colombi Date: Fri, 7 May 2021 21:42:55 +0200 Subject: [PATCH 11/11] update build-output test --- test/integration/build-output/test/index.test.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/test/integration/build-output/test/index.test.js b/test/integration/build-output/test/index.test.js index f02640cf54f72..55e800f4c31a5 100644 --- a/test/integration/build-output/test/index.test.js +++ b/test/integration/build-output/test/index.test.js @@ -99,7 +99,7 @@ describe('Build Output', () => { expect(indexSize.endsWith('B')).toBe(true) // should be no bigger than 64.8 kb - expect(parseFloat(indexFirstLoad)).toBeCloseTo(63.5, 1) + expect(parseFloat(indexFirstLoad)).toBeCloseTo(63.6, 1) expect(indexFirstLoad.endsWith('kB')).toBe(true) expect(parseFloat(err404Size)).toBeCloseTo(3.04, 1)