vscode-js-debug icon indicating copy to clipboard operation
vscode-js-debug copied to clipboard

Erratic debugging/breakpoint behavior with turbopack

Open bernatfortet opened this issue 8 months ago • 0 comments

Link to the code that reproduces this issue https://github.com/bernatfortet/reproduction-app

Describe the bug VS Code debugging behaves inconsitently and triggers breakpoints on the wrong parts of the codease

To Reproduce Steps to reproduce the behavior:

  1. create a new next.js repo, with all the default settings. Make sure you're using turborepo (`"dev": "next dev --turbopack")
  2. Create a .vscode/launch.json file and add what the Guides: Debugging page mentions to use for debugging with next.js
  3. In src/app/page.tsx add a console log right below the Home function:
export default function Home() {
  console.log(`test`)
  ...
  1. Add a breakpoint to the console log
  2. Refresh

Behavior 1:

  • Breakpoint works well, I click continue and it's fine.
  • But if I change the text in the console it trigger behavior 2

Behavior 2:

  • After reloading
  • Breakpoint works well
  • But when I "Continue" executing the code Image
  • I'm sent to some cryptic part of the code Image

Behavior 3: Image

  • After the breakpoint has been set, refreshing the page doesn't trigger anything.
  • (is this because of caching?

Additional context

  • Something tells me it's something related to this: https://github.com/microsoft/vscode-js-debug/pull/2223/files
  • Or this: https://github.com/vercel/next.js/pull/76559/files#diff-bd5430ee7c51dc892a67b3f2829d1f5b6d223f0fd48b82322cfd45baf9f5e945
  • other context here: https://github.com/vercel/next.js/issues/73214#issuecomment-2883178209
  • this happens on canary as well ^15.4.0-canary.43

Log File

runtime.launch Bootloader imported { env: { inspectorIpc: '/var/folders/zp/nx4wzk257jvb767h12bt4tk80000gn/T/node-cdp.55130-15376e02-14.sock', deferredMode: false, waitForDebugger: '', execPath: '/opt/homebrew/bin/node', onlyEntrypoint: false, verbose: true, autoAttachMode: 'always', fileCallback: '/var/folders/zp/nx4wzk257jvb767h12bt4tk80000gn/T/node-debug-callback-835dd2d65d017d8f' }, args: [ '/opt/homebrew/Cellar/node/23.3.0/bin/node', '/opt/homebrew/bin/npm', 'run', 'dev' ] } runtime Set debug mode { mode: 0 } Debugger attached.

[email protected] dev next dev --turbopack

runtime.launch Bootloader imported { env: { inspectorIpc: '/var/folders/zp/nx4wzk257jvb767h12bt4tk80000gn/T/node-cdp.55130-15376e02-14.sock', deferredMode: false, waitForDebugger: '', execPath: '/opt/homebrew/bin/node', onlyEntrypoint: false, verbose: true, autoAttachMode: 'always', openerId: 'b9689062598f7cec1a774338' }, args: [ '/opt/homebrew/Cellar/node/23.3.0/bin/node', '/Users/bernat/Desktop/my-app/node_modules/.bin/next', 'dev', '--turbopack' ] } runtime Set debug mode { mode: 0 } Debugger attached. runtime.launch Bootloader imported { env: { inspectorIpc: '/var/folders/zp/nx4wzk257jvb767h12bt4tk80000gn/T/node-cdp.55130-15376e02-14.sock', deferredMode: false, waitForDebugger: '', execPath: '/opt/homebrew/bin/node', onlyEntrypoint: false, verbose: true, autoAttachMode: 'always', openerId: 'c7ecd2f4d7847e040b3fe8e3' }, args: [ '/opt/homebrew/Cellar/node/23.3.0/bin/node', '/Users/bernat/Desktop/my-app/node_modules/next/dist/server/lib/start-server.js' ] } runtime Set debug mode { mode: 0 } Debugger attached. ▲ Next.js 15.3.2 (Turbopack)

  • Local: http://localhost:3000
  • Network: http://192.168.4.42:3000

✓ Starting... ✓ Ready in 963ms

VS Code Version: Replace me! Cursor Version: 0.50.5 VSCode Version: 1.96.2

bernatfortet avatar May 20 '25 19:05 bernatfortet