angular - Karma 在我的 angular-cli 应用程序中找不到我的测试

Question

我有一个使用 CLI 生成的 Angular 4 项目，我正在尝试进行测试。我的项目根目录中有 Karma.conf:

module.exports = function (config) {
  config.set({
    basePath: '',
    frameworks: ['jasmine', 'angular-cli'],
    plugins: [
      require('karma-jasmine'),
      require('karma-chrome-launcher'),
      require('karma-remap-istanbul'),
      require('angular-cli/plugins/karma')
    ],
    files: [
      { pattern: './src/test.ts', watched: false }
    ],
    preprocessors: {
      './src/test.ts': ['angular-cli']
    },
    mime: {
      'text/x-typescript': ['ts','tsx']
    },
    remapIstanbulReporter: {
      reports: {
        html: 'coverage',
        lcovonly: './coverage/coverage.lcov'
      }
    },
    angularCli: {
      config: './angular-cli.json',
      environment: 'dev'
    },
    reporters: config.angularCli && config.angularCli.codeCoverage
              ? ['progress', 'karma-remap-istanbul']
              : ['progress'],
    port: 9876,
    colors: true,
    logLevel: config.LOG_INFO,
    autoWatch: true,
    browsers: ['Chrome'],
    singleRun: false
  });
};

这是我的 test.ts，位于我的 src 文件夹中:

declare var __karma__: any;
declare var require: any;

__karma__.loaded = function () {};

getTestBed().initTestEnvironment(
  BrowserDynamicTestingModule,
  platformBrowserDynamicTesting()
);
const context = require.context('./', true, /\.spec\.ts$/);
context.keys().map(context);
__karma__.start();

我的文件夹结构是:

    +---app
|   +---class
|   +---components
|   +---services
|   \---templates
+---assets
|   \---images
\---environments

因此，在我的组件中，我创建了一个名为 feeds.component.spec.ts 的测试，它与名为 feeds.component.ts 的组件关联。

我的 Windows 控制台的输出如下:

Unable to find "@angular/cli" in devDependencies.

The package "angular-cli" has been deprecated and renamed to "@angular/cli".

Please take the following steps to avoid issues:
"npm uninstall --save-dev angular-cli"
"npm install --save-dev @angular/cli@latest"

08 05 2017 08:33:12.674:WARN [karma]: No captured browser, open http://localhost
:9876/
08 05 2017 08:33:12.687:INFO [karma]: Karma v1.2.0 server started at http://loca
lhost:9876/
08 05 2017 08:33:12.688:INFO [launcher]: Launching browser Chrome with unlimited
 concurrency
08 05 2017 08:33:12.897:INFO [launcher]: Starting browser Chrome
08 05 2017 08:33:17.033:INFO [Chrome 58.0.3029 (Windows 10 0.0.0)]: Connected on
 socket /#tif1xw_35N5kuco6ACBA with id 3123123

并且 karma 调试控制台只输出 Skipped 0 tests 所以没有测试正在启动。

奇怪的是，我可以启动位于我的 template 文件夹中的默认测试:app.component.spec.ts:

Chrome 58.0.3029 (Windows 10 0.0.0): Executed 3 of 3 (3 FAILED) (0 secs / 0.159
Chrome 58.0.3029 (Windows 10 0.0.0): Executed 3 of 3 (3 FAILED) ERROR (0.536 sec
s / 0.159 secs)

我还尝试通过评论 test.ts 模式和硬编码我的组件来在我的 karma.conf.js 中“强制”测试:

files: [
  //{ pattern: './src/test.ts', watched: false },
  { pattern: 'app/components/feeds.component.spec.ts', included: true, watched:false }
],

但这会输出以下内容:

Uncaught SyntaxError: Unexpected token import
at src/app/components/feeds.component.spec.ts:1

为什么我的组件测试没有启动？

Answer 1

请执行以下步骤以避免出现问题:

  npm uninstall --save-dev angular-cli  npm clean  npm install --save-dev @angular/cli@latest

你也应该在全局范围内这样做。