Create a Chrome App Shortcut to Start Chrome with Remote Debugging Enabled
npm install create-chrome-debugger!icon
--remote-debugging-port=9222). This tool simplifies this process by creating a readily clickable Chrome Debugger app that launches Chrome with the needed command-line flag.You can find more details about remote debugging in this post on the Chromium blog.
https://github.com/zirkelc/chrome-debugger-node/assets/950244/0a8a4366-005b-4ea5-b4ad-2aeb4e6aec5a
npx:``sh`
npx create-chrome-debugger
Or, install it globally using npm and then execute:
`sh`
npm install -g create-chrome-debugger
create-chrome-debugger
Upon successful installation, a new Chrome Debugger app shortcut will appear in your Application Library. You can relocate it as per your convenience, such as to your Dock.
Click the Chrome Debugger app to launch a new Chrome instance with remote debugging enabled. Upon first launch, Chrome might prompt to set it as the default browser - this step can be disregarded.
To confirm that remote debugging is enabled, navigate to chrome://version in Chrome. It should display like this:
The Chrome instance launched by Chrome Debugger functions in its own user data directory, ensuring isolated history, bookmarks, cookies, etc. It will not interfere with your regular Chrome instance. The user data directory is found at /Users/.
`sh`print the location of the user data directory
echo "$HOME/Library/Application Support/Google/Chrome Debugger"
`json`
{
"version": "0.2.0",
"configurations": [
{
"name": "Attach to Chrome",
"port": 9222,
"request": "attach",
"type": "chrome",
"urlFilter": "http://localhost:3000/*",
"webRoot": "${workspaceFolder}"
}
]
}
For more insights, refer to this guide or the official VSCode documentation.
to "type": "chrome"
- Added --user-data-dir` command line flag as recommended by Chromium