Angular 2 - 运行组件测试的问题

Question

我正在尝试为 Angular 2 - rc5 运行组件测试，并在运行测试时收到以下错误：

socket 上缺少错误处理程序。 TypeError: (msg || "").replace 不是函数 在 /project/node_modules/karma/lib/reporter.js:48:23

我得出的结论是，当我注释掉 setBaseProviders 行（以及组件测试中可能使用这些提供程序的行）时，测试套件的其余部分运行没有问题。不幸的是，看来我需要这些提供程序才能使用 TestComponentBuilder 运行组件测试。

// other import statements above
import {
  TEST_BROWSER_DYNAMIC_APPLICATION_PROVIDERS,
  TEST_BROWSER_DYNAMIC_PLATFORM_PROVIDERS,
} from '@angular/platform-browser-dynamic/testing';

setBaseTestProviders(TEST_BROWSER_DYNAMIC_PLATFORM_PROVIDERS,
  TEST_BROWSER_DYNAMIC_APPLICATION_PROVIDERS);
// other code below that is currently commented out

我从 node_modules/karma/lib/reporter.js:48 内部记录了错误消息并收到以下消息：'已创建具有不同配置的平台。请先销毁它。'

下面是我的 package.json 文件和 karma-conf.js。我还使用了 angular2-CLI 来设置初始存储库。关于可能是什么问题的任何想法？如果我可以提供任何其他信息来帮助解决问题，请告诉我。

karma.conf

module.exports = function (config) {
  config.set({
    basePath: '..',
    frameworks: ['jasmine'],
    plugins: [
      require('karma-jasmine'),
      require('karma-chrome-launcher')
    ],
    customLaunchers: {
      // chrome setup for travis CI using chromium
      Chrome_travis_ci: {
        base: 'Chrome',
        flags: ['--no-sandbox']
      }
    },
    files: [
      { pattern: 'dist/vendor/es6-shim/es6-shim.js', included: true, watched: false },
      { pattern: 'dist/vendor/zone.js/dist/zone.js', included: true, watched: false },
      { pattern: 'dist/vendor/reflect-metadata/Reflect.js', included: true, watched: false },
      { pattern: 'dist/vendor/systemjs/dist/system-polyfills.js', included: true, watched: false },
      { pattern: 'dist/vendor/systemjs/dist/system.src.js', included: true, watched: false },
      { pattern: 'dist/vendor/zone.js/dist/async-test.js', included: true, watched: false },

      { pattern: 'config/karma-test-shim.js', included: true, watched: true },

      // Distribution folder.
      { pattern: 'dist/**/*', included: false, watched: true }
    ],
    exclude: [
      // Vendor packages might include spec files. We don't want to use those.
      'dist/vendor/**/*.spec.js'
    ],
    preprocessors: {},
    reporters: ['progress'],
    port: 9876,
    colors: true,
    logLevel: config.LOG_INFO,
    autoWatch: true,
    browsers: ['Chrome'],
    singleRun: false
  });
};

package.json

{
  "name": "free-code-camp",
  "version": "0.0.0",
  "license": "MIT",
  "angular-cli": {},
  "scripts": {
    "start": "ng server",
    "postinstall": "typings install",
    "lint": "tslint \"src/**/*.ts\"",
    "format": "clang-format -i -style=file --glob=src/**/*.ts",
    "pree2e": "webdriver-manager update",
    "e2e": "protractor"
  },
  "private": true,
  "dependencies": {
    "@angular/common": "^2.0.0-rc.5",
    "@angular/compiler": "^2.0.0-rc.5",
    "@angular/core": "^2.0.0-rc.5",
    "@angular/http": "^2.0.0-rc.5",
    "@angular/platform-browser": "^2.0.0-rc.5",
    "@angular/platform-browser-dynamic": "^2.0.0-rc.5",
    "d3": "^4.2.2",
    "es6-shim": "^0.35.0",
    "reflect-metadata": "0.1.3",
    "rxjs": "5.0.0-beta.6",
    "systemjs": "0.19.31",
    "zone.js": "^0.6.12"
  },
  "devDependencies": {
    "angular-cli": "0.0.*",
    "clang-format": "^1.0.35",
    "codelyzer": "0.0.14",
    "ember-cli-inject-live-reload": "^1.4.0",
    "jasmine-core": "^2.4.1",
    "jasmine-spec-reporter": "^2.4.0",
    "karma": "^0.13.15",
    "karma-chrome-launcher": "^0.2.3",
    "karma-jasmine": "^0.3.8",
    "protractor": "^3.3.0",
    "ts-node": "^0.5.5",
    "tslint": "^3.6.0",
    "typescript": "^1.8.10",
    "typings": "^0.8.1"
  }
}

Answer 1

我在升级到 angular rc6 时遇到了类似的错误消息，必须更换

testing.setBaseTestProviders(
  browser.TEST_BROWSER_DYNAMIC_PLATFORM_PROVIDERS,
  browser.TEST_BROWSER_DYNAMIC_APPLICATION_PROVIDERS
);

与

testing.TestBed.initTestEnvironment(
  browser.BrowserDynamicTestingModule,
  browser.platformBrowserDynamicTesting()
);

这在RC.5 changelog 中被列为重大更改。

Answer 2

所以我对 jasmine 和 karma 很陌生，但我遇到了同样的错误：

已创建具有不同配置的平台。请先销毁它。

这可能是因为您在 karma-test-shim.js 文件中设置了基本提供程序。

如果是这种情况，您需要将其从单元测试中删除：

setBaseTestProviders(
  TEST_BROWSER_DYNAMIC_PLATFORM_PROVIDERS,
  TEST_BROWSER_DYNAMIC_APPLICATION_PROVIDERS);

我想您只能设置一次基本提供程序，因此错误可能来自单元测试中的其他地方。

karam-test-shim.js 应该如下所示：

..
var testing = require('@angular/core/testing');
var browser = require('@angular/platform-browser-dynamic/testing');

testing.setBaseTestProviders(
  browser.TEST_BROWSER_DYNAMIC_PLATFORM_PROVIDERS,
  browser.TEST_BROWSER_DYNAMIC_APPLICATION_PROVIDERS
);