microsoft / microsoft/vscode-edge-devtools
breakpoints in client side javascript not hit in express project
Nobody has claimed this yet.
- Dominant language
- TypeScript
- Stars
- 827
- Forks
- 358
- Avg merge
- 20h 32m
- Merged PRs (30d)
- 10
Description
Environment (please complete the following information):
- OS (e.g., Windows 10):macOS 12.1
- Extension version (e.g., 1.2.3): v1.4.5
Describe the bug:
I set a break point in a self invoking anonymous function and it was not hit.
Repro steps:
- use
npx express-generator --no-viewto create an express static site - cd into the new project directory
- execute
npm install - launch the express server
DEBUG=bug-express:* npm start - Generate a launch.json file with the standard launch edge and open dev tools configuration.
- update configuration url entry to
http://localhost:3000/ - While in the launch.json file add an edge launch configuration and update the url for that too.
- Add a script block to the projects default index.html file:
<script>
(function () {
console.log("not going to work")
})()
</script>
- set a break point on the console.log line
- Using your
Launch Edgeconfiguration launch edge - notice that Edge launches, and the page is displayed. Notice that the console log message appears in the console.
Expected behavior:
I expected my break point would be hit.
Additional context:
If you use npx reload -d public -p 3000 to serve the index page, the break point is also not hit.
Also, if you copy the html and launch.json file to a newly initialized node project npm init -y it also does work.
I was sure I'd seen this actually work before, so I deleted the node package.json file, but that did not help.
Finally, I have noticed that if you launch edge, then bring up the dev tools from the browser and set the break point using those tools (i.e. go into sources, find index.html, set a breakpoint) then the break point is hit and the file is opened in vs code. Oddly the file opened contains only the contents of the script tag, and the rest of the file is empty.

Contributor guide
First steps
- Read the whole issue, then the project's contributing guide.
- Comment on the issue to say you are picking it up — it saves two people doing the same work.
- Fork the repository and make your change on a branch.
- Open a pull request that references the issue number.
Research direction
Reproduce the issue with the generated Express project, npm install, the launch.json Edge configurations, and the inline script in index.html. Compare breakpoints set in VS Code with those set in Edge DevTools, then verify that the launch configuration maps the complete index.html source and that the console.log breakpoint is hit.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- express, javascript, node.js, typescript, vscode
- Domain
- developer-experience, devtools
- Issue type
- Bug
- Difficulty
- 4/5
- Estimated time
- 3-5 days
- Activity status
- Stale
- Clarity
- Mostly clear
- Newbie friendliness
- 35/100