Create
cancel
Showing results for 
Search instead for 
Did you mean: 
Sign up Log in
Deleted user
0 / 0 points
Next:
badges earned

Your Points Tracker
Challenges
Leaderboard
  • Global
  • Feed

Badge for your thoughts?

You're enrolled in our new beta rewards program. Join our group to get the inside scoop and share your feedback.

Join group
Recognition
Give the gift of kudos
You have 0 kudos available to give
Who do you want to recognize?
Why do you want to recognize them?
Kudos
Great job appreciating your peers!
Check back soon to give more kudos.

Past Kudos Given
No kudos given
You haven't given any kudos yet. Share the love above and you'll see it here.

It's not the same without you

Join the community to find out what other Atlassian users are discussing, debating and creating.

Atlassian Community Hero Image Collage

atlassian-connect-express 6: debug backend in VS code

Hello!

I this article we will learn how to debug the backend of our application in Visual Studio Code (VS code).

The code for our application will be based on this article.

You can find the source code for this article here.

You can find the video here.

First attempt

To debug our application in VS code select the backend/app.js file:

Screenshot 2021-05-16 at 08.35.10.png

Now open the “RUN AND DEBUG” tab, push the “Run and Debug” button and chose Node.js in the list:

Screenshot 2021-05-16 at 08.38.20.png

And we have an error:

/usr/local/bin/node ./backend/app.js
Process exited with code 1
(node:1411) Warning: To load an ES module, set "type": "module" in the package.json or use the .mjs extension.
(Use `node --trace-warnings ...` to show where the warning was created)

The problem is that when we launch our app we pass the following parameter:

-r esm

It means that we also have to pass this parameter to our debugger.

Second attempt

Click on the “create a launch.json file” link (choose Node.js item in the list, which you will see after you clicked the link):

Screenshot 2021-05-16 at 08.44.04.png

A launch. json file will be created:

{
    // 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": "pwa-node",
            "request": "launch",
            "name": "Launch Program",
            "skipFiles": [
                "<node_internals>/**"
            ],
            "program": "${file}"
        }
    ]
}

Now we need to do 3 things:

  1. We start our debugger from the root folder that is why we need to set the current folder for the debugger as the backend folder: “cwd”:”${workspaceFolder}/backend”
  2. We need to say what file to run: “program”: “${workspaceFolder}/backend/app.js”
  3. We need to pass the -r esm parameter: “runtimeArgs”: [“-r”,”esm”]
{
    // 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": "pwa-node",
            "request": "launch",
            "name": "Launch Program",
            "skipFiles": [
                "<node_internals>/**"
            ],
            "program": "${workspaceFolder}/backend/app.js",
            "cwd":"${workspaceFolder}/backend",
            "runtimeArgs": ["-r","esm"]
        }
    ]
}

Push the “Launch Program” button:

Screenshot 2021-05-16 at 08.44.04.png

Now our app started but then we received an error:

Watching atlassian-connect.json for changes
backend/node_modules/atlassian-connect-express/lib/internal/logger.js:16
Uncaught Error: listen EADDRINUSE: address already in use $PORT
/usr/local/bin/node -r esm ./app.js
Process exited with code 1

What happened?

Third attempt

The problem is that we defined several parameters in the backend/config.json file, which are taken from environment variables:

"port": "$PORT",
"localBaseUrl": "$APP_URL",

When we run the debugger, the debugger does not read this variables from our environment. We need to pass our parameters in the launch.json file:

{
    // 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": "pwa-node",
            "request": "launch",
            "name": "Launch Program",
            "skipFiles": [
                "<node_internals>/**"
            ],
            "program": "${workspaceFolder}/backend/app.js",
            "cwd":"${workspaceFolder}/backend",
            "runtimeArgs": ["-r","esm"],
            "env": {
                "PORT": "3000",
                "APP_URL": "https://1b26d2f93ae5.ngrok.io",
            }
        }
    ]
}

Now let’s push the “Launch Program” button again. Our application is running now:

Screenshot 2021-05-16 at 09.04.08.png

Test

Let’s test that everything works.

Install our app to Bitbucket and set a breakpoint in the backend/routes/index.js file:

Screenshot 2021-05-16 at 09.06.04.png

Open the Example Page menu item:

Screenshot 2021-05-16 at 09.08.58.png

And our app will stop on the breakpoint which we set:

Screenshot 2021-05-16 at 09.09.57.png

Everything works as expected!

1 comment

Mohammed Amine Community Leader Jun 04, 2021

Excellent content, thank you @Alexey Matveev _Appfire_ 

Comment

Log in or Sign up to comment
TAGS
Community showcase
Published in Marketplace Apps & Integrations

New cloud apps roundup - June 2021

Since our last roundup in April, Atlassian's Marketplace Partners have added over 100 new cloud apps to the Atlassian Marketplace to help your teams work more efficiently. Let’s take a quick look a...

390 views 5 12
Read article

Community Events

Connect with like-minded Atlassian users at free events near you!

Find an event

Connect with like-minded Atlassian users at free events near you!

Unfortunately there are no Community Events near you at the moment.

Host an event

You're one step closer to meeting fellow Atlassian users at your local event. Learn more about Community Events

Events near you