Jasmine 在不同浏览器上测试 Angular 应用

Question

我希望运行我的测试在本地使用 Chrome 作为浏览器，并在构建服务器上使用 phantomjs。我如何在 karma.conf.js 文件

中配置它

module.exports = function (config) {
  config.set({
    basePath: '',
    frameworks: ['jasmine', '@angular/cli'],
    plugins: [
      require('karma-jasmine'),
      require('karma-chrome-launcher'),
      require('karma-phantomjs-launcher'),
      require('karma-jasmine-html-reporter'),
      require('karma-coverage-istanbul-reporter'),
      require('karma-trx-reporter'),
      require('@angular/cli/plugins/karma')
    ],
    client:{
      clearContext: false // leave Jasmine Spec Runner output visible in browser
    },
    files: [
      { pattern: './<%= sourceDir %>/test.ts', watched: false },
    ],
    preprocessors: {
      './<%= sourceDir %>/test.ts': ['@angular/cli']
    },
    mime: {
      'text/x-typescript': ['ts','tsx']
    },
    coverageIstanbulReporter: {
      reports: [ 'html', 'lcovonly' ],
      fixWebpackSourcePaths: true
    },
    angularCli: {
      environment: 'dev'
    },
    reporters: config.angularCli && config.angularCli.codeCoverage
      ? ['progress', 'coverage-istanbul', 'trx']
      : ['progress', 'kjhtml', 'trx'],
    trxReporter: {
      outputFile: 'test-results.trx',
      shortTestName: false
    },
    port: 9876,
    colors: true,
    logLevel: config.LOG_INFO,
    autoWatch: true,
    browsers: ['Chrome'],
    singleRun: false
  });
};

在我的构建服务器上，我使用了这个配置：

browsers: ['PhantomJs'],
singleRun: true

我运行通过运行ning npm test 在我的构建服务器上进行测试，这会启动 ng 测试。有没有办法直接在这个配置文件上配置它，或者我应该使用不同的 karma.conf.js 文件？以及我应该如何使用它。或者我应该在 ng 测试中使用一些参数？

Answer 1

我所做的是使用 2 个不同的 npm 脚本来触发测试（基本上是运行 karma start），称为 test 和 test-chrome。然后在 karma.conf.js 之前我做了这个 module.exports:

var ENV = process.env.npm_lifecycle_event;
var isChrome= ENV === 'test-chrome';

并在配置中：

browsers: isChrome? ['Chrome'] : ['PhantomJS']

在你的情况下，你可以运行在本地测试-chrome，然后只在构建服务器上测试。

Answer 2

我通过在包配置中使用一些脚本找到了一个不错且简单的解决方案

"test": "ng test --single-run --browsers=PhantomJS",
"test.watch": "ng test --browsers=Chrome",

Jasmine 在不同浏览器上测试 Angular 应用

Jasmine testing Angular app with different browsers

jasmine

phantomjs

karma-jasmine

angular