Skip to content
This repository was archived by the owner on Jul 9, 2018. It is now read-only.

Jest preset: Add default jest preset for WordPress development #74

Merged
merged 2 commits into from
Feb 1, 2018
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
7 changes: 2 additions & 5 deletions package.json
Original file line number Diff line number Diff line change
Expand Up @@ -6,6 +6,7 @@
},
"devDependencies": {
"@wordpress/browserslist-config": "^2.0.0",
"@wordpress/jest-preset-default": "^1.0.0",
"babel-core": "^6.26.0",
"chalk": "^2.0.1",
"check-node-version": "^3.1.1",
Expand All @@ -19,11 +20,7 @@
"collectCoverageFrom": [
"packages/*/**/*.js"
],
"coveragePathIgnorePatterns": [
"<rootDir>/.*/build.*"
],
"coverageDirectory": "coverage",
"setupTestFrameworkScriptFile": "./packages/jest-console/build/index.js"
"preset": "./node_modules/@wordpress/jest-preset-default/jest-preset.json"
},
"scripts": {
"build-clean": "rimraf ./packages/*/build ./packages/*/build-module",
Expand Down
47 changes: 47 additions & 0 deletions packages/jest-preset-default/README.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,47 @@
# @wordpress/jest-preset-default

Default [Jest](https://facebook.github.io/jest/) preset for WordPress development.

## Installation

Install the module

```bash
npm install @wordpress/jest-preset-default --save-dev
```

## Setup

### Via jest.config.json or `jest` field in `package.json`

```json
{
"preset": "@wordpress/jest-preset-default"
}
```

### Usage

#### Brief explanations of options included

* `coverageDirectory` - the directory where Jest outputs its coverage files is set to `coverage`.
* `coveragePathIgnorePatterns` - coverage information will be skipped for all folders named `build` and `build-module`.
* `moduleNameMapper` - all `css` and `scss` files containing CSS styles will be stubbed out.
* `modulePaths` - the root dir of the project is used as a location to search when resolving modules.
* `setupFiles` - runs code before each test which sets up global variables required in the testing environment.
* `setupTestFrameworkScriptFile` - runs code which adds improved support for `Console` object and `React` components to the testing framework before each test.
* `testMatch`- includes `/test/` subfolder in the glob patterns Jest uses to detect test files. It detects only test files containing `.js` extension.
* `timers` - use of [fake timers](https://facebook.github.io/jest/docs/en/timer-mocks.html) for functions such as `setTimeout` is enabled.
* `transform` - adds support for [PEG.js]( https://github.com/pegjs/pegjs#javascript-api) transformed necessary for WordPress blocks. It also keeps the default [babel-jest](https://github.com/facebook/jest/tree/master/packages/babel-jest) transformer.
* `verbose` - each individual test won't be reported during the run.

#### Overriding `setupTestFrameworkScriptFile`

It is also possible to override the script that runs some code to configure or set up the testing framework before each test. To do so you will need to create `setup-test-framework.js` inside your project with the following content:

```js
// You can still load the default script provided by this setup
import '@wordpress/jest-preset-default';

// Your code goes here
```
1 change: 1 addition & 0 deletions packages/jest-preset-default/index.js
Original file line number Diff line number Diff line change
@@ -0,0 +1 @@
module.exports = require( './scripts/setup-test-framework' );
29 changes: 29 additions & 0 deletions packages/jest-preset-default/jest-preset.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,29 @@
{
"coverageDirectory": "coverage",
"coveragePathIgnorePatterns": [
"/node_modules/",
"<rootDir>/.*/build/",
"<rootDir>/.*/build-module/"
],
"moduleNameMapper": {
"\\.(scss|css)$": "<rootDir>/node_modules/@wordpress/jest-preset-default/scripts/style-mock.js"
},
"modulePaths": [
"<rootDir>"
],
"setupFiles": [
"<rootDir>/node_modules/@wordpress/jest-preset-default/scripts/setup-globals.js"
],
"setupTestFrameworkScriptFile": "<rootDir>/node_modules/@wordpress/jest-preset-default/scripts/setup-test-framework.js",
"testMatch": [
"**/__tests__/**/*.js",
"**/?(*.)(spec|test).js",
"**/test/*.js"
],
"timers": "fake",
"transform": {
"^.+\\.jsx?$": "babel-jest",
"\\.pegjs$": "<rootDir>/node_modules/@wordpress/jest-preset-default/scripts/pegjs-transform.js"
},
"verbose": true
}
Loading