Chrome DevTools for Node.js in Node.js - Interactive Code Practice

Practice - 5 Tasks

1fill in blank

easy

Complete the code to start Node.js with the inspector enabled.

Node.js

node --[1] app.js

Drag options to blanks, or click blank then click option'

Adebug

Binspect

Crun

Dstart

Attempts:

3 left

💡 Hint

Common Mistakes

Using --debug which is deprecated

Using --run which does not enable debugging

Using --start which is invalid

Use --inspect to start Node.js with the inspector enabled for debugging.

2fill in blank

medium

Complete the code to pause execution on the first line using the inspector.

Node.js

node --inspect-brk [1]

Drag options to blanks, or click blank then click option'

Aindex.js

Bmain.js

Capp.js

Dserver.js

Attempts:

3 left

💡 Hint

Common Mistakes

Using a file name that does not exist

Omitting the file name

Using --inspect without --inspect-brk to pause

The --inspect-brk flag pauses execution on the first line of the specified file, here app.js.

3fill in blank

hard

Fix the error in the command to open Chrome DevTools for Node.js debugging.

Node.js

chrome://[1]

Drag options to blanks, or click blank then click option'

Adebug

Bdevtools

Cinspect-devtools

Dinspect

Attempts:

3 left

💡 Hint

Common Mistakes

Using chrome://devtools which opens DevTools for the browser

Using chrome://debug which is invalid

Using chrome://inspect-devtools which does not exist

The correct URL to open Chrome DevTools for Node.js debugging is chrome://inspect.

4fill in blank

hard

Fill both blanks to create a debugger statement and start Node.js with the inspector.

Node.js

function test() {
  [1];
}

node --[2] app.js

Drag options to blanks, or click blank then click option'

Adebugger

Binspect

Cbreakpoint

Ddebug

Attempts:

3 left

💡 Hint

Common Mistakes

Using 'breakpoint' instead of 'debugger'

Using --debug which is deprecated

Omitting the debugger statement

The debugger statement pauses execution when DevTools is connected. The --inspect flag starts Node.js with the inspector enabled.

5fill in blank

hard

Fill all three blanks to connect Chrome DevTools to a Node.js process on port 9229.

Node.js

node --[1]=9229 app.js

Open Chrome and go to chrome://[2]

Click on 'Configure' and add 'localhost:[3]' to the list.

Drag options to blanks, or click blank then click option'

Ainspect

C9229

Ddebug

Attempts:

3 left

💡 Hint

Common Mistakes

Using --debug instead of --inspect

Using wrong port number

Not adding the correct port in Chrome's configuration

Use --inspect=9229 to start Node.js on port 9229. Then open chrome://inspect and add localhost:9229 to connect DevTools.

Practice

1. What is the main purpose of using Chrome DevTools with Node.js?

easy

A. To convert Node.js code to browser JavaScript

B. To write Node.js code faster

C. To deploy Node.js apps to the cloud

D. To pause and inspect Node.js code while it runs

Solution

1. Step 1: Understand Chrome DevTools role

   Chrome DevTools is a tool to debug and inspect running code visually.

2. Step 2: Connect to Node.js debugging

   Using DevTools with Node.js lets you pause and inspect your code during execution.

3. Final Answer:

   To pause and inspect Node.js code while it runs -> Option D

4. Quick Check:

   Debugging = Pause and inspect code [OK]

Hint: DevTools helps you pause and check code live [OK]

Common Mistakes:

• Thinking DevTools is for writing code
• Confusing debugging with deployment
• Assuming DevTools converts code formats

2. Which command correctly starts a Node.js app with debugging enabled for Chrome DevTools?

easy

A. node --inspect app.js

B. node app.js --inspect

C. node app.js --debug

D. node debug app.js

Solution

1. Step 1: Recall correct flag usage

   The debugging flag must come before the script name in the command.

2. Step 2: Check each option

   node --inspect app.js uses 'node --inspect app.js' which is the correct syntax to enable debugging.

3. Final Answer:

   node --inspect app.js -> Option A

4. Quick Check:

   Flag before script = correct syntax [OK]

Hint: Put --inspect before your script name [OK]

Common Mistakes:

• Placing --inspect after the script name
• Using deprecated --debug flag
• Typing 'node debug' which is not a valid command

3. Given this command: node --inspect-brk app.js, what happens when you run it?

medium

A. The app crashes immediately

B. The app runs normally without pausing

C. The app pauses on the first line waiting for debugger

D. The app runs but debugging is disabled

Solution

1. Step 1: Understand --inspect-brk flag

   This flag tells Node.js to start debugging and pause before executing any code.

2. Step 2: Predict behavior on running

   The app will wait for a debugger to connect before running the first line.

3. Final Answer:

   The app pauses on the first line waiting for debugger -> Option C

4. Quick Check:

   --inspect-brk = pause at start [OK]

Hint: --inspect-brk pauses app before first line [OK]

Common Mistakes:

• Thinking app runs immediately
• Confusing --inspect with --inspect-brk
• Assuming app crashes on this flag

4. You run node --inspect app.js but Chrome DevTools does not connect. What is a likely cause?

medium

A. You forgot to open chrome://inspect in Chrome

B. You used --inspect-brk instead of --inspect

C. Your Node.js version is too new

D. You ran the command without node

Solution

1. Step 1: Check connection setup

   To debug, you must open Chrome's chrome://inspect page to connect to Node.js.

2. Step 2: Analyze other options

   Using --inspect-brk is valid and pauses app; Node.js version too new is unlikely cause; running without node would cause error.

3. Final Answer:

   You forgot to open chrome://inspect in Chrome -> Option A

4. Quick Check:

   Open chrome://inspect to connect debugger [OK]

Hint: Always open chrome://inspect to connect debugger [OK]

Common Mistakes:

• Assuming --inspect-brk is required
• Ignoring the need to open Chrome inspect page
• Not running with 'node' command

5. You want to debug a Node.js app that crashes immediately on start. You run node --inspect app.js and connect Chrome DevTools but can't find where it crashes. What should you do to catch the crash at the start?

hard

A. Add debugger; inside app.js after the crash line

B. Run with node --inspect-brk app.js to pause before code runs

C. Run node --inspect app.js with extra logging

D. Use node debug app.js instead

Solution

1. Step 1: Understand crash timing

   If the app crashes immediately, you need to pause before any code runs to inspect it.

2. Step 2: Use correct flag to pause early

   The --inspect-brk flag pauses execution on the first line, letting you catch early crashes.

3. Step 3: Evaluate other options

   Adding debugger; after crash won't help if crash happens before it; extra logging may miss early crash; node debug is outdated.

4. Final Answer:

   Run with node --inspect-brk app.js to pause before code runs -> Option B

5. Quick Check:

   --inspect-brk pauses early to catch crashes [OK]

Hint: Use --inspect-brk to pause before app starts [OK]

Common Mistakes:

• Placing debugger after crash point
• Relying only on logs for early crashes
• Using deprecated debug command