@rws-air/jestscreenshot
Version:
Jest reporter plugin to take Puppeteer screenshots on failing tests
130 lines (91 loc) • 7.56 kB
Markdown
<div align="center">
<p>
<a href="https://github.com/RWS-NL/air-node-packages"><img src="https://raw.githubusercontent.com/RWS-NL/air-node-packages/master/packages/webcomponents/src/Logo/logo.svg?sanitize=true" height="200" alt="logo"/></a>
</p>
<p>
<h1> Rijkswaterstaat jestscreenshot </h1>
<h3> Creates screenshots with Puppeteer when a Jest test fails and optionally upload it to Slack </h3>
</p>
</div>
---
**Project Status**
[](https://github.com/RWS-NL/air-node-packages/blob/master/LICENSE.md)
**Bundle Sizes**
[](https://bundlephobia.com/result?p=@rws-air/jestscreenshot)
[](https://bundlephobia.com/result?p=@rws-air/jestscreenshot)
**Versions**
[](https://www.npmjs.com/package/@rws-air/jestscreenshot)
**Our Badges**
[](https://www.rijkswaterstaat.nl)
[](https://www.slack.com)
[](https://trello.com/)
[](https://www.pivotaltracker.com/n/projects/1915901)
[](https://www.sketchapp.com)
[](https://app.zeplin.io/project/587661de593c722607342d7b)
---
## Installation
Install with [yarn](https://yarnpkg.com) or [npm](https://www.npmjs.com/):
```sh
yarn add -D @rws-air/jestscreenshot @types/jest-environment-puppeteer jest-circus jest-environment-puppeteer
```
## Usage
```js
const JestScreenshot = require('@rws-air/jestscreenshot');
```
## About automated Slack uploading
This library supports uploading your screenshots to Slack by providing the `SLACK_WEBTOKEN` environment variable, or, through the `slackToken` option. You will also nede to provide the Slack Channel ID(s) through the option `slackChannels` and setting `slackUpload` option to `true`.
## Example
**_Please note that you cannot use ES module imports in the `jest-enviroment.ts` file. Jest does not support them._**
```js
// jest.config.js
module.exports = {
testRunner: 'jest-circus/runner',
testEnvironment: '<rootDir>/__tests__/jest-environment.js',
testMatch: ['<rootDir>/__tests__/index.test.ts'],
globalSetup: 'jest-environment-puppeteer/setup',
globalTeardown: 'jest-environment-puppeteer/teardown',
setupFilesAfterEnv: ['expect-puppeteer', '<rootDir>/__tests__/jest-framework.ts']
};
```
```ts
// jest-framework.ts
jest.retryTimes(2);
```
```ts
// jest-environment.ts
/* eslint-disable @typescript-eslint/no-var-requires, @typescript-eslint/no-require-imports, @typescript-eslint/explicit-member-accessibility */
const PuppeteerEnvironment = require('jest-environment-puppeteer');
const JestScreenshot = require('@rws-air/jestscreenshot');
require('jest-circus');
const retryAttempts = process.env.RETRY_ATTEMPTS || 2;
// @ts-ignore
class CustomEnvironment extends PuppeteerEnvironment {
async setup() {
await super.setup();
if (!process.env.CI) await this.localSetup();
}
async teardown() {
// @ts-ignore
await this.global.page.waitFor(2000);
await super.teardown();
}
async handleTestEvent(event, state) {
if (event.name === 'test_fn_failure') {
if (state.currentlyRunningTest.invocations > retryAttempts) {
const testName = state.currentlyRunningTest.name;
const jestScreenshot = new JestScreenshot({
page: this.global.page,
dirName: __dirname,
testName,
slackChannels: ['ChannelID'],
slackUpload: true
});
await jestScreenshot.setup();
}
}
}
}
module.exports = CustomEnvironment;
```
## API Documentation
Check out [the docs on github pages](https://rws-nl.github.io/air-node-packages/modules/_rws_air_jestscreenshot.html)