CODEWITHSUNDEEP
debuggingfirebasevisual-studio-codegoogle-cloud-functions
Alin C
Alin C

Reputation: 689

Functions debugging in VS Code

From VS Code integrated terminal I run firebase serve --only functions,hosting then in the debug tab I created the default launch.json:

{
  "version": "0.2.0",
  "configurations": [
    {
      "type": "node",
      "request": "launch",
      "name": "Launch Program",
      "program": "${file}"
    }
  ]
}

I want to debug the server side (functions/index.js) not the client side.

I've tried some configuration from https://code.visualstudio.com/docs/nodejs/nodejs-debugging with no luck.

How to debug Firebase functions in VS Code?

Upvotes: 42

Views: 16339

Answers (6)

GorvGoyl
GorvGoyl

Reputation: 49270

Update: May 2021

It's now possible to debug (put breakpoints) firebase functions running locally on VSCode.

  1. update firebase-tools to atleast v7.11.0 npm i -g firebase-tools
  2. add below to launch.json:
    {
      "version": "0.2.0",
      "configurations": [
        {
          "type": "node",
          "request": "attach",
          "name": "Attach",
          "port": 9229,
          "restart": true,
          "skipFiles": ["<node_internals>/**"]
        }
      ]
    }
  1. run the emulator: firebase emulators:start --inspect-functions
  2. run the vscode debugger with attach option.
  3. put breakpoint in a cloud function.
  4. call that function (something like http://localhost:5001/your_project/us-central1/helloWorld). Breakpoint should hit.

note: Support for PubSub/scheduled functions is still not implemented. Upvote this issue: https://github.com/firebase/firebase-tools/issues/2034

note: if you're testing functions from local firebase hosting setup, then you need to point your hosting functions to local server instead of cloud server. see here https://stackoverflow.com/a/59381328/3073272

Old Answer on debugging(no breakpoint) firebase functions using terminal:

There's a firebase documentation for Testing functions interactively using shell. You can also test https callable functions. Though steps for attaching a debugger is not mentioned there.

  1. Open the Service Accounts pane of the Google Cloud Console.

  2. Make sure that App Engine default service account is selected, and use the options menu at right to select Create key.

  3. When prompted, select JSON for the key type, and click Create.

  4. Set your Google default credentials to point to the downloaded key

    $ set GOOGLE_APPLICATION_CREDENTIALS=path\to\key.json

    $ firebase functions:shell

The Cloud Functions shell emulates all types of function triggers with an interactive shell for invoking the functions with test data. Options vary by function type, but the basic usage format is:

myFunctionName(data, options)

Upvotes: 57

J.D
J.D

Reputation: 31

Here's my solution:

I have an http Google Cloud Function in {root}/src/koios/index.js

{root}/src/koios/package.json

"scripts": {
    "start": "env URL=xxx.xxx.com node --inspect-brk=9229 node_modules/@google-cloud/functions-framework --target=queryElasticsearch --port=8888"
  }

{root}/.vscode/launch.json

{
            "type": "node",
            "request": "launch",
            "name": "Launch koios via npm",
            "cwd": "${workspaceFolder}/src/koios",
            "runtimeExecutable": "npm",
            "runtimeArgs": ["run-script", "start"],
            "port": 9229
        }

Start debugging in vscode, and trigger it by posting from postman and you can hit the breakpoints in your Cloud Function code in vscode.

Enjoy coding!

Upvotes: 0

Omer.rah
Omer.rah

Reputation: 1

Found it.

  1. Add to launch.json:
{
    "version": "0.2.0",
    "configurations": [
        {
            "type": "node",
            "request": "attach",
            "name": "Attach Firebase",
            "port": 9229
        }
    ]
}
  1. Run:
$ firebase emulators:start --inspect-functions

Upvotes: 2

Yusuf &#199;ağrı Oğuz
Yusuf &#199;ağrı Oğuz

Reputation: 41

  • npm install -g @google-cloud/functions-emulator

  • /functions/index.js

const admin = require('firebase-admin');

if (!admin.apps.length)
    admin.initializeApp({
    apiKey: "... your api key",
    authDomain: "... your auth domain",
    databaseURL: "... your database url",
    projectId: "... your project id",
    storageBucket: "... your storage bucket",
    messagingSenderId: "... your messaging sender id"
});
  • /.vscode/launch.json
{
    // Use IntelliSense to learn about possible attributes.
    // Hover to view descriptions of existing attributes.
    // For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387
    "version": "0.2.0",
    "configurations": [
        {
            "type": "node",
            "request": "attach",
            "name": "Attach Firebase",
            "port": 9229,
            "preLaunchTask": "Google Cloud Emulator"
        }
    ]
}
  • /.vscode/tasks.json
{
// See https://go.microsoft.com/fwlink/?LinkId=733558
// for the documentation about the tasks.json format
"version": "2.0.0",
"tasks": [
    {
        "label": "Start",
        "type": "shell",
        "command": "functions",
        "isBackground": true,
        "args": [
            "start"
        ],
        "group": "build"
    },
    {
        "label": "Deploy",
        "type": "shell",
        "command": "functions",
        "isBackground": true,
        "options": {
            "cwd": "${workspaceFolder}/functions/"
        },
        "args": [
            "deploy",
            "--trigger-http",
            "--timeout",
            "600s",
            "api"
        ],
        "dependsOn": [
            "Start"
        ],
        "group": "build"
    },
    {
        "label": "Inspect",
        "type": "shell",
        "command": "functions",
        "isBackground": true,
        "options": {
            "cwd": "${workspaceFolder}/functions/"
        },
        "args": [
            "inspect",
            "api"
        ],
        "dependsOn": [
            "Deploy"
        ],
        "group": "build"
    },
    {
        "label": "Google Cloud Emulator",
        "dependsOn": [
            "Inspect",
        ],
        "group": "build"
    },
]

}

  • start debugging "Attach Firebase"

Upvotes: 4

mwebler
mwebler

Reputation: 41

I just replied how to this using Firebase Functions v1.0 on another question: Debugging firebase cloud functions

You can make it work on Visual Studio Code using Firebase functions 1.0 without having to change anything on the function code.

You basically just need to set the FIREBASE_CONFIG environment variable properly when running the functions deploy command. Something like (don not forget to escape the " characters):

FIREBASE_CONFIG="{\"databaseURL\":\"https://YOUR-FIREBASE-PROJECT.firebaseio.com\",\"storageBucket\":\"YOUR-FIREBASE-PROJECT.appspot.com\",\"projectId\":\"YOUR-FIREBASE-PROJECT\"}
functions deploy --trigger-http --timeout 600s FUNCTION_NAME

After that, you just rund the functions debug FUNCTION_NAME to start the function and attach your vs Code debugger.

Upvotes: 0

Andrew Veresov
Andrew Veresov

Reputation: 424

You can't debug Firebase functions without defining Firebase configuration variables first. Firebase CLI does it for you.

To debug you can try the same trick as you would do for Firebase functions unit test.

Add following lines to the index.js file before you call admin.initializeApp(functions.config().firebase): 

admin.initializeApp = function () {}
functions.config = function() {
    return {
        firebase: {
          databaseURL: 'https://not-a-project.firebaseio.com',
          storageBucket: 'not-a-project.appspot.com',
        }
    };
}

You can debug Firebase functions now in a same way as any other google cloud function:

  1. Install the Cloud Functions Emulator:

    npm install -g @google-cloud/functions-emulator

  2. Start the Emulator:

    functions start

  3. Deploy your function:

    functions deploy helloWorldFunction --trigger-http

    You'll get output like this:

    Waiting for operation to finish...done.
Deploying function........done.
Function helloWorldFunction deployed.

Property | Value
---------|------------------------------------------------------------------------
Name     | helloWorldFunction
Trigger  | HTTP
Resource | http://localhost:8010/helloWorldProject/us-central1/helloWorldFunction

  4. To debug using the standard Node.js Debugger type:

    functions debug helloWorldFunction

    You'll get:

    Debugger for helloWorldFunction listening on port 5858.

  5. Now add following lines to your launch.json VS Code 

    {
    "version": "0.2.0",
    "configurations": [
        {
            "name": "Node.JS (local)",
            "type": "node",
            "request": "attach",
            "port": 5858
        }
    ]
}

  6. Start debugging in your VS Code and trigger your function by calling URL you've got on step #3.

    You can also trigger the function by typing functions call helloWorldFunction in the terminal.

For more details refer to the instructions here Cloud Functions Local Emulator.

Upvotes: 9

Related Questions