feat: improve next 14 support (#3287)

tolgee · Dec 6, 2023 · 5a95ae6 · 5a95ae6
1 parent 7d91892
commit 5a95ae6
Show file tree

Hide file tree

Showing 64 changed files with 1,571 additions and 2,486 deletions.
diff --git a/.github/workflows/prerelease-tolgee-5.yml b/.github/workflows/prerelease-tolgee-5.yml
@@ -22,7 +22,7 @@ jobs:
       - name: Build
         uses: actions/setup-node@v3
         with:
-          node-version: '18'
+          node-version: '20'
 
       - uses: pnpm/[email protected]
         name: Install pnpm

diff --git a/.github/workflows/prerelease.yml b/.github/workflows/prerelease.yml
@@ -18,7 +18,7 @@ jobs:
       - name: Build
         uses: actions/setup-node@v3
         with:
-          node-version: '18'
+          node-version: '20'
 
       - uses: pnpm/[email protected]
         name: Install pnpm

diff --git a/.github/workflows/publish-examples-check.yml b/.github/workflows/publish-examples-check.yml
@@ -31,7 +31,7 @@ jobs:
       - name: Setup node
         uses: actions/setup-node@v3
         with:
-          node-version: '18'
+          node-version: '20'
 
       - name: Read last commit
         id: get-commit-message

diff --git a/.github/workflows/publish-examples.yml b/.github/workflows/publish-examples.yml
@@ -32,7 +32,7 @@ jobs:
       - name: Setup node
         uses: actions/setup-node@v3
         with:
-          node-version: '18'
+          node-version: '20'
 
       - name: Read last commit
         id: get-commit-message

diff --git a/.github/workflows/release.yml b/.github/workflows/release.yml
@@ -21,7 +21,7 @@ jobs:
       - name: Build
         uses: actions/setup-node@v3
         with:
-          node-version: '18'
+          node-version: '20'
 
       - uses: pnpm/[email protected]
         name: Install pnpm

diff --git a/.github/workflows/report-intermittent-tests.yml b/.github/workflows/report-intermittent-tests.yml
@@ -13,7 +13,7 @@ jobs:
       - name: Setup node
         uses: actions/setup-node@v3
         with:
-          node-version: '18'
+          node-version: '20'
 
       - uses: pnpm/[email protected]
         name: Install pnpm
@@ -56,7 +56,7 @@ jobs:
       - name: Setup node
         uses: actions/setup-node@v3
         with:
-          node-version: '18'
+          node-version: '20'
 
       - uses: pnpm/[email protected]
         name: Install pnpm
@@ -115,7 +115,7 @@ jobs:
       - name: Setup node
         uses: actions/setup-node@v3
         with:
-          node-version: '18'
+          node-version: '20'
 
       - uses: pnpm/[email protected]
         name: Install pnpm

diff --git a/.github/workflows/test.yml b/.github/workflows/test.yml
@@ -14,7 +14,7 @@ jobs:
       - name: Setup node
         uses: actions/setup-node@v3
         with:
-          node-version: '18'
+          node-version: '20'
 
       - uses: pnpm/[email protected]
         name: Install pnpm
@@ -59,7 +59,7 @@ jobs:
 
       - uses: actions/setup-node@v3
         with:
-          node-version: '18'
+          node-version: '20'
 
       - uses: pnpm/[email protected]
         name: Install pnpm
@@ -134,7 +134,7 @@ jobs:
       fail-fast: false
       matrix:
         app: ${{ fromJson(needs.prepare.outputs.dirs) }}
-        node: [16, 18]
+        node: [18, 20]
 
     steps:
       - uses: actions/checkout@v3
@@ -207,7 +207,7 @@ jobs:
       - name: Setup node
         uses: actions/setup-node@v3
         with:
-          node-version: '18'
+          node-version: '20'
 
       - uses: pnpm/[email protected]
         name: Install pnpm

diff --git a/e2e/cypress/common/namespacesTest.ts b/e2e/cypress/common/namespacesTest.ts
@@ -11,7 +11,7 @@ export const namespacesTest = (
 ) =>
   describe('translation methods test', () => {
     before(() => {
-      cy.visit(url + '/translation-methods');
+      cy.visit(url);
       cy.intercept('GET', '*', (req) => {
         req.on('response', (res) => {
           res.delay = 500;

diff --git a/e2e/cypress/common/translationMethodsTest.ts b/e2e/cypress/common/translationMethodsTest.ts
@@ -8,7 +8,7 @@ export const translationMethodsTest = (
 ) =>
   describe('translation methods test', () => {
     before(() => {
-      cy.visit(url + '/translation-methods');
+      cy.visit(url);
     });
 
     // run it twice, as it can behave differently

diff --git a/e2e/cypress/e2e/next-app/dev.cy.ts b/e2e/cypress/e2e/next-app/dev.cy.ts
@@ -4,8 +4,9 @@ import { exampleAppDevTest } from '../../common/exampleAppDevTest';
 
 context('Next with app router in dev mode', { retries: 5 }, () => {
   const url = 'http://localhost:8122';
+  const translationMethods = url + '/en/translation-methods';
   exampleAppTest(url);
-  translationMethodsTest(url, {
+  translationMethodsTest(translationMethods, {
     en: [
       { text: 'This is a key', count: 2 },
       { text: 'This is key with params value value2', count: 6 },

diff --git a/e2e/cypress/e2e/next-app/prod.cy.ts b/e2e/cypress/e2e/next-app/prod.cy.ts
@@ -3,8 +3,9 @@ import { translationMethodsTest } from '../../common/translationMethodsTest';
 
 context('Next with app router in prod mode', () => {
   const url = 'http://localhost:8121';
+  const translationMethods = url + '/en/translation-methods';
   exampleAppTest(url);
-  translationMethodsTest(url, {
+  translationMethodsTest(translationMethods, {
     en: [
       { text: 'This is a key', count: 2 },
       { text: 'This is key with params value value2', count: 6 },

diff --git a/e2e/cypress/e2e/next/dev.cy.ts b/e2e/cypress/e2e/next/dev.cy.ts
@@ -5,8 +5,9 @@ import { namespacesTest } from '../../common/namespacesTest';
 
 context('Next app in dev mode', { retries: 2 }, () => {
   const url = 'http://localhost:8106';
+  const translationMethods = url + '/translation-methods';
   exampleAppTest(url);
-  translationMethodsTest(url, {
+  translationMethodsTest(translationMethods, {
     en: [
       { text: 'This is default', count: 2 },
       {
@@ -39,7 +40,7 @@ context('Next app in dev mode', { retries: 2 }, () => {
   });
 
   namespacesTest(
-    url,
+    translationMethods,
     {
       en: [
         { text: 'This is a key in namespace', count: 2 },

diff --git a/e2e/cypress/e2e/next/prod.cy.ts b/e2e/cypress/e2e/next/prod.cy.ts
@@ -4,8 +4,9 @@ import { translationMethodsTest } from '../../common/translationMethodsTest';
 
 context('React app in prod mode', () => {
   const url = 'http://localhost:8107';
+  const translationMethods = url + '/translation-methods';
   exampleAppTest(url);
-  translationMethodsTest(url, {
+  translationMethodsTest(translationMethods, {
     en: [
       { text: 'This is default', count: 2 },
       {
@@ -38,7 +39,7 @@ context('React app in prod mode', () => {
   });
 
   namespacesTest(
-    url,
+    translationMethods,
     {
       en: [
         { text: 'This is a key in namespace', count: 2 },

diff --git a/e2e/cypress/e2e/ngx/dev.cy.ts b/e2e/cypress/e2e/ngx/dev.cy.ts
@@ -5,8 +5,9 @@ import { namespacesNgxTest } from '../../common/namespacesNgxTest';
 
 context('Angular app in dev mode', () => {
   const url = 'http://localhost:8116/';
+  const translationMethods = url + '/translation-methods';
   exampleAppTest(url);
-  translationMethodsTest(url, {
+  translationMethodsTest(translationMethods, {
     en: [
       { text: 'This is default', count: 3 },
       {

diff --git a/e2e/cypress/e2e/ngx/prod.cy.ts b/e2e/cypress/e2e/ngx/prod.cy.ts
@@ -4,8 +4,9 @@ import { translationMethodsTest } from '../../common/translationMethodsTest';
 context('Angular app in prod mode', () => {
   const url = 'http://localhost:8115/';
 
+  const translationMethods = url + '/translation-methods';
   exampleAppTest(url);
-  translationMethodsTest(url, {
+  translationMethodsTest(translationMethods, {
     en: [
       { text: 'This is default', count: 3 },
       {

diff --git a/e2e/cypress/e2e/react-i18next/dev.cy.ts b/e2e/cypress/e2e/react-i18next/dev.cy.ts
@@ -5,8 +5,9 @@ import { namespacesTest } from '../../common/namespacesTest';
 
 context('React i18next app in dev mode', () => {
   const url = 'http://localhost:8118';
+  const translationMethods = url + '/translation-methods';
   exampleAppTest(url);
-  translationMethodsTest(url, {
+  translationMethodsTest(translationMethods, {
     en: [
       { text: 'This is default', count: 1 },
       {
@@ -27,7 +28,7 @@ context('React i18next app in dev mode', () => {
       },
     ],
   });
-  namespacesTest(url, {
+  namespacesTest(translationMethods, {
     en: [
       { text: 'This is a key in namespace', count: 1 },
       { text: 'This is a key', count: 1 },

diff --git a/e2e/cypress/e2e/react-i18next/prod.cy.ts b/e2e/cypress/e2e/react-i18next/prod.cy.ts
@@ -4,8 +4,9 @@ import { translationMethodsTest } from '../../common/translationMethodsTest';
 
 context('React i18next app in prod mode', () => {
   const url = 'http://localhost:8117';
+  const translationMethods = url + '/translation-methods';
   exampleAppTest(url);
-  translationMethodsTest(url, {
+  translationMethodsTest(translationMethods, {
     en: [
       { text: 'This is default', count: 1 },
       {
@@ -26,7 +27,7 @@ context('React i18next app in prod mode', () => {
       },
     ],
   });
-  namespacesTest(url, {
+  namespacesTest(translationMethods, {
     en: [
       { text: 'This is a key in namespace', count: 1 },
       { text: 'This is a key', count: 1 },

diff --git a/e2e/cypress/e2e/react/dev.cy.ts b/e2e/cypress/e2e/react/dev.cy.ts
@@ -6,8 +6,9 @@ import { namespacesTest } from '../../common/namespacesTest';
 
 context('React app in dev mode', () => {
   const url = 'http://localhost:8113';
+  const translationMethods = url + '/translation-methods';
   exampleAppTest(url);
-  translationMethodsTest(url, {
+  translationMethodsTest(translationMethods, {
     en: [
       { text: 'This is default', count: 2 },
       {
@@ -38,7 +39,7 @@ context('React app in dev mode', () => {
       },
     ],
   });
-  namespacesTest(url, {
+  namespacesTest(translationMethods, {
     en: [
       { text: 'This is a key in namespace', count: 2 },
       { text: 'This is a key', count: 1 },
@@ -53,7 +54,7 @@ context('React app in dev mode', () => {
 
   describe('translation in translation', () => {
     beforeEach(() => {
-      cy.visit(url + '/translation-methods');
+      cy.visit(translationMethods);
     });
 
     it('opens inner translation correctly', () => {

diff --git a/e2e/cypress/e2e/react/prod.cy.ts b/e2e/cypress/e2e/react/prod.cy.ts
@@ -4,8 +4,9 @@ import { translationMethodsTest } from '../../common/translationMethodsTest';
 
 context('React app in prod mode', { retries: 5 }, () => {
   const url = 'http://localhost:8102';
+  const translationMethods = url + '/translation-methods';
   exampleAppTest(url);
-  translationMethodsTest(url, {
+  translationMethodsTest(translationMethods, {
     en: [
       { text: 'This is default', count: 2 },
       {
@@ -36,7 +37,7 @@ context('React app in prod mode', { retries: 5 }, () => {
       },
     ],
   });
-  namespacesTest(url, {
+  namespacesTest(translationMethods, {
     en: [
       { text: 'This is a key in namespace', count: 2 },
       { text: 'This is a key', count: 1 },

diff --git a/e2e/cypress/e2e/svelte/dev.cy.ts b/e2e/cypress/e2e/svelte/dev.cy.ts
@@ -5,8 +5,9 @@ import { namespacesTest } from '../../common/namespacesTest';
 
 context('Svelte app in dev mode', { retries: 3 }, () => {
   const url = 'http://localhost:8110';
+  const translationMethods = url + '/translation-methods';
   exampleAppTest(url);
-  translationMethodsTest(url, {
+  translationMethodsTest(translationMethods, {
     en: [
       { text: 'This is default', count: 2 },
       {
@@ -28,7 +29,7 @@ context('Svelte app in dev mode', { retries: 3 }, () => {
     ],
   });
 
-  namespacesTest(url, {
+  namespacesTest(translationMethods, {
     en: [
       { text: 'This is a key in namespace', count: 2 },
       { text: 'This is a key', count: 1 },

diff --git a/e2e/cypress/e2e/svelte/prod.cy.ts b/e2e/cypress/e2e/svelte/prod.cy.ts
@@ -5,8 +5,9 @@ import { translationMethodsTest } from '../../common/translationMethodsTest';
 context('Svelte app in prod mode', () => {
   const url = 'http://localhost:8109';
 
+  const translationMethods = url + '/translation-methods';
   exampleAppTest(url);
-  translationMethodsTest(url, {
+  translationMethodsTest(translationMethods, {
     en: [
       { text: 'This is default', count: 2 },
       {
@@ -28,7 +29,7 @@ context('Svelte app in prod mode', () => {
     ],
   });
 
-  namespacesTest(url, {
+  namespacesTest(translationMethods, {
     en: [
       { text: 'This is a key in namespace', count: 2 },
       { text: 'This is a key', count: 1 },

diff --git a/e2e/cypress/e2e/vue-i18next/dev.cy.ts b/e2e/cypress/e2e/vue-i18next/dev.cy.ts
@@ -4,8 +4,9 @@ import { exampleAppDevTest } from '../../common/exampleAppDevTest';
 
 context('React i18next app in dev mode', () => {
   const url = 'http://localhost:8120';
+  const translationMethods = url + '/translation-methods';
   exampleAppTest(url);
-  translationMethodsTest(url, {
+  translationMethodsTest(translationMethods, {
     en: [
       { text: 'This is default', count: 1 },
       {

diff --git a/e2e/cypress/e2e/vue-i18next/prod.cy.ts b/e2e/cypress/e2e/vue-i18next/prod.cy.ts
@@ -3,8 +3,9 @@ import { translationMethodsTest } from '../../common/translationMethodsTest';
 
 context('React i18next app in prod mode', () => {
   const url = 'http://localhost:8119';
+  const translationMethods = url + '/translation-methods';
   exampleAppTest(url);
-  translationMethodsTest(url, {
+  translationMethodsTest(translationMethods, {
     en: [
       { text: 'This is default', count: 1 },
       {

diff --git a/e2e/cypress/e2e/vue/dev.cy.ts b/e2e/cypress/e2e/vue/dev.cy.ts
@@ -5,8 +5,9 @@ import { namespacesTest } from '../../common/namespacesTest';
 
 context('Vue app in dev mode', () => {
   const url = 'http://localhost:8112';
+  const translationMethods = url + '/translation-methods';
   exampleAppTest(url);
-  translationMethodsTest(url, {
+  translationMethodsTest(translationMethods, {
     en: [
       { text: 'This is default', count: 2 },
       {
@@ -28,7 +29,7 @@ context('Vue app in dev mode', () => {
     ],
   });
 
-  namespacesTest(url, {
+  namespacesTest(translationMethods, {
     en: [
       { text: 'This is a key in namespace', count: 2 },
       { text: 'This is a key', count: 1 },