From 0349c6ba161dda5ff9b2380659956040f88fbe1c Mon Sep 17 00:00:00 2001
From: Ariella Vu <20778143+digiwand@users.noreply.github.com>
Date: Mon, 6 Feb 2023 20:03:22 +0700
Subject: [PATCH] [doc] add Jest debugging guide (docs/tests/jest.md) (#17594)

* docs: add tests/jest.md debugging guide

* docs:jest.md: add basic test command

* README.md: add docs/tests/jest.md link
---
 README.md          |  2 ++
 docs/tests/jest.md | 66 ++++++++++++++++++++++++++++++++++++++++++++++
 2 files changed, 68 insertions(+)
 create mode 100644 docs/tests/jest.md

diff --git a/README.md b/README.md
index c39979df7..7d373f1f6 100644
--- a/README.md
+++ b/README.md
@@ -59,6 +59,8 @@ Run unit tests and the linter with `yarn test`. To run just unit tests, run `yar
 
 You can run the linter by itself with `yarn lint`, and you can automatically fix some lint problems with `yarn lint:fix`. You can also run these two commands just on your local changes to save time with `yarn lint:changed` and `yarn lint:changed:fix` respectively.
 
+For Jest debugging guide using Node.js, see [docs/tests/jest.md](docs/tests/jest.md).
+
 ### Running E2E Tests
 
 Our e2e test suite can be run on either Firefox or Chrome.
diff --git a/docs/tests/jest.md b/docs/tests/jest.md
new file mode 100644
index 000000000..c4dc613aa
--- /dev/null
+++ b/docs/tests/jest.md
@@ -0,0 +1,66 @@
+# Getting Started
+
+## Running a Jest test
+
+```bash
+> yarn jest <path>
+```
+
+## Debugging
+
+### Debugging Jest in VS Code
+
+1. Open **VS Code**
+2. Open the “Run and Debug” panel (⇧⌘D)
+3. Click the “JavaScript Debug Terminal” button to open the Terminal
+4. Run Jest using Node
+
+    ```bash
+    > yarn jest --watch <path>
+    ```
+
+Additional methods and information to debug in VS Code can be found [here](https://jestjs.io/docs/troubleshooting#debugging-in-vs-code)
+
+### Debugging Jest on Chrome DevTools
+
+1. Run Jest using Node with the V8 Inspector
+
+    ```bash
+    > node --inspect ./node_modules/.bin/jest --watch -i <path>
+
+    or
+
+    > node --inspect ./node_modules/.bin/jest <path>
+    ```
+
+    **Options:**
+
+    ```jsx
+    node:
+
+    			--inspect=[host:]port
+                 Activate inspector on host:port.  Default is 127.0.0.1:9229.
+
+                 V8 Inspector integration allows attaching Chrome DevTools and IDEs
+    						 to Node.js instances for debugging and profiling.  It uses the
+    						 Chrome DevTools Protocol.
+
+    jest:
+
+    			--watch                       Watch files for changes and rerun tests
+                                        related to changed files. If you want to
+                                        re-run all tests when a file has changed,
+                                        use the `--watchAll` option.       [boolean]
+
+    	-i, --runInBand                   Run all tests serially in the current
+                                        process (rather than creating a worker pool
+                                        of child processes that run tests). This is
+                                        sometimes useful for debugging, but such use
+                                        cases are pretty rare.             [boolean]
+    ```
+
+
+1. Open Chrome DevTools for Node
+    1. Open a **Chromium** browser
+    2. Go to [chrome://inspect/#devices](chrome://inspect/#devices)
+    3. Click “Open dedicated DevTools for Node” link