vscode-jest-runner

Looking for collaborators to help me maintain the project. Please contact me at tristanteufel@gmail.com

Visual Studio Code Marketplace

VisualStudio Marketplace Open VSX Registry

Comparison with vscode-jest

vscode-jest-runner is focused on running or debugging a specific test or test-suite, while vscode-jest is running your current test-suite everytime you change it.

Features

Simple way to run or debug a specific test As it is possible in IntelliJ / Webstorm

Run & Debug your Jest Tests from

Context-Menu
CodeLens
Command Palette (strg+shift+p)

Supports

yarn & vscode workspaces (monorepo)
dynamic jest config resolution
yarn 2 pnp
CRA & and similar abstractions

Extension Example

Usage with CRA or similar abstractions

add the following command to settings:

"jestrunner.jestCommand": "npm run test --",
"jestrunner.debugOptions": {
    "runtimeExecutable": "${workspaceRoot}/node_modules/.bin/react-scripts",
    "runtimeArgs": [
      "test",
      "${fileBasename}",
      "--runInBand",
      "--no-cache",
      "--watchAll=false",
      "--color"
    ]
},

Usage with nvm

add the following command to settings to help jestrunner find your node:

"jestrunner.jestCommand": "nvm use && npm run test --",
"jestrunner.debugOptions": {
    runtimeExecutable": "/PATH/TO/YOUR/node"
},

Extension Settings

Jest Runner will work out of the box, with a valid Jest config. If you have a custom setup use the following options to customize Jest Runner:

Command	Description
jestrunner.configPath	Jest config path (string) (relative to `${workspaceFolder}` e.g. jest-config.json). Defaults to blank. Can also be a glob path mapping. See below for more details
jestrunner.useNearestConfig	If jestrunner.configPath is set and this is `true`, the nearest matching jest config up the path hierarchy will be used instead of the relative path.
jestrunner.jestPath	Absolute path to jest bin file (e.g. /usr/lib/node_modules/jest/bin/jest.js)
jestrunner.debugOptions	Add or overwrite vscode debug configurations (only in debug mode) (e.g. `"jestrunner.debugOptions": { "args": ["--no-cache"] }`) See vscode docs
jestrunner.runOptions	Add CLI Options to the Jest Command (e.g. `"jestrunner.runOptions": ["--coverage", "--colors"]`) https://jestjs.io/docs/en/cli
jestrunner.jestCommand	Define an alternative Jest command (e.g. for Create React App and similar abstractions)
jestrunner.disableCodeLens	Disable CodeLens feature
jestrunner.codeLensSelector	CodeLens will be shown on files matching this pattern (default */.{test,spec}.{js,jsx,ts,tsx})
jestrunner.codeLens	Choose which CodeLens to enable, default to `["run", "debug"]`
jestrunner.enableYarnPnpSupport	Enable if you are using Yarn 2 with Plug'n'Play
jestrunner.yarnPnpCommand	Command for debugging with Plug'n'Play defaults to yarn-.js
jestrunner.projectPath	Absolute path to project directory (e.g. /home/me/project/sub-folder), or relative path from workspace root (e.g. ./sub-folder)
jestrunner.checkRelativePathForJest	When `false`, when looking for the nearest resolution for Jest, only check for package.json files, rather than the `node_modules` folder. Default: `true`
jestrunner.changeDirectoryToWorkspaceRoot	Changes directory before execution. The order is: `jestrunner.projectPath` the nearest `package.json` `${workspaceFolder}`
jestrunner.preserveEditorFocus	Preserve focus on your editor instead of focusing the terminal on test run
jestrunner.runInExternalNativeTerminal	run in external terminal (requires: npm install ttab -g)

configPath as glob map

If you've got multiple jest configs for running tests (ie maybe a config for unit tests, integration tests and frontend tests) then this option is for you. You can provide a map of glob matchers to specify which jest config to use based on the name of the file the test is being run for.

For instance, supose you're using the naming convention of *.spec.ts for unit tests and *.it.spec.ts for integration tests. You'd use the following for your configPath setting:

{
  "jestrunner.configPath": {
    "**/*.it.spec.ts": "./jest.it.config.js",
    "**/*.spec.ts": "./jest.unit.config.js"
  }
}

Note the order we've specified the globs in this example. Because our naming convention has a little overlap, we need to specify the more narrow glob first because jestrunner will return the config path of the first matching glob. With the above order, we make certain that jest.it.config.js will be used for any file ending with .it.spec.ts and jest.unit.config.js will be used for files that only end in *.spec.ts (without .it.). If we had reversed the order, jest.unit.config.js would be used for both *.it.spec.ts and *.spec.ts endings the glob matches both.

By default, the config path is relative to {jestrunner.projectPath} if configured, otherwise the workspace root.

To find the nearest config matching the result from the jestrunner.configPath map, set "jestrunner.useNearestConfig": true. When true, vscode-jest-runner will search up the through directories from the target until it finds the matching file. For instance, running tests in ~/dev/my-repo/packages/project1/__test__/integration/ship-it.it.spec.ts will use ~/dev/my-repo/packages/project1/jest.it.config.js rather than the config in the monorepo's root.

Shortcuts

Command Pallette -> Preferences: Open Keyboard Shortcuts (JSON) the json config file will open add this:

{
  "key": "alt+1",
  "command": "extension.runJest"
},
{
  "key": "alt+2",
  "command": "extension.debugJest"
},
{
  "key": "alt+3",
  "command": "extension.watchJest"
},
{
  "key": "alt+4",
  "command": "extension.runPrevJest"
}

Want to start contributing features?

Check some open topics get you started

Steps to run Extension in development mode

Clone Repo
npm install
Go to Menu "Run" => "Start Debugging"

Another vscode instance will open with the just compiled extension installed.

Jest Runner

firsttris