angular-puppeteer-demo icon indicating copy to clipboard operation
angular-puppeteer-demo copied to clipboard

A demonstration repository explains how to using Puppeteer in unit testing

Angular Puppeteer Demo CircleCI

:sunglasses: A demonstration repository explains how to replace from Karma to Puppeteer.

Running unit tests

Run npm test to execute the unit tests via ~~Karma~~ Puppeteer. And captures screenshot viewport after each spec. The captured images are here(by reg-suit).

How to replace test runner

In summary, I did:

  1. Create a webpack-dev-middleware instance using angualr-cli's karma plugin.
  2. Boot an Express server using thi middleware
  • This app serves a custom context HTML file(test/context.html) while referring https://github.com/jasmine/jasmine#installation.
  1. Expose Puppeteer's screenshot function and use it via afterEach.
  2. Let the Puppeteer's page object go to the html file served by the Express app.

If you want more details, please see puppeteer-test.js.