Create-react-app: Debug CRA Tests stopped working on VSCode v1.19

[amadeogallardo]

Is this a bug report?

Yes

Can you also reproduce the problem with npm 4.x?

Yes

Which terms did you search for in User Guide?

Debug CRA Tests in VS Code
https://github.com/facebookincubator/create-react-app/blob/master/packages/react-scripts/template/README.md#debugging-tests-in-visual-studio-code

Environment

1. node -v: v8.9.1
2. npm -v: 4.1.2
3. yarn --version (if you use Yarn): No yarn
4. npm ls react-scripts (if you haven’t ejected): -- (empty)

Then, specify:

1. Operating system: Windows 10
2. Browser and version (if relevant): not relevant

Steps to Reproduce

1. Open VS Code 1.19
2. Setup a launch configuration as described here: https://github.com/facebookincubator/create-react-app/blob/master/packages/react-scripts/template/README.md#debugging-tests-in-visual-studio-code
3. Fire the debugger with F5 or play on the debugging panel
4. The debugger doesn't start the test scripts and eventually fires a timeout
5. Rollback to VSCode version 1.18
6. Follow steps 1-2
7. The debugger starts the test scripts and properly attaches to the debugger

Expected Behavior

Debug CRA Test launch configuration works on VSCode 1.19 (similar to VSCode 1.18).

No changes between VSCode versions, or an updated version of the documentation to setup the launch configuration.

Actual Behavior

• The launch configuration doesn't start the test scripts
• The debugger doesn't attach to the test process
• Timeout error is thrown on VS Code

References

The changelog for VSCode 1.19 mentions new additions on the debugging experience: https://github.com/facebookincubator/create-react-app/blob/master/packages/react-scripts/template/README.md#debugging-tests-in-visual-studio-code

Issue created on VSCode: https://github.com/Microsoft/vscode/issues/40293

[amadeogallardo]

The VSCode team provided the correct configuration for launch.json. Apparently, the configuration documented on Create React App was working accidentaly due to a VS Code bug that was addressed on the latest version 1.19.

Here's the verified working code since VSCode 1.19, in case someone runs onto this. Let me know if you would like me to update the documentation (or if someone on the CRA team can do that).

{
    "name": "Debug CRA Tests",
    "type": "node",
    "request": "launch",
    "runtimeExecutable": "${workspaceRoot}/node_modules/.bin/react-scripts",
    "args": [
        "test",
        "--runInBand",
        "--no-cache",
        "--env=jsdom"
    ],
    "cwd": "${workspaceRoot}",
    "protocol": "inspector",
    "console": "integratedTerminal",
    "internalConsoleOptions": "neverOpen"
}

[Timer]

Please send a pull request fixing our documentation! 😄

[pedro-mass]

Does this still work? Noticed the update in the ReadMe today, was excited to try it out: only to have the debugger not stop at the breakpoints 😢

[amadeogallardo]

Does your environment match what's shown on the Issue description above?
If not: can you please post the environment settings that differ? E.g. VS Code version, node, etc.

[pedro-mass]

Turned out I needed Node@v8+
Older project, so I had to bump my .nvmrc file