Karma 无法捕获 Chrome v93 并超时/放弃

Question

在最近将 Google Chrome 自动更新到版本 93 之后，我们刚刚在 CI 环境（TeamCity/Windows）中遇到了一些构建失败。这些失败都如下所示：

[14:02:41] :     [Step 3/12] > OUR_APP_PACKAGE@0.0.0 ci-test C:\BuildAgent\work\7084fa910d4648a4\OUR_APP_PACKAGE
[14:02:41] :     [Step 3/12] > ng test --watch=false --sourceMap=false
[14:02:41] :     [Step 3/12] 
[14:03:00] :     [Step 3/12] 01 09 2021 14:02:59.394:INFO [karma]: Karma v3.0.0 server started at http://0.0.0.0:9876/
[14:03:00] :     [Step 3/12] 01 09 2021 14:02:59.779:INFO [launcher]: Launching browser Chrome with unlimited concurrency
[14:03:00] :     [Step 3/12] 01 09 2021 14:02:59.793:INFO [launcher]: Starting browser Chrome
[14:04:00] :     [Step 3/12] 01 09 2021 14:04:00.752:WARN [launcher]: Chrome have not captured in 60000 ms, killing.
[14:04:00] :     [Step 3/12] 01 09 2021 14:04:00.820:INFO [launcher]: Trying to start Chrome again (1/2).
[14:05:01] :     [Step 3/12] 01 09 2021 14:05:01.422:WARN [launcher]: Chrome have not captured in 60000 ms, killing.
[14:05:01] :     [Step 3/12] 01 09 2021 14:05:01.461:INFO [launcher]: Trying to start Chrome again (2/2).
[14:06:01] :     [Step 3/12] 01 09 2021 14:06:01.837:WARN [launcher]: Chrome have not captured in 60000 ms, killing.
[14:06:01] :     [Step 3/12] 01 09 2021 14:06:01.879:ERROR [launcher]: Chrome failed 2 times (timeout). Giving up.
[14:06:02]W:     [Step 3/12] npm ERR! code ELIFECYCLE
[14:06:02]W:     [Step 3/12] npm ERR! errno 1
[14:06:02]W:     [Step 3/12] npm ERR! OUR_APP_PACKAGE@0.0.0 ci-test: `ng test --watch=false --sourceMap=false`
[14:06:02]W:     [Step 3/12] npm ERR! Exit status 1
[14:06:02]W:     [Step 3/12] npm ERR! 
[14:06:02]W:     [Step 3/12] npm ERR! Failed at the OUR_APP_PACKAGE@0.0.0 ci-test script.
[14:06:02]W:     [Step 3/12] npm ERR! This is probably not a problem with npm. There is likely additional logging output above.
[14:06:02]W:     [Step 3/12] 
[14:06:02]W:     [Step 3/12] npm ERR! A complete log of this run can be found in:
[14:06:02]W:     [Step 3/12] npm ERR!     C:\Users\teamcity\AppData\Roaming\npm-cache\_logs\2021-09-01T13_06_02_086Z-debug.log
[14:06:02]W:     [Step 3/12] Process exited with code 1
[14:05:46]E:     [Step 3/12] Process exited with code 1 (Step: "npm run ci-test" (test Angular app) (Command Line))

我们已排除导致此错误的代码库更改。重复之前成功构建的提交的 CI 构建（在同一个构建代理上，具有完全相同的构建配置）现在也失败了。

随后我们注意到所有故障都发生在一个构建代理上，但第二天另一个代理也开始出现故障。显示失败的构建代理的共同因素是它们已自动更新到 Google Chrome v93。

Answer 1

不管谷歌浏览器是否存在真正的错误，我们注意到我们可以通过在我们的 Karma 配置文件中使用 ChromeHeadless 而不是常规 Chrome 来解决这个问题。我们在我们的 Karma 配置 karma.conf.js 中进行了以下一行更改，一切都再次正常工作。我已经包含了整个文件，但实际上只有 browsers: 行是相关的。

我们没有特别的理由使用完整的 Chrome 而不是 Chrome Headless，因此解决方法无限期地适合我们。

module.exports = function (config) {
  config.set({
    basePath: '',
    frameworks: ['jasmine', '@angular-devkit/build-angular'],
    plugins: [
      require('karma-jasmine'),
      require('karma-chrome-launcher'),
      require('karma-jasmine-html-reporter'),
      require('karma-coverage-istanbul-reporter'),
      require('@angular-devkit/build-angular/plugins/karma')
    ],
    client:{
      clearContext: false
    },
    coverageIstanbulReporter: {
      dir: require('path').join(__dirname, 'coverage'), reports: [ 'html', 'lcovonly' ],
      fixWebpackSourcePaths: true
    },
    angularCli: {
      environment: 'dev'
    },
    reporters: ['progress', 'kjhtml'],
    port: 9876,
    colors: true,
    logLevel: config.LOG_INFO,
    autoWatch: true,
    browsers: ['ChromeHeadless'], // Previously this was 'Chrome'
    singleRun: false
  });

Answer 2

实际上，我们开始探索同样的问题，帮助开始使用带有几个标志的自定义启动器。

在我们的 karma.conf.js 包含以下设置之前：

module.exports = function (config) {
    config.set({
       ...
       browsers: ['Chrome'],
       ...
       customLaunchers: {
            ChromeHeadlessNoSandbox: {
                base: 'ChromeHeadless',
                flags: ['--no-sandbox']
            }
        },
    });
}       

现在它包含以下更改，测试再次开始运行：

module.exports = function (config) {
    config.set({
       ...
       browsers: ['ChromeNoSandbox'],
       ...
        customLaunchers: {
            ChromeNoSandbox: {
                base: 'Chrome',
                flags: [
                    '--no-sandbox',
                ]
            }
        },
    });
}