-
-
Notifications
You must be signed in to change notification settings - Fork 26.9k
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Docs: How to Debug Unit Tests #2992
Conversation
Thank you for your pull request and welcome to our community. We require contributors to sign our Contributor License Agreement, and we don't seem to have you on file. In order for us to review and merge your code, please sign up at https://code.facebook.com/cla. If you are contributing on behalf of someone else (eg your employer), the individual CLA may not be sufficient and your employer may need the corporate CLA signed. If you have received this in error or have any questions, please contact us at [email protected]. Thanks! |
Thank you for signing our Contributor License Agreement. We can now accept your code for this (and any) Facebook open source project. Thanks! |
|
||
To attach the `node-inspector` debugger, run: | ||
``` | ||
node-inspector |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
I'm a bit out of touch but I had an impression that node-inspector
is no longer necessary, and Node integration just works out of the box with Chrome. Is that wrong?
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Nice! I had no idea, just gave it a shot and you are correct.
Updating this!
"name": "Debug CRA Tests", | ||
"type": "node", | ||
"request": "launch", | ||
"runtimeExecutable": "${workspaceRoot/node_modules/.bin/react-scripts", |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Missing }
after workspaceRoot
.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Thanks!
Updated to reflect review comments. Just tested again in Chrome and VS Code and both are working well. Node: |
|
||
Windows | ||
```bash | ||
node node_modules/bin/react-scripts --inspect-brk test --runInBand --testPathIgnorePatterns=ui-tests/* --env=jsdom |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
What is ui-tests/*
? Seems like that shouldn't be here.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Whoops, good catch. Fixed.
Windows | ||
```bash | ||
node node_modules/bin/react-scripts --inspect-brk test --runInBand --testPathIgnorePatterns=ui-tests/* --env=jsdom | ||
``` |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
On a general note: instead of a Terminal command, can we suggest adding
"test:debug": "react-scripts --inspect-brk test --runInBand --env=jsdom"
to scripts
in package.json
and then ask you to run npm run test:debug
?
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Yeah, that is much cleaner. Updated!
@MattMorgis First of all thank you for the write up. Unfortunately the set up doesn't work for me. I am able to open inspector and browse files after running Update: The not stopping on breakpoint seems to be some node issue. Switching to node v8 (v as in version) fixed it. Now the the question is what about sourceMaps? Is there a way to link source maps? |
This is great! Sorry for letting it slip through the cracks. |
* docs: adding section about debugging tests * docs: removing node-inspector references * docs: replacing terminal command with npm script * Update README.md
* docs: adding section about debugging tests * docs: removing node-inspector references * docs: replacing terminal command with npm script * Update README.md
* docs: adding section about debugging tests * docs: removing node-inspector references * docs: replacing terminal command with npm script * Update README.md
This updates the docs to include a “Debugging Tests” section.
I included how to use debug Jest tests with Chrome/Node Inspector and the new
—inspect
flag.I also included the configuration file for debugging tests directly in VS Code.
I think this mostly closes #594. I know @prigara wanted to additionally add a section about debugging Webstorm too, which would really finish this off!