Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

VSCode: How to debug current Jest test file

How to launch jest in debug mode on the current opened file, and only this one, regardless of the OS (windows, linux, mac).

The problem:

When using vscode under windows, it is impossible to jest the current (active) file, and only this one.

This debug config (from https://github.com/microsoft/vscode-recipes/tree/master/debugging-jest-tests):

{
      "type": "node",
      "request": "launch",
      "name": "Jest Current File",
      "program": "${workspaceFolder}/node_modules/.bin/jest",
      "args": [
        "${fileBasenameNoExtension}",
        "--config",
        "jest.config.js"
      ],
      "console": "integratedTerminal",
      "internalConsoleOptions": "neverOpen",
      "disableOptimisticBPs": true,
      "windows": {
        "program": "${workspaceFolder}/node_modules/jest/bin/jest",
      }
    }

Will not run only the active test if you have several tests with the same name (like index.test.js)

If I replace

    "args": [
        "${fileBasenameNoExtension}",
        ....
    ]

by

    "args": [
        "${file}",
        ...
    ]

It will not work at all as the first argument jest expects is a regex and ${file} returns the absolute path of the file, which, on a windows machine will contain \ backslashes which in turn will be interpreted as escaping the following chars in the pattern.

After reading carefully Jest's doc, it's impossible to specify a single file.

And VSCode is unable to convert a variable to a regexp.

The solution from this question, although almost similar, will not work either as it fails with files of the same name (case 1).

So either more tests than expected are run, or no test at all is run.

I've found a solution involving a separate script but any other solution would be appreciated.

like image 568
remix23 Avatar asked Sep 16 '19 00:09

remix23


People also ask

Can you debug jest tests?

There are multiple ways to debug Jest tests with Visual Studio Code's built-in debugger. More information on Node debugging can be found here.

What is the way to debug code in test suite?

The Standard Way Go to a Chromium-based browser and open chrome://inspect . Click “Open dedicated DevTools for Node” like in the screenshot below: Put a debugger statement somewhere in your code (testing or production one). Run node --inspect-brk node_modules/.


1 Answers

Taken from here: https://github.com/Lemoncode/jest-vs-code-debugging-example/blob/master/custom-solution-config-package-json/01-implemented/.vscode/launch.json

{
  "version": "0.2.0",
  "configurations": [
    {
      "type": "node",
      "request": "launch",
      "name": "Jest single run all tests",
      "program": "${workspaceRoot}/node_modules/jest-cli/bin/jest.js",
      "args": [
        "--verbose",
        "-i",
        "--no-cache"
      ],
      "console": "integratedTerminal",
      "internalConsoleOptions": "neverOpen"
    },
    {
      "type": "node",
      "request": "launch",
      "name": "Jest watch all tests",
      "program": "${workspaceRoot}/node_modules/jest-cli/bin/jest.js",
      "args": [
        "--verbose",
        "-i",
        "--no-cache",
        "--watchAll"
      ],
      "console": "integratedTerminal",
      "internalConsoleOptions": "neverOpen"
    },
    {
      "type": "node",
      "request": "launch",
      "name": "Jest watch current file",
      "program": "${workspaceFolder}/node_modules/jest-cli/bin/jest",
      "args": [
        "${fileBasename}",
        "--verbose",
        "-i",
        "--no-cache",
        "--watchAll"
      ],
      "console": "integratedTerminal",
      "internalConsoleOptions": "neverOpen"
    }
  ]
}
like image 115
Dmitry Shvedov Avatar answered Sep 27 '22 23:09

Dmitry Shvedov