visiky / jest-electron

❯ ⚛️The easiest way to run and debug test cases in electron with jest.

jest-electron

Easiest way to run jest unit test cases in electron.

When we run unit test in Jest, it is actually running in the node environment, or virtual browser environment(e.g. JSDOM) mocked by NodeJS. Sometimes we need a lot of Jest mocks for running code with no throw, such as: jest-canvas-mock, jest-storage-mock, @jest/fake-timers and so on. This is solved by Jest-Electron.

1. Technological ecology of Jest.
2. Complete and real browser environment.
3. Multi-renderer for running performance.
4. Running and debug is better then mock.

Installation

• Add into devDependencies

$ npm i --save-dev jest-electron

• Update Jest config

{
  "jest": {
+    "runner": "jest-electron/runner",
+    "testEnvironment": "jest-electron/environment"
  }
}

Notice: update the runner configure, not testRunner.

Related

Those will be helpful when run test case with jest-electron.

• jest-less-loader: Run test cases with import less, css code.
• jest-url-loader: Run test cases with import svg, png, jpg or other url file..

CI

Run test cases with jest-electron for continuous integration.

• GitHub action

Running on macOS will be ok.

- runs-on: ubuntu-latest
+ runs-on: macOS-latest

• travis

Update .travis.yml with electron supported.

language: node_js
node_js:
  - "8"
  - "9"
  - "10"
  - "11"
  - "12"
+ addons:
+   apt:
+     packages:
+       - xvfb
+ install:
+   - export DISPLAY=':99.0'
+   - Xvfb :99 -screen 0 1024x768x24 > /dev/null 2>&1 &
+   - npm install
script:
  - npm run test

Env

• debug mode

Keep the electron browser window for debugging, set process env DEBUG_MODE=1.

DEBUG_MODE=1 jest

• no sandbox

Run electron with --no-sandbox, set process env JEST_ELECTRON_NO_SANDBOX=1.

JEST_ELECTRON_NO_SANDBOX=1 jest

License

MIT@hustcc.