5

On some machines building the Angular app takes more then 2*60s (default timeout for Chrome started by Karma to catch the content).

Is there a way to force Karma to start Chrome after build is finished?

My package.json:

{
  "dependencies": {
    "@angular/animations": "4.4.4",
    "@angular/common": "4.4.4",
    "@angular/compiler": "4.4.4",
    "@angular/core": "4.4.4",
    "@angular/forms": "4.4.4",
    "@angular/http": "4.4.4",
    "@angular/platform-browser": "4.4.4",
    "@angular/platform-browser-dynamic": "4.4.4",
    "@angular/platform-server": "4.4.4",
    "@angular/router": "4.4.4",
    "rxjs": "5.4.3",
    "ts-md5": "^1.2.2",
    "zone.js": "^0.8.17"
  },
  "devDependencies": {
    "@angular/cli": "1.4.4",
    "@angular/compiler-cli": "4.4.4",
    "@types/jasmine": "2.5.45",
    "@types/node": "~6.0.60",
    "jasmine-core": "^2.8.0",
    "jasmine-spec-reporter": "^4.2.1",
    "karma": "^1.7.1",
    "karma-chrome-launcher": "^2.2.0",
    "karma-cli": "~1.0.1",
    "karma-coverage-istanbul-reporter": "^1.3.0",
    "karma-jasmine": "~1.1.0",
    "karma-jasmine-html-reporter": "^0.2.2",
    "protractor": "^5.1.2",
    "protractor-console-plugin": "^0.1.1",
    "protractor-jasmine2-screenshot-reporter": "^0.4.1",
    "ts-helpers": "1.1.2",
    "ts-node": "^3.3.0",
    "tslint": "^5.7.0",
    "typescript": "2.3.4"
  }
}

and karma.conf.js:

module.exports = function (config) {
    config.set({
        basePath: '',
        frameworks: ['jasmine', '@angular/cli'],
        plugins: [
            require('karma-jasmine'),
            require('karma-chrome-launcher'),
            require('karma-jasmine-html-reporter'),
            require('karma-coverage-istanbul-reporter'),
            require('@angular/cli/plugins/karma')
        ],
        client: {
            clearContext: false // leave Jasmine Spec Runner output visible in browser
        },
        files: [{
                pattern: './src/test.ts',
                watched: false
            },
            {
                pattern: './src/assets/**',
                watched: false,
                included: false,
                nocache: false,
                served: true
            }
        ],
        preprocessors: {
            './src/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'] :
            ['progress', 'kjhtml'],
        port: 9876,
        colors: true,
        logLevel: config.LOG_INFO,
        autoWatch: true,
        autoWatchDelay: 1000,
        browsers: ['Chrome'],
        singleRun: false
    });
};
koral
  • 2,807
  • 3
  • 37
  • 65
  • Did you end up finding any solution for this? I am on Angular 12 now and having the same issue. Build takes long and during this time Chrome instance gets created and destroyed multiple times due to the timeout. – Reza Jun 18 '21 at 14:56

2 Answers2

0

If I understand you correctly:

ng serve --open is what you are looking for.

You can chain it after a successful build as an npm startup script, or in other tools, like gulp or grunt for instance.

ForestG
  • 17,538
  • 14
  • 52
  • 86
0

You can increase multiple timeouts in the karma.conf.js, would that be an option for you? Just guessing from the name, captureTimeout might fit what you need. In our project, we set all of them to values of about 10 minutes. I'm totally not proud of this (because it means that building our app must be badly slow...), but at least our tests run.

browserDisconnectTimeout: <enter here desired value in ms>,
browserNoActivityTimeout: ...,
captureTimeout: ...,
pingTimeout: ...,
slim
  • 414
  • 1
  • 7