Can't debug with firebase tools 6.10.0 in vs code due to unverified breakpoints

[ke-nzo]

[REQUIRED] Environment info

firebase-tools: 6.10.0

Platform:macOs, Windows

[REQUIRED] Test case

launching attach to debug from launch.json, breakpoint will result all unverified with no possibility to stop in

[REQUIRED] Steps to reproduce

"version": "0.2.0",
  "configurations": [
    {
      "type": "node",
      "request": "attach",
      "name": "Attach by Process ID",
      "processId": "${command:PickProcess}"
    }
  ]
}

simply run Attach by Process ID, and breakpoints will result in grey unverified.

[REQUIRED] Expected behavior

breakpoint must to remain red for stop in and debug

[REQUIRED] Actual behavior

breakpoint remain grey after debug launched

i'd like to add that i have tested debug with firebase-tools 6.3.0 and attach to process perfectly work. with 6.10.0 doesn't.

[google-oss-bot]

This issue does not have all the information required by the template. Looks like you forgot to fill out some sections. Please update the issue with more information.

[thechenky]

@vincy261 this seems like an issue with VSCode and not firebase tools. I would try asking on channels like StackOverflow to get the support you need.

[ke-nzo]

HI @thechenky , i have tested debug with firebase-tools 6.3.0 and attach to process perfectly work. with 6.10.0 doesn't. Same VS code

[samtstern]

Thanks @vincy261. I think @abeisgoat knows more about this. The new emulator (in versions 6.9.0 and above) runs the functions in a separate process which probably needs to expose some more information to be debuggable.

[abeisgoat]

Hey @vincy261, can you provide a detailed step-by-step example of how to reproduce this? I have no familiarity with VS Code or how the debugging works, so I'll need something like...

1. Make a new folder
2. Put XXX in index.js
3. Put a breakpoint by doing X
4. Run the code by doing this...
5. Etc, etc

I have no idea what's expected so I can't really help until I have that info. As Sam said, we did switch how we run functions, so it's expected that this could break.

[ke-nzo]

Hi @abeisgoat , sure i can, so:

1. Create a new firebase project with typescript
2. Write a simple index.ts and export your cloud function testFunction and set it in the firebase.json

import * as express from 'express';
import * as functions from 'firebase-functions';

const app = express();

app.head('/', (req, res) => res.sendStatus(204))

app.get('/timestamp', (req, res) => {
  res.send(`${Date.now()}`);
})

export const testFunction = functions.https.onRequest(app);

console.log('started')

3. add this to the launch.json (launch json is the debug settings file for VS code integrated debug tool usually the third icon on the side bar menu)

"version": "0.2.0",
  "configurations": [
    {
      "type": "node",
      "request": "attach",
      "name": "Attach by Process ID",
      "processId": "${command:PickProcess}"
    }
  ]
}     

4. run tsc (typescript compiler) and the local emulator

tsc
firebase serve --only functions

4. now press F1 it will open the command menu and type: debug: Attach by Process ID
   usually is the first process. Now your bottom bar from blue should turn orange

5. at this point you will notice that if you put a breakpoint on:

res.send(`${Date.now()}`);

the breakpoint doesn't turn red but grey and it will say "unverified breakpoint" thus calling timestamp endpoint in the browser it won't stop on the line.

instead repeat the test with firebase-tools@6.3.0 (or at least prior to 6.9.0) and it will work!

[abeisgoat]

Fantastic, thanks for the thorough and quick response, I'll take a look at this when I get some time and report back!