From f76b370d70f14b80f53ecf7866e6a2d2ddd63372 Mon Sep 17 00:00:00 2001 From: Pete Bacon Darwin Date: Wed, 23 Oct 2019 22:49:02 +0100 Subject: [PATCH] test: update ivy i18n integration test (#33314) The integration test now checks that the locale inlining is working. PR Close #33314 --- integration/_payload-limits.json | 4 +- .../cli-hello-world-ivy-i18n/angular.json | 21 +- .../cli-hello-world-ivy-i18n/e2e/README.md | 5 +- .../e2e/de/app.e2e-spec.ts | 9 + .../e2e/en/app.e2e-spec.ts | 7 + .../e2e/fr/app.e2e-spec.ts | 7 + .../e2e/legacy/app.e2e-spec.ts | 2 + .../e2e/runtime/app.e2e-spec.ts | 7 + .../cli-hello-world-ivy-i18n/package.json | 9 +- .../src/app/app.component.html | 2 + .../src/app/app.component.spec.ts | 2 +- .../src/app/app.component.ts | 4 +- .../src/app/app.module.ts | 10 +- .../src/polyfills-runtime.ts | 86 +++ .../cli-hello-world-ivy-i18n/src/polyfills.ts | 10 - .../cli-hello-world-ivy-i18n/yarn.lock | 625 ++++++++++-------- 16 files changed, 503 insertions(+), 307 deletions(-) create mode 100644 integration/cli-hello-world-ivy-i18n/src/polyfills-runtime.ts diff --git a/integration/_payload-limits.json b/integration/_payload-limits.json index a0f020758503a..af1c04b6f1bc7 100644 --- a/integration/_payload-limits.json +++ b/integration/_payload-limits.json @@ -30,8 +30,8 @@ "master": { "uncompressed": { "runtime-es2015": 1485, - "main-es2015": 128258, - "polyfills-es2015": 42102 + "main-es2015": 138032, + "polyfills-es2015": 37494 } } }, diff --git a/integration/cli-hello-world-ivy-i18n/angular.json b/integration/cli-hello-world-ivy-i18n/angular.json index b378f28c323de..5a3f7d5de8094 100644 --- a/integration/cli-hello-world-ivy-i18n/angular.json +++ b/integration/cli-hello-world-ivy-i18n/angular.json @@ -33,6 +33,7 @@ "tsConfig": "tsconfig.view-engine.json" }, "production": { + "localize": false, // TODO: enable when CLI supports inlining the locale "fileReplacements": [ { "replace": "src/environments/environment.ts", @@ -61,6 +62,14 @@ } ] }, + "runtime-translations": { + "fileReplacements": [ + { + "replace": "src/polyfills.ts", + "with": "src/polyfills-runtime.ts" + } + ] + }, "translated-legacy": { "tsConfig": "tsconfig.legacy.json", "optimization": true, @@ -90,6 +99,10 @@ "ci-production": { "browserTarget": "cli-hello-world-ivy-i18n:build:production", "progress": false + }, + "runtime-translations": { + "browserTarget": "cli-hello-world-ivy-i18n:build:runtime-translations", + "progress": false } } }, @@ -136,7 +149,7 @@ "e2e": { "builder": "@angular-devkit/build-angular:protractor", "options": { - "protractorConfig": "e2e/runtime/protractor.conf.js", + "protractorConfig": "e2e/en/protractor.conf.js", "devServerTarget": "cli-hello-world-ivy-i18n:serve", "webdriverUpdate": false }, @@ -148,7 +161,11 @@ "devServerTarget": "cli-hello-world-ivy-i18n:serve:ci" }, "ci-production": { - "devServerTarget": "cli-hello-world-ivy-i18n:serve:ci-production" + "devServerTarget": "cli-hello-world-ivy-i18n:serve:ci-production", + }, + "runtime-translations": { + "devServerTarget": "cli-hello-world-ivy-i18n:serve:runtime-translations", + "protractorConfig": "e2e/fr/protractor.conf.js" }, "translated-legacy": { "devServerTarget": "", diff --git a/integration/cli-hello-world-ivy-i18n/e2e/README.md b/integration/cli-hello-world-ivy-i18n/e2e/README.md index ff624f64adc8c..b1e1cafed2b0a 100644 --- a/integration/cli-hello-world-ivy-i18n/e2e/README.md +++ b/integration/cli-hello-world-ivy-i18n/e2e/README.md @@ -5,7 +5,10 @@ translation scenarios, but they are all built with IVY enabled. ### runtime -Translations are provided at runtime by calling `loadTranslations()` in the polyfill.ts +A new `polyfills.ts` file is provided (`polyfills-runtime.ts`) which is swapped in by a file +replacement in the `angular.json` configuration. In this new file: + * Runtime translations are provided (`loadTranslations()`). + * The current locale is set (`$localize.locale = 'fr'`) and loaded (`registerLocaleData(localeFr);`) ### de and fr diff --git a/integration/cli-hello-world-ivy-i18n/e2e/de/app.e2e-spec.ts b/integration/cli-hello-world-ivy-i18n/e2e/de/app.e2e-spec.ts index 01e204429a037..0bc71b5b29ad3 100644 --- a/integration/cli-hello-world-ivy-i18n/e2e/de/app.e2e-spec.ts +++ b/integration/cli-hello-world-ivy-i18n/e2e/de/app.e2e-spec.ts @@ -14,4 +14,13 @@ describe('cli-hello-world-ivy App', () => { it('should display welcome message', () => { expect(page.getParagraph('message')).toEqual('Willkommen in der i18n App. (inline)'); }); + + it('should display the locale', () => { expect(page.getParagraph('locale')).toEqual('de'); }); + + // TODO : Re-enable when CLI translation inlining supports locale inlining (and so we can use it + // to load the correct locale data) + xit('the date pipe should show the localized month', () => { + page.navigateTo(); + expect(page.getParagraph('date')).toEqual('Januar'); + }); }); diff --git a/integration/cli-hello-world-ivy-i18n/e2e/en/app.e2e-spec.ts b/integration/cli-hello-world-ivy-i18n/e2e/en/app.e2e-spec.ts index 6e2d8873480b1..b7935f18cb957 100644 --- a/integration/cli-hello-world-ivy-i18n/e2e/en/app.e2e-spec.ts +++ b/integration/cli-hello-world-ivy-i18n/e2e/en/app.e2e-spec.ts @@ -12,4 +12,11 @@ describe('cli-hello-world-ivy App', () => { it('should display welcome message', () => { expect(page.getParagraph('message')).toEqual('Welcome to the i18n app.'); }); + + it('should display the locale', () => { expect(page.getParagraph('locale')).toEqual('en-US'); }); + + it('the date pipe should show the localized month', () => { + page.navigateTo(); + expect(page.getParagraph('date')).toEqual('January'); + }); }); diff --git a/integration/cli-hello-world-ivy-i18n/e2e/fr/app.e2e-spec.ts b/integration/cli-hello-world-ivy-i18n/e2e/fr/app.e2e-spec.ts index 92ef7023b8799..795b80e169e9f 100644 --- a/integration/cli-hello-world-ivy-i18n/e2e/fr/app.e2e-spec.ts +++ b/integration/cli-hello-world-ivy-i18n/e2e/fr/app.e2e-spec.ts @@ -13,4 +13,11 @@ describe('cli-hello-world-ivy App', () => { it('should display welcome message', () => { expect(page.getParagraph('message')).toEqual('Bienvenue sur l\'application i18n. (inline)'); }); + + it('should display the locale', () => { expect(page.getParagraph('locale')).toEqual('fr'); }); + + it('the date pipe should show the localized month', () => { + page.navigateTo(); + expect(page.getParagraph('date')).toEqual('janvier'); + }); }); diff --git a/integration/cli-hello-world-ivy-i18n/e2e/legacy/app.e2e-spec.ts b/integration/cli-hello-world-ivy-i18n/e2e/legacy/app.e2e-spec.ts index 0cebeb71abb0f..04cb3ccf0c18f 100644 --- a/integration/cli-hello-world-ivy-i18n/e2e/legacy/app.e2e-spec.ts +++ b/integration/cli-hello-world-ivy-i18n/e2e/legacy/app.e2e-spec.ts @@ -15,4 +15,6 @@ describe('cli-hello-world-ivy App', () => { // See "translated:legacy:extract-and-update" in package.json. expect(page.getParagraph('message')).toEqual('Welcome to the i18n app.'); }); + + it('should display the locale', () => { expect(page.getParagraph('locale')).toEqual('legacy'); }); }); diff --git a/integration/cli-hello-world-ivy-i18n/e2e/runtime/app.e2e-spec.ts b/integration/cli-hello-world-ivy-i18n/e2e/runtime/app.e2e-spec.ts index ee4bd999a4f0e..9ba4217c404e5 100644 --- a/integration/cli-hello-world-ivy-i18n/e2e/runtime/app.e2e-spec.ts +++ b/integration/cli-hello-world-ivy-i18n/e2e/runtime/app.e2e-spec.ts @@ -19,4 +19,11 @@ describe('cli-hello-world-ivy App', () => { page.navigateTo(); expect(page.getParagraph('pipe')).toEqual('100 % awesome'); }); + + it('should display the locale', () => { expect(page.getParagraph('locale')).toEqual('fr'); }); + + it('the date pipe should show the localized month', () => { + page.navigateTo(); + expect(page.getParagraph('date')).toEqual('janvier'); + }); }); diff --git a/integration/cli-hello-world-ivy-i18n/package.json b/integration/cli-hello-world-ivy-i18n/package.json index 89b17898dd6ae..b1225ffb7952e 100644 --- a/integration/cli-hello-world-ivy-i18n/package.json +++ b/integration/cli-hello-world-ivy-i18n/package.json @@ -13,18 +13,13 @@ "pretest": "ng version", "test": "ng test && yarn e2e --configuration=ci && yarn e2e --configuration=ci-production && yarn translated:test && yarn translated:legacy:test", "translate": "localize-translate -r \"dist/\" -s \"**/*\" -l \"en-US\" -t \"src/locales/messages.*\" -o \"../tmp/translations/{{LOCALE}}\"", - "translated:test": "yarn build && yarn translate && yarn translated:fr:e2e && yarn translated:de:e2e && yarn translated:en:e2e", - "translated:fr:serve": "serve ../tmp/translations/fr --listen 4200", "translated:fr:e2e": "npm-run-all -p -r translated:fr:serve \"ng e2e --configuration=translated-fr\"", - "translated:de:serve": "serve ../tmp/translations/de --listen 4200", "translated:de:e2e": "npm-run-all -p -r translated:de:serve \"ng e2e --configuration=translated-de\"", - "translated:en:serve": "serve ../tmp/translations/en-US --listen 4200", "translated:en:e2e": "npm-run-all -p -r translated:en:serve \"ng e2e --configuration=translated-en\"", - "translated:legacy:test": "yarn translated:legacy:extract-and-update && ng build --configuration=translated-legacy && yarn translated:legacy:translate && yarn translated:legacy:e2e", "translated:legacy:extract-and-update": "ng xi18n && sed -i.bak -e 's/source>/target>'/ -e 's/Hello/Bonjour/' -e 's/source-language=\"en-US\"/source-language=\"en-US\" target-language=\"legacy\"/' ../tmp/legacy-locales/messages.legacy.xlf", "translated:legacy:translate": "localize-translate -r \"dist/\" -s \"**/*\" -t \"../tmp/legacy-locales/messages.legacy.xlf\" -o \"../tmp/translations/{{LOCALE}}\"", @@ -50,8 +45,8 @@ "zone.js": "file:../../node_modules/zone.js" }, "devDependencies": { - "@angular-devkit/build-angular": "0.900.0-next.12", - "@angular/cli": "file:../../node_modules/@angular/cli", + "@angular-devkit/build-angular": "^0.900.0-next.14", + "@angular/cli": "^9.0.0-next.14", "@angular/compiler-cli": "file:../../dist/packages-dist/compiler-cli", "@angular/language-service": "file:../../dist/packages-dist/language-service", "@types/jasmine": "~3.4.0", diff --git a/integration/cli-hello-world-ivy-i18n/src/app/app.component.html b/integration/cli-hello-world-ivy-i18n/src/app/app.component.html index e91a085d47249..7bee9429e1695 100644 --- a/integration/cli-hello-world-ivy-i18n/src/app/app.component.html +++ b/integration/cli-hello-world-ivy-i18n/src/app/app.component.html @@ -7,7 +7,9 @@

{{ message }}

Angular Logo +

{{ locale }}

{{ 1 | percent }} awesome

+

{{ jan | date : 'LLLL' }}

Here are some links to help you start: