search

karma-runner / karma-chrome-launcher

A Karma plugin. Launcher for Chrome and Chrome Canary.
MIT License
467 stars 119 forks source link

ChromeHeadless (Puppeteer) not captured when running in docker #170

Open tleunen opened 6 years ago

tleunen commented 6 years ago

Trying to convert my karma config from phantomjs to puppeteer but I'm facing issues when running my test suite. Here's the log:

[18:25:41] Starting 'karma'...
29 01 2018 18:26:37.287:INFO [karma]: Karma v2.0.0 server started at http://0.0.0.0:9876/
29 01 2018 18:26:37.289:INFO [launcher]: Launching browser ChromeHeadless with unlimited concurrency
29 01 2018 18:26:37.501:INFO [launcher]: Starting browser ChromeHeadless
29 01 2018 18:27:37.521:WARN [launcher]: ChromeHeadless have not captured in 60000 ms, killing.
29 01 2018 18:27:39.527:WARN [launcher]: ChromeHeadless was not killed in 2000 ms, sending SIGKILL.
29 01 2018 18:27:41.532:WARN [launcher]: ChromeHeadless was not killed by SIGKILL in 2000 ms, continuing.

After debugging, the CHROME_BIN is available here: /tmp/webcore/node_modules/puppeteer/.local-chromium/linux-526987/chrome-linux/chrome

And the karma config are these:

{ action: 'run',
  singleRun: true,
  browsers: [ 'ChromeHeadless' ],
  reporters: [ 'junit', 'dots' ],
  configFile: '/tmp/webcore/test/unit/config/karma.conf' }

Also tried using a custom launcher with the --no-sandbox option, but same issue... :/

Any help is definitely welcome.

tleunen commented 6 years ago

Looks like the issue arise only when installing puppeteer locally to the project (meaning it's inside the package.json dev dependencies), compared to installed globally.

I'd prefer having puppeteer locally to the project instead of installing it globally in my dockerfile. Anybody knows how to fix the issue?

outshineamaze commented 6 years ago

i have same question, when karma run : Launching browsers ChromeCanaryHeadless ChromeCanaryHeadless have not captured in 60000 ms look like the puppeteer-chrmoe-docker google-chrome-unstable is not support the karma?

soanvig commented 6 years ago

I have exact issue - I cannot run my configuration on GitLab CI. It works locally though (without Docker).

But I may suggest you to set

// karma.conf.js
process.env.CHROME_BIN = require('puppeteer').executablePath();

Maybe that will help? In my case it's not working anyway in Docker, but AFAIK this line is neccessary.

kewde commented 6 years ago

If you're storing a cache of the node modules, then try clearing it (node_modules).

jmaitrehenry commented 6 years ago

If you want, this is my configuration for karma and docker and it works:

    browser: 'Chrome_without_security',
    customLaunchers: {
      Chrome_without_security: {
        base: 'ChromeHeadless',
        flags: [
          '--no-sandbox',
          '--disable-setuid-sandbox',
          '--disable-gpu',
          '--remote-debugging-port=9222',
        ],
      },
    },

Dockerfile:

FROM node:8
RUN apt-get update && \
    apt-get install -y libxtst6 libnss3 libXss1 libatk-bridge2.0-0 libgtk-3-0 && \
    apt-get clean && \
    rm -rf /var/lib/apt/lists/*
vlodko commented 6 years ago

this worked for me on build server:

    browsers: ['Chrome'],
    browserDisconnectTimeout: 10000,
    browserDisconnectTolerance: 3,
    browserNoActivityTimeout: 60000,
    flags: [
      '--disable-web-security',
      '--disable-gpu',
      '--no-sandbox'
    ]
swetapatil1 commented 6 years ago

ChromeHeadless

@jmaitrehenry Can I have a look at your package.json file? I am also facing the same issue and after making base: 'ChromeHeadless' from base: 'Chrome', I am getting below error. Cannot load browser "ChromeHeadless"!

JoshMcCullough commented 5 years ago

@swetapatil1 try npm i --save-dev puppeteer to get ChromeHeadless working.

oorobets commented 5 years ago

Had same problem, when I ran tests using Gitlab CI. I just added 

before_script:
    - export CHROME_BIN=/usr/bin/google-chrome
Zordaxy commented 5 years ago

Have similar issue. karma.conf.js:

process.env.CHROME_BIN = require('puppeteer').executablePath();

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

UPDATE: In my case it was a wrong link to node folder in one of the running scripts. After fixing it everything went well.

caroso1222 commented 5 years ago

ChromeHeadless

@jmaitrehenry Can I have a look at your package.json file? I am also facing the same issue and after making base: 'ChromeHeadless' from base: 'Chrome', I am getting below error. Cannot load browser "ChromeHeadless"!

That's probably happening because you're also using ChromeHeadless as the name of your custom launcher. Keep your base as ChromeHeadless but change your config as:

browsers: ['MyChromeHeadless'], // <- not 'ChromeHeadless'
customLaunchers: {
 MyChromeHeadless: {
    base: 'ChromeHeadless',
    flags: [
      '--no-sandbox'
    ]
  }
}

Also, if you happened to install Chrome manually (via wget & dpkg) make sure your env var is properly set as export CHROME_BIN=/usr/bin/google-chrome.

cmacdonnacha commented 5 years ago

Same issue for me using Angular 7. Running docker inside Jenkins.

27 06 2019 10:06:05.618:INFO [karma-server]: Karma v4.0.1 server started at http://0.0.0.0:9876/
27 06 2019 10:06:05.622:INFO [launcher]: Launching browsers ChromeHeadlessNoSandbox with concurrency unlimited
27 06 2019 10:06:05.659:INFO [launcher]: Starting browser ChromeHeadless
27 06 2019 10:09:35.725:WARN [launcher]: ChromeHeadless have not captured in 210000 ms, killing.
27 06 2019 10:09:37.728:WARN [launcher]: ChromeHeadless was not killed in 2000 ms, sending SIGKILL.
27 06 2019 10:09:39.731:WARN [launcher]: ChromeHeadless was not killed by SIGKILL in 2000 ms, continuing.

karma.conf.js:

const process = require('process');
process.env.CHROME_BIN = require('puppeteer').executablePath();

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('karma-spec-reporter'),
      require('@angular-devkit/build-angular/plugins/karma'),
    ],
    client: {
      clearContext: false, // leave Jasmine Spec Runner output visible in browser
    },
    coverageIstanbulReporter: {
      dir: require('path').join(__dirname, '../coverage/my-project'),
      reports: ['html', 'lcovonly', 'text-summary'],
      fixWebpackSourcePaths: true,
    },
    reporters: ['spec'],
    port: 9876,
    colors: true,
    logLevel: config.LOG_DEBUG,
    autoWatch: true,
    reportSlowerThan: 90,
    browsers: ['ChromeHeadlessNoSandbox'],
    customLaunchers: {
      ChromeHeadlessNoSandbox: {
        base: 'ChromeHeadless',
        flags: ['--no-sandbox', '--disable-dev-shm-usage'],
      },
    },
    restartOnFileChange: true,
    captureTimeout: 210000,
    browserDisconnectTolerance: 3,
    browserDisconnectTimeout: 210000,
    browserNoActivityTimeout: 210000,
  });
};
Heneman commented 5 years ago

Any update on this? It's been open without any updates for well over a year and a half now. This is still an issue with Windows Server 2019 and karma-chrome-launcher 2.20

cmacdonnacha commented 5 years ago

@Heneman I ended up just installing puppeteer via the Docker file itself and that worked. I remove puppateer from my packages.json file.

Heneman commented 5 years ago

@cmacdonnacha O'rly. I'll give that a shot. Was puppeteer the only npm package that you had to move to the Dockerfile? Thanks for the tip.

cmacdonnacha commented 5 years ago

@Heneman here's the Dockerfile:

### STAGE 1: Build ###
FROM node:slim as builder

COPY package.json package-lock.json .npmrc ./

## Storing node modules on a separate layer will prevent unnecessary npm installs at each build
RUN npm set strict-ssl false
RUN npm ci && mkdir /my-app && mv ./node_modules ./my-app

WORKDIR /my-app

# Copy everything from the local client directory and copy it over to the docker working directory
COPY . .

## Build the angular app in production mode and store the artifacts in dist folder
RUN npm run ng build

### STAGE 2: Unit testing
FROM node:slim as unit-tests

## Download Chrome and the dependencies needed to run it on docker
RUN apt-get update -y && \
    apt-get install ca-certificates \
      gconf-service \
      libasound2 \
      libatk1.0-0 \
      libatk1.0-0 \
      libdbus-1-3 \
      libgconf-2-4 \
      libgtk-3-0 \
      libnspr4 \
      libnss3 \
      libx11-xcb1 \
      libxss1 \
      libxtst6 \
      fonts-liberation \
      libappindicator3-1 \
      xdg-utils \
      lsb-release \
      wget \
      curl \
      procps \
      xz-utils -y --no-install-recommends && \
    wget https://dl.google.com/linux/direct/google-chrome-stable_current_amd64.deb && \
    dpkg -i google-chrome*.deb && \
    apt-get install -f && \
    apt-get clean autoclean && \
    rm -rf /var/lib/apt/lists/* /tmp/* /var/tmp/* google-chrome-stable_current_amd64.deb

WORKDIR /my-app

## Copy the files over from the previous "builder" stage
COPY --from=builder /my-app

## Run the unit tests
RUN npm run test
Heneman commented 5 years ago

@cmacdonnacha I'm able to see that a connection is being made to a socket, however it's still crashing with code 0:

15:08:37  20 09 2019 15:08:36.360:INFO [karma]: Karma v1.7.1 server started at http://0.0.0.0:9876/
15:08:37  20 09 2019 15:08:36.360:INFO [launcher]: Launching browser ChromeHeadlessCI with unlimited concurrency
15:08:37  20 09 2019 15:08:36.369:INFO [launcher]: Starting browser Chrome
15:08:37  20 09 2019 15:08:36.370:DEBUG [temp-dir]: Creating temp dir at C:\Users\ContainerAdministrator\AppData\Local\Temp\karma-74241463
15:08:37  20 09 2019 15:08:36.371:DEBUG [launcher]: C:\node_modules\puppeteer\.local-chromium\win64-686378\chrome-win\chrome.exe --user-data-dir=C:\Users\ContainerAdministrator\AppData\Local\Temp\karma-74241463 --no-default-browser-check --no-first-run --disable-default-apps --disable-popup-blocking --disable-translate --disable-background-timer-throttling --disable-renderer-backgrounding --disable-device-discovery-notifications --no-sandbox --headless --disable-gpu --disable-translate --disable-extensions --disable-dev-shm-usage http://localhost:9876/?id=74241463
15:08:37  20 09 2019 15:08:37.002:DEBUG [web-server]: serving: C:\workspace\test\src\Haworth.Atlas.App\node_modules\karma\static/client.html
15:08:37  20 09 2019 15:08:37.029:DEBUG [web-server]: serving: C:\workspace\test\src\Haworth.Atlas.App\node_modules\karma\static/karma.js
15:08:37  20 09 2019 15:08:37.116:DEBUG [karma]: A browser has connected on socket h_kkeLa1MAIcoK0MAAAA
15:08:37  20 09 2019 15:08:37.143:DEBUG [launcher]: Process Chrome exited with code 0
15:08:37  20 09 2019 15:08:37.143:ERROR [launcher]: Cannot start Chrome
15:08:37    [0920/150836.509:ERROR:network_change_notifier_win.cc(141)] WSALookupServiceBegin failed with: 0
15:08:37  
15:08:37  20 09 2019 15:08:37.143:ERROR [launcher]: Chrome stdout: 
15:08:37  20 09 2019 15:08:37.144:ERROR [launcher]: Chrome stderr: [0920/150836.509:ERROR:network_change_notifier_win.cc(141)] WSALookupServiceBegin failed with: 0
15:08:37

That's the first time that I've been able to get the browser captured. I ended up copying the package.json file from the image and running npm install in the Dockerfile:

FROM mcr.microsoft.com/windows:1809

SHELL ["powershell.exe", "-ExecutionPolicy", "Bypass", "-Command"]
RUN New-Item -Type "File" -Force $profile
RUN New-Item -Type "Directory" -Force "C:\installs"
COPY installs /installs

RUN Start-Process msiexec.exe -Wait -ArgumentList '/I C:\installs\DacFramework-x64.msi /quiet'
RUN Start-Process "C:\installs\dotnet-sdk-2.1.201-win-x64.exe" -Wait -ArgumentList "/install,/quiet,/norestart"

RUN iex ((New-Object System.Net.WebClient).DownloadString('https://chocolatey.org/install.ps1'))
RUN choco install -y nodejs --version 8.9.3

RUN npm install -g @angular/cli@1.7.3
RUN npm install --global --production --vs2015 windows-build-tools

ENV JAVA_HOME "C:\\Java\\jre1.8.0_91"
RUN (New-Object System.Net.WebClient).Downloadfile('http://javadl.oracle.com/webapps/download/AutoDL?BundleId=210185', 'C:\\jre-8u91-windows-x64.exe')
RUN Start-Process -Filepath 'C:\\jre-8u91-windows-x64.exe' -passthru -wait -argumentlist "/s,INSTALLDIR=$env:JAVA_HOME,/L,jre_install64.log"
RUN if(Test-Path 'C:\jre-8u91-windows-x64.exe') {Remove-Item 'C:\jre-8u91-windows-x64.exe' -Force -Recurse}
RUN $env:PATH = $env:PATH + ';' + $env:JAVA_HOME + '\\bin'; \
    [Environment]::SetEnvironmentVariable('PATH', $env:PATH, [EnvironmentVariableTarget]::Machine);

ARG BASE_URL
ARG SECRET
RUN (New-Object System.Net.WebClient).DownloadFile('{0}/jnlpJars/slave.jar' -f $env:BASE_URL, 'slave.jar');

WORKDIR /installs
RUN npm install
WORKDIR /
RUN Remove-Item /installs -Recurse -Force

RUN choco install -y git --params='/NoShellIntegration /NoAutoCrlf'
RUN npm i -D puppeteer ^ajv@6.0.0
RUN mkdir 'C:\Program Files (x86)\NuGet'
RUN Invoke-WebRequest "https://dist.nuget.org/win-x86-commandline/v4.9.4/nuget.exe" -OutFile 'C:\Program Files (x86)\NuGet\nuget.exe' -UseBasicParsing
RUN choco install -y netfx-4.6.1-devpack

ENTRYPOINT ["C:\\Java\\jre1.8.0_91\\bin\\java.exe", "-jar", ".\\slave.jar"]

I'm currently trying to build manually within the container to see if i can get more detailed output. I can update with anything new.

Here's karma.conf.js:

// Karma configuration file, see link for more information
// https://karma-runner.github.io/0.13/config/configuration-file.html

// used for ng test in headless chrome
process = require('process');
process.env.CHROME_BIN = require('puppeteer').executablePath();

module.exports = function (config) {
    config.set({
        frameworks: ['jasmine'],
        plugins: [
            require('karma-jasmine'),
            require('karma-chrome-launcher'),
            require('karma-jasmine-html-reporter'),
            require('karma-coverage-istanbul-reporter'),
            require('karma-junit-reporter')
        ],
        client: {
            clearContext: false // leave Jasmine Spec Runner output visible in browser
        },
        coverageIstanbulReporter: {
            reports: ['html', 'lcovonly'],
            fixWebpackSourcePaths: true
        },
        reporters: ['progress', 'kjhtml', 'junit'],
        junitReporter: {
            outputDir: '../../NgTestResults/', // results will be saved as $outputDir/$browserName.xml
            outputFile: undefined, // if included, results will be saved as $outputDir/$browserName/$outputFile
            useBrowserName: true, // add browser name to report and classes names
            color: false
        },
        logLevel: config.LOG_DEBUG,
        browsers: ['ChromeHeadlessCI'],
        captureTimeout: 60000, // it was already there
        browserDisconnectTimeout : 10000,
        browserDisconnectTolerance : 1,
        browserNoActivityTimeout : 60000,//by default 10000
        browserSocketTimeout: 200000,
        port: 9876,
        customLaunchers: {
            ChromeHeadlessCI: {
                base: 'Chrome',
                flags: [
                    '--no-sandbox',
                    '--headless',
                    '--disable-gpu',
                    '--disable-translate',
                    '--disable-extensions',
                    '--disable-dev-shm-usage'
                ]
            }
        },
        singleRun: false
    });
};

And out package.json:

{
  "name": "Project.App",
  "private": true,
  "version": "0.0.0",
  "scripts": {
    "start": "ng serve",
    "ci": "ng build --prod",
    "test": "ng test --no-watch --browsers ChromeHeadlessCI"
  },
  "devDependencies": {
    "@angular/animations": "5.2.0",
    "@angular/cli": "1.7.3",
    "@angular/common": "5.2.0",
    "@angular/compiler": "5.2.0",
    "@angular/compiler-cli": "5.2.0",
    "@angular/core": "5.2.0",
    "@angular/forms": "5.2.0",
    "@angular/http": "5.2.0",
    "@angular/platform-browser": "5.2.0",
    "@angular/platform-browser-dynamic": "5.2.0",
    "@angular/platform-server": "5.2.0",
    "@angular/router": "5.2.0",
    "@types/chai": "4.0.1",
    "@types/d3": "^5.0.0",
    "@types/jasmine": "^2.8.6",
    "@types/webpack-env": "1.13.0",
    "ajv": "^6.0.0",
    "angular2-router-loader": "0.3.5",
    "angular2-template-loader": "0.6.2",
    "aspnet-prerendering": "^3.0.1",
    "aspnet-webpack": "^2.0.3",
    "awesome-typescript-loader": "3.2.1",
    "bootstrap": "3.3.7",
    "chai": "4.0.2",
    "css": "2.2.1",
    "css-loader": "^0.28.11",
    "es6-shim": "0.35.3",
    "event-source-polyfill": "0.0.9",
    "expose-loader": "0.7.3",
    "file-loader": "^0.11.2",
    "html-loader": "0.4.5",
    "isomorphic-fetch": "2.2.1",
    "jasmine": "^3.1.0",
    "jasmine-core": "^3.1.0",
    "jquery": "3.2.1",
    "json-loader": "0.5.4",
    "karma": "^1.7.1",
    "karma-chai": "0.1.0",
    "karma-chrome-launcher": "^2.2.0",
    "karma-cli": "1.0.1",
    "karma-coverage-istanbul-reporter": "^1.4.2",
    "karma-jasmine": "^1.1.1",
    "karma-jasmine-html-reporter": "^1.0.0",
    "karma-junit-reporter": "^1.2.0",
    "karma-webpack": "3.0.0",
    "popper.js": "^1.14.1",
    "preboot": "4.5.2",
    "raw-loader": "0.5.1",
    "reflect-metadata": "0.1.10",
    "rxjs": "5.5.6",
    "sass-loader": "^6.0.7",
    "style-loader": "^0.18.2",
    "to-string-loader": "1.1.5",
    "ts-loader": "^3.5.0",
    "typescript": "^2.6.2",
    "url-loader": "^0.5.9",
    "zone.js": "^0.8.21"
  },
  "dependencies": {
    "@angular/cdk": "5.2.0",
    "@angular/material": "5.2.0",
    "@types/c3": "^0.4.54",
    "@types/karma": "^1.7.3",
    "angular-resizable-element": "^1.2.0",
    "c3": "^0.4.21",
    "d3": "^4.13.0",
    "hammerjs": "^2.0.8",
    "ng2-dragula": "^1.5.0",
    "normalize.css": "^8.0.0"
  }
}
Heneman commented 5 years ago

I believe that I've got this working correctly. I believe that the issue was with Puppeteer's Chromium that is supposed to be used by default. I included a Chromium download and extraction within the Dockerfile and split dependencies into separate layered installs which seemed to allow the browser to actually be captured.

Relevant Dockerfile excerpt:

RUN npm i -D @angular/cli@1.7.3
RUN npm i -D --production --vs2015 windows-build-tools
RUN npm i -D puppeteer
RUN npm i -D ^ajv@6.0.0
RUN npm i -D rxjs@^5.5.0
RUN npm i -D zone.js@^0.8.4
RUN npm i -D @angular/core@^5.0.0 

RUN (New-Object System.Net.WebClient).Downloadfile('https://www.googleapis.com/download/storage/v1/b/chromium-browser-snapshots/o/Win_x64%2F698876%2Fchrome-win.zip?generation=1569247415462431&alt=media', 'C:\\chromium.zip')
RUN Expand-Archive -Path "C:\\chromium.zip" -DestinationPath "C:\\chromium"
ENV CHROME_BIN "C:\\chromium\\chrome.exe"
RUN Remove-Item "C:\\chromium.zip"

And the logs now:

09:25:57  > Project@0.0.0 test C:\workspace\test\src\Project
09:25:57  > ng test --no-watch --browsers ChromeHeadless
09:25:57  

09:26:01  24 09 2019 09:26:01.054:DEBUG [config]: autoWatch set to false, because of singleRun
09:26:01  24 09 2019 09:26:01.061:DEBUG [plugin]: Loading inlined plugin (defining framework:jasmine).
09:26:01  24 09 2019 09:26:01.062:DEBUG [plugin]: Loading inlined plugin (defining launcher:Chrome, launcher:ChromeHeadless, launcher:ChromeCanary, launcher:ChromeCanaryHeadless, launcher:Chromium, launcher:ChromiumHeadless, launcher:Dartium, test).
09:26:01  24 09 2019 09:26:01.062:DEBUG [plugin]: Loading inlined plugin (defining reporter:kjhtml).
09:26:01  24 09 2019 09:26:01.062:DEBUG [plugin]: Loading inlined plugin (defining reporter:coverage-istanbul).
09:26:01  24 09 2019 09:26:01.062:DEBUG [plugin]: Loading inlined plugin (defining reporter:junit).
09:26:01  24 09 2019 09:26:01.076:DEBUG [web-server]: Instantiating middleware
09:26:01  24 09 2019 09:26:01.099:DEBUG [reporter]: Trying to load reporter: kjhtml
09:26:01  24 09 2019 09:26:01.100:DEBUG [reporter]: Trying to load color-version of reporter: kjhtml (kjhtml_color)
09:26:01  24 09 2019 09:26:01.100:DEBUG [reporter]: Couldn't load color-version.
09:26:01  24 09 2019 09:26:01.100:DEBUG [reporter]: Trying to load reporter: junit
09:26:01  24 09 2019 09:26:01.101:DEBUG [reporter]: Trying to load color-version of reporter: junit (junit_color)
09:26:01  24 09 2019 09:26:01.101:DEBUG [reporter]: Couldn't load color-version.
09:26:01  24 09 2019 09:26:01.135:INFO [karma]: Karma v1.7.1 server started at http://0.0.0.0:9876/
09:26:01  24 09 2019 09:26:01.136:INFO [launcher]: Launching browser ChromeHeadless with unlimited concurrency
09:26:01  24 09 2019 09:26:01.142:INFO [launcher]: Starting browser ChromeHeadless
09:26:01  24 09 2019 09:26:01.144:DEBUG [temp-dir]: Creating temp dir at C:\Users\ContainerAdministrator\AppData\Local\Temp\karma-49861851
09:26:01  24 09 2019 09:26:01.145:DEBUG [launcher]: C:\node_modules\puppeteer\.local-chromium\win64-686378\chrome-win\chrome.exe --user-data-dir=C:\Users\ContainerAdministrator\AppData\Local\Temp\karma-49861851 --no-default-browser-check --no-first-run --disable-default-apps --disable-popup-blocking --disable-translate --disable-background-timer-throttling --disable-renderer-backgrounding --disable-device-discovery-notifications http://localhost:9876/?id=49861851 --headless --disable-gpu --remote-debugging-port=9222
09:26:01  24 09 2019 09:26:01.783:DEBUG [web-server]: serving: C:\workspace\test\src\Project\node_modules\karma\static/client.html
09:26:01  24 09 2019 09:26:01.809:DEBUG [web-server]: serving: C:\workspace\test\src\Project\node_modules\karma\static/karma.js
09:26:02  24 09 2019 09:26:02.145:DEBUG [karma]: A browser has connected on socket HerEs3buBIQx_GBCAAAA
09:26:02  24 09 2019 09:26:02.173:INFO [HeadlessChrome 78.0.3882 (Windows 10.0.0)]: Connected on socket HerEs3buBIQx_GBCAAAA with id 49861851
09:26:02  24 09 2019 09:26:02.173:DEBUG [launcher]: ChromeHeadless (id 49861851) captured in 1.037 secs
09:26:02  24 09 2019 09:26:02.187:DEBUG [middleware:karma]: custom files null null null
09:26:02  24 09 2019 09:26:02.187:DEBUG [middleware:karma]: Serving static request /context.html
09:26:02  24 09 2019 09:26:02.188:DEBUG [web-server]: serving: C:\workspace\test\src\Project\node_modules\karma\static/context.html
09:26:02  24 09 2019 09:26:02.198:DEBUG [middleware:source-files]: Requesting /base/node_modules/jasmine-core/lib/jasmine-core/jasmine.js?daba65c98fa088349a3e9d7df843a63405ccfc15 /
09:26:02  24 09 2019 09:26:02.198:DEBUG [middleware:source-files]: Fetching C:/workspace/test/src/Project/node_modules/jasmine-core/lib/jasmine-core/jasmine.js
09:26:02  24 09 2019 09:26:02.200:DEBUG [web-server]: serving (cached): C:/workspace/test/src/Project/node_modules/jasmine-core/lib/jasmine-core/jasmine.js
09:26:02  24 09 2019 09:26:02.200:DEBUG [web-server]: serving: C:\workspace\test\src\Project\node_modules\karma\static/context.js
09:26:02  24 09 2019 09:26:02.205:DEBUG [middleware:source-files]: Requesting /base/node_modules/karma-jasmine-html-reporter/src/css/jasmine.css?c612dd734f1db56a35db7ca01f443cec8f616c09 /
09:26:02  24 09 2019 09:26:02.205:DEBUG [middleware:source-files]: Fetching C:/workspace/test/src/Project/node_modules/karma-jasmine-html-reporter/src/css/jasmine.css
09:26:02  24 09 2019 09:26:02.205:DEBUG [web-server]: serving (cached): C:/workspace/test/src/Project/node_modules/karma-jasmine-html-reporter/src/css/jasmine.css
09:26:02  24 09 2019 09:26:02.206:DEBUG [middleware:source-files]: Requesting /base/node_modules/karma-jasmine/lib/boot.js?945a38bf4e45ad2770eb94868231905a04a0bd3e /
09:26:02  24 09 2019 09:26:02.206:DEBUG [middleware:source-files]: Fetching C:/workspace/test/src/Project/node_modules/karma-jasmine/lib/boot.js
09:26:02  24 09 2019 09:26:02.207:DEBUG [web-server]: serving (cached): C:/workspace/test/src/Project/node_modules/karma-jasmine/lib/boot.js
09:26:02  24 09 2019 09:26:02.210:DEBUG [middleware:source-files]: Requesting /base/node_modules/karma-jasmine/lib/adapter.js?3e6cdea3167f037eeb11034f8eb9ce63b21a8105 /
09:26:02  24 09 2019 09:26:02.210:DEBUG [middleware:source-files]: Fetching C:/workspace/test/src/Project/node_modules/karma-jasmine/lib/adapter.js
09:26:02  24 09 2019 09:26:02.212:DEBUG [web-server]: serving (cached): C:/workspace/test/src/Project/node_modules/karma-jasmine/lib/adapter.js
09:26:02  24 09 2019 09:26:02.212:DEBUG [middleware:source-files]: Requesting /base/node_modules/karma-jasmine-html-reporter/src/lib/html.jasmine.reporter.js?04d85f096289dc3cb5ede24a747fd00dbdc7833a /
09:26:02  24 09 2019 09:26:02.212:DEBUG [middleware:source-files]: Fetching C:/workspace/test/src/Project/node_modules/karma-jasmine-html-reporter/src/lib/html.jasmine.reporter.js
09:26:02  24 09 2019 09:26:02.212:DEBUG [web-server]: serving (cached): C:/workspace/test/src/Project/node_modules/karma-jasmine-html-reporter/src/lib/html.jasmine.reporter.js
09:26:02  24 09 2019 09:26:02.218:DEBUG [middleware:source-files]: Requesting /base/node_modules/karma-jasmine-html-reporter/src/lib/adapter.js?06e808c0b15d63d6b5c63f9694c5568792485891 /
09:26:02  24 09 2019 09:26:02.218:DEBUG [middleware:source-files]: Fetching C:/workspace/test/src/Project/node_modules/karma-jasmine-html-reporter/src/lib/adapter.js
09:26:02  24 09 2019 09:26:02.218:DEBUG [web-server]: serving (cached): C:/workspace/test/src/Project/node_modules/karma-jasmine-html-reporter/src/lib/adapter.js
09:26:02  HeadlessChrome 78.0.3882 (Windows 10.0.0): Executed 0 of 0 SUCCESS (0 secs / 0 secs)
09:26:02  HeadlessChrome 78.0.3882 (Windows 10.0.0): Executed 0 of 0 ERROR (0.016 secs / 0 secs)
09:26:02  24 09 2019 09:26:02.260:DEBUG [karma]: Run complete, exiting.
09:26:02  24 09 2019 09:26:02.261:DEBUG [launcher]: Disconnecting all browsers
09:26:02  24 09 2019 09:26:02.264:DEBUG [reporter.junit]: JUnit results written to "C:\workspace\test\NgTestResults\TESTS-HeadlessChrome_78.0.3882_(Windows_10.0.0).xml".
09:26:02  24 09 2019 09:26:02.283:DEBUG [launcher]: Process ChromeHeadless exited with code 0
09:26:02  24 09 2019 09:26:02.283:DEBUG [temp-dir]: Cleaning temp dir C:\Users\ContainerAdministrator\AppData\Local\Temp\karma-49861851
09:26:02  24 09 2019 09:26:02.306:DEBUG [launcher]: Finished all browsers

I'd stripped down the Docker image to isolate the ng test portion and decrease the feedback time between changes and test builds, so I believe that the reason the tests are failing to run is a lack of other build dependencies. I'll update, but it looks like the issue with this may be with Puppeteer and not the karma-chrome-launcher project.

roballsopp commented 4 years ago

Found a solution that works for me. Like many others, I tried setting all the flags,CHROME_BIN, etc. I definitely needed the --no-sandbox flag, and I needed to set the CHROME_BIN env var in my karma config, but the thing that really tripped me up turned out to be missing dependencies for chrome in my docker image. I was using node:10.16.0-alpine and chrome was crashing because a bunch of stuff it needs didn't come in that image by default. I needed to add the following to my docker file:

RUN apk add --no-cache \
      nss \
      freetype \
      freetype-dev \
      harfbuzz \
      ca-certificates \
      ttf-freefont

Depending on your base image, you may need more or less. I actually didn't need any of this when running an ubuntu base. See Running Puppeteer in Docker for more info if this seems like your issue. I actually got things working this way with just the chromium package installed, and not puppeteer.

Here's the relevant section of my karma.conf that got this working for me:

// karma.conf.js
...
const process = require('process');
const chromium = require('chromium');
...

process.env.CHROME_BIN = chromium.path;

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

My use case is running tests as part of deployment to netlify, so I grabbed netlify's ubuntu image for debugging, and didn't need much else:

// Dockerfile
FROM netlify/build:xenial

WORKDIR /usr/app/

COPY . ./

RUN npm install

CMD npm run test-ci

If you don't want either puppeteer or chromium in your package.json, your docker file can do all the heavy lifting:

// Dockerfile
FROM node:10.16.0-alpine

RUN apk add --no-cache \
      chromium \
      nss \
      freetype \
      freetype-dev \
      harfbuzz \
      ca-certificates \
      ttf-freefont

ENV CHROME_BIN /usr/bin/chromium-browser

WORKDIR /usr/app/

COPY . ./

RUN npm install

CMD npm run test-ci

With that Dockerfile, you obviously don't need anything in your karma.conf about chromium, puppeteer, or CHROME_BIN.

OzSammo commented 4 years ago

This problem went away for us when we upgraded puppeteer from 1.3.0 to 2.0.0.

muuvmuuv commented 3 years ago

I am on puppeteer 5.5.0 and still have this issue

karma.conf.js

```js const path = require('path') process.env.CHROME_BIN = require('puppeteer').executablePath() console.log('Binary at:', process.env.CHROME_BIN) /** * Karma configuration file. * * @see {@link https://karma-runner.github.io/latest/config/configuration-file.html} */ module.exports = (config) => { config.set({ basePath: '', frameworks: ['jasmine', '@angular-devkit/build-angular'], plugins: [ require('karma-jasmine'), // BUG: blocked by https://github.com/puppeteer/puppeteer/issues/5984 // require('karma-safari-launcher'), require('karma-chrome-launcher'), require('karma-jasmine-html-reporter'), require('karma-coverage'), require('@angular-devkit/build-angular/plugins/karma'), ], reporters: ['progress', 'kjhtml', 'coverage'], coverageReporter: { dir: path.join(__dirname, 'coverage'), subdir: '.', reporters: [ { type: 'text-summary' }, { type: 'html', subdir: 'html' }, { type: 'lcovonly' }, { type: 'json' }, ], }, client: { clearContext: false, // leave Jasmine Spec Runner output visible in browser }, port: 9876, colors: true, logLevel: config.LOG_INFO, autoWatch: true, browsers: ['Chromium'], browserDisconnectTolerance: 3, browserDisconnectTimeout: 10000, browserNoActivityTimeout: 60000, flags: ['--disable-translate', '--disable-extensions', '--mute-audio'], singleRun: false, restartOnFileChange: true, browserConsoleLogOptions: { terminal: false, }, customLaunchers: { ci: { base: 'ChromiumHeadless', flags: [ '--no-sandbox', '--disable-gpu', '--disable-translate', '--disable-extensions', '--mute-audio', ], }, }, }) } ```
Valdermeyder commented 3 years ago

I am just curious is it really karma-runner issue? Couldn't it be puppeteer issue? In my case, puppeteer solution works fine locally (MacOS) but I have the same problem with the Jenkins Alpine machine. I have switched to the installed version of chromium based on this Docker example on the Jenkins

philippe-granet commented 2 years ago

See https://github.com/karma-runner/karma-chrome-launcher/issues/154#issuecomment-986661937

For the ones that experience this issue with Angular.

The problem is that the Angular build (webpack) is running in parallel with launching the Chrome browser. In a simple Angular project that is no big deal as the build is fast, but in a big Angular project the build chokes the system and launching the browser takes longer than Karma's captureTimeout.

The workaround using --source-map=false is just putting less stress on the system. Similar to increasing the captureTimeout or trying your luck with Chrome options it will just fail at some point.

A better solution is to run webpack and launching the browser serially.

I created a Karma framework type plugin that does just that. It makes sure Karma waits for the webpack build to complete before launching browsers.

karma.conf.js

      plugins: [
      require('./karma.waitwebpack'),
      require('@angular-devkit/build-angular/plugins/karma'),
      ],
      frameworks: ['waitwebpack', 'jasmine', '@angular-devkit/build-angular'], // waitwebpack must be before build-angular

karma.waitwebpack.js

function WebpackCompilerEventsPlugin(options) {
  this.options = options;
}

WebpackCompilerEventsPlugin.prototype.apply = function(compiler) {
  compiler.hooks.afterDone.tap('webpack-compiler-events-plugin', this.options.afterDone)
};

function waitWebpackFactory(config) {
  return new Promise(resolve => {
    let isFirstBuild = true;
    config.buildWebpack.webpackConfig.plugins.push(new WebpackCompilerEventsPlugin({
      afterDone: () => {
        if (isFirstBuild) {
          console.log('First webpack build done');
          isFirstBuild = false;
          resolve();
        }
      }
    }));
  });
}
waitWebpackFactory.$inject = ['config'];

module.exports = {
  'framework:waitwebpack': ['factory', waitWebpackFactory]
};

With this plugin the output is always like:

✔ Browser application bundle generation complete.
First webpack build done
06 12 2021 11:50:07.581:INFO [karma-server]: Karma v6.3.2 server started at http://localhost:9876/[](http://localhost:9876/)
06 12 2021 11:50:07.587:INFO [launcher]: Launching browsers ChromeHeadless with concurrency unlimited
06 12 2021 11:50:07.595:INFO [launcher]: Starting browser ChromeHeadless
06 12 2021 11:50:08.348:INFO [Chrome Headless 96.0.4664.45 (Windows 10)]: Connected on socket nSjyH7dZhDllDpNPAAAB with id 79018619
mutongwu commented 9 months ago 
Running "karma:vue-1" (karma) task

19 01 2024 09:01:39.485:INFO [preprocessor.coverage]: coverage not included in reporters [ 'progress', 'junit' ]

19 01 2024 09:01:39.585:INFO [karma-server]: Karma v4.4.1 server started at http://0.0.0.0:8087/

19 01 2024 09:01:39.585:INFO [launcher]: Launching browsers ChromiumHeadlessInsecure with concurrency unlimited

19 01 2024 09:01:39.590:INFO [launcher]: Starting browser ChromiumHeadless

19 01 2024 09:02:39.592:WARN [launcher]: ChromiumHeadless have not captured in 60000 ms, killing.

19 01 2024 09:02:41.593:WARN [launcher]: ChromiumHeadless was not killed in 2000 ms, sending SIGKILL.

19 01 2024 09:02:43.593:WARN [launcher]: ChromiumHeadless was not killed by SIGKILL in 2000 ms, continuing.

Warning: Task "karma:vue-1" failed. Use --force to continue.

Aborted due to warnings.

karma.conf.js

process.env.CHROMIUM_BIN = require('puppeteer').executablePath()
...
...

    browsers: [
      // 'PhantomJS'
      'ChromiumHeadlessInsecure'
    ],

    customLaunchers: {
      // disable sandbox, doesn't work easily in docker
      ChromiumHeadlessInsecure: {
        base: 'ChromiumHeadless',
        flags: [
          '--no-sandbox',
          '--disable-web-security',
          '--disable-gpu',
          '--disable-dev-shm-usage'
        ]
      }
    },
    browserDisconnectTimeout: 10000,
    browserDisconnectTolerance: 3,
    browserNoActivityTimeout: 60000,

package.json

"karma": "~4.4.1",
"puppeteer": "^13.7.0",
"karma-chrome-launcher": "~3.1.0",