DEV Community

loading...
Cover image for Speed up Karma and Jasmine tests with ChromeHeadless

Speed up Karma and Jasmine tests with ChromeHeadless

Dany Paredes
ex .NET guy, my last years building solutions with Vue, Angular, Sass, and Typescript.
・2 min read

I'm working with Jasmine and Karma, because it is the default tool set for testing in Angular. It works but one downsize is the browser by default for tests runner.

The browser is a bit slow for running and in the CI it impacts time of executing, we can speed up our tests using ChromeHeadless and puppeter with karma.

Install packages

First install karma-chrome-launcher and puppeteer.

npm i -D puppeteer karma-chrome-launcher
Enter fullscreen mode Exit fullscreen mode

Configure karma

Edit karma.conf.js and add the puppeter path and set the ChromeHeadless as default browser.

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

module.exports = function (config) {
  config.set({
    ....
    browsers: ['ChromeHeadless'],
    ...
  });
};

Enter fullscreen mode Exit fullscreen mode

Karma is ready to use ChromeHeadless from terminal.

dany@dany:~/Documents/danylab$ ng test
⠙ Generating browser application bundles (phase: building)...19 12 2020 22:48:06.285:WARN [karma]: No captured browser, open http://localhost:9876/
19 12 2020 22:48:06.289:INFO [karma-server]: Karma v5.1.1 server started at http://localhost:9876/
19 12 2020 22:48:06.289:INFO [launcher]: Launching browsers ChromeHeadless with concurrency unlimited
19 12 2020 22:48:06.294:INFO [launcher]: Starting browser ChromeHeadless
✔ Browser application bundle generation complete.
19 12 2020 22:48:09.314:WARN [karma]: No captured browser, open http://localhost:9876/
19 12 2020 22:48:09.406:INFO [Chrome Headless 88.0.4298.0 (Linux x86_64)]: Connected on socket ipYKV7Bm7wf_o-d0AAAA with id 12690576
Chrome Headless 88.0.4298.0 (Linux x86_64): Executed 9 of 9 SUCCESS (0.166 secs / 0.13 secs)
TOTAL: 9 SUCCESS
Enter fullscreen mode Exit fullscreen mode

That's it!

Hopefully, that will give you a bit of help with speed up your tests with Jasmine and Karma.

If you enjoyed this post, share it!

Discussion (1)

Collapse
ruslangonzalez profile image
Ruslán González

No conocía el ChromeHeadless... aunque suelo usar mucho el Chrome debugger ya que abre una instancia de Chrome sin nada de cache, extensiones ni nada!