Angular 9 i18n 迁移 - 测试失败

Question

我正在从 Angular 8.0 升级到 Angular 9.1.1。通过一些工作，一切都会构建并且运行一切正常。我运行进入本地化问题 https://angular.io/guide/migration-localize 并遵循这些说明 - 这允许我的项目构建和运行！但是，当我运行测试 (karma/jasmine)

时，我仍然遇到这个问题

我使用 CLI 升级了我的项目。我似乎找不到任何其他迁移本地化所需的步骤。

我正在使用 TestBed 进行单元测试，它们在调用 TestBed.createComponent 时失败，并抛出错误：

Error: It looks like your application or one of its dependencies is using i18n.
        Angular 9 introduced a global `$localize()` function that needs to be loaded.
        Please run `ng add @angular/localize` from the Angular CLI.
        (For non-CLI projects, add `import '@angular/localize/init';` to your `polyfills.ts` file.
        For server-side rendering applications add the import to your `main.server.ts` file.)

来自失败测试组件模板的 HTML 的示例片段是：

<span i18n>
    label
</span>

简单地删除 i18n 允许测试运行并通过 - 但这不是应用程序运行时的运行时间错误。关于接下来要看的地方或这里可能涉及的其他内容的任何线索？

我的顶polypill.js

/***************************************************************************************************
 * Load `$localize` onto the global scope - used if i18n tags appear in Angular templates.
 */
import '@angular/localize/init';

/**
 * This file includes polyfills needed by Angular and is loaded before the app.
 * You can add your own extra polyfills to this file.
 *
...

我的 package.json 依赖关系

  "dependencies": {
    "@angular/animations": "^9.1.1",
    "@angular/common": "^9.1.1",
    "@angular/compiler": "^9.1.1",
    "@angular/core": "^9.1.1",
    "@angular/forms": "^9.1.1",
    "@angular/localize": "^9.1.1",
    "@angular/platform-browser": "^9.1.1",
    "@angular/platform-browser-dynamic": "^9.1.1",
    "@angular/router": "^9.1.1",
    "core-js": "^3.0.0",
    "moment": "^2.24.0",
    "prismjs": "^1.16.0",
    "rxjs": "~6.5.5",
    "tslib": "^1.10.0",
    "zone.js": "~0.10.2"
  },
  "devDependencies": {
    "@angular-devkit/build-angular": "~0.901.1",
    "@angular-devkit/build-ng-packagr": "~0.901.1",
    "@angular/cli": "^9.1.1",
    "@angular/compiler-cli": "^9.1.1",
    "@angular/language-service": "^9.1.1",
    "@types/jasmine": "^3.3.13",
    "@types/jasminewd2": "^2.0.6",
    "@types/node": "^12.11.1",
    "codelyzer": "^5.1.2",
    "jasmine-core": "~3.4.0",
    "jasmine-spec-reporter": "~4.2.1",
    "karma": "^4.2.0",
    "karma-chrome-launcher": "^2.2.0",
    "karma-coverage-istanbul-reporter": "^2.1.0",
    "karma-jasmine": "^2.0.0",
    "karma-jasmine-html-reporter": "^1.4.2",
    "ng-packagr": "^9.0.0",
    "ts-node": "^8.2.0",
    "tslint": "^5.18.0",
    "typescript": "~3.8.3"
  }

Answer 1

我发现我必须将 @angular/localize/init 导入 test.ts 以允许对运行进行测试，请参阅 here 示例。

Answer 2

polyfill 没有包含在测试中，所以我不得不在 angular.json

中添加 polyfil 配置选项

  "builder": "@angular-devkit/build-angular:karma",
          "options": {
            "polyfills": "polyfills.ts",
            ...
          }
        },

并确保它包含在 tsconfig.spec.json

"include": [
    "**/*.spec.ts",
    "**/*.d.ts",
    "polyfills.ts"
  ]

Answer 3

将大型 Nx/Angular CLI 应用程序从 Angular 8 升级到 Angular 10 后，我在单元测试中收到错误。示例错误的摘录如下

  An error was thrown in afterAll
  Uncaught Error: It looks like your application or one of its dependencies is using i18n.
  Angular 9 introduced a global `$localize()` function that needs to be loaded.
  Please run `ng add @angular/localize` from the Angular CLI.
  (For non-CLI projects, add `import '@angular/localize/init';` to your `polyfills.ts` file

错误描述中的解决方案没有解决测试失败的问题。通过 Angular CLI 生成的应用程序中的库没有任何 polyfill.ts 文件。所有这些库都有一个由 Angular CLI（例如 mproject\libs\mylib\src\test.ts）生成的文件 test.ts。我在这些库的 test.ts 文件中添加了导入语句 (import '@angular/localize/init';) 来解决这个问题。

Angular 9 i18n 迁移 - 测试失败

Angular 9 i18n migration - failing tests

angular

angular9

angular-i18n

testbed