Using Chrome* DevTools to Debug your Remote IoT Node.js* Application... https://software.intel.com/en-us/articles/using-chrome-devtools-to-debug...

Developer Search our content library...   Support  Sign in   English 

Zone

INTERNET OF THINGS More Info  Share

CONTENTS
Using Chrome* Inspect for
Node.js*
 Using Node Inspector

Using Chrome* DevTools to Debug your Remote IoT Node.js*

Application
https://software.intel.com/en-us/user/436096), published on November 3, 2017

If you prefer using Chrome* DevTools to debug your JavaScript* applications, rather than the
command-line debug tool built into Node.js*, you should consider using one of these two options:

Chrome Inspect for Node (https://medium.com/@paul_irish/debugging-node-js-nightlies-with-

chrome-devtools-7c4a1b95ae27) — if your IoT Node.js version is 6.3.0 or newer.

Node Inspector (https://github.com/node-inspector/node-inspector) — if the version of Node.js

on your IoT device is 6.2.x or older.

1 de 16 15/4/20 12:07
Using Chrome* DevTools to Debug your Remote IoT Node.js* Application... https://software.intel.com/en-us/articles/using-chrome-devtools-to-debug...

Both support a connection to Chrome DevTools (https://developers.google.com/web/tools/chrome-

devtools/) in the Chrome browser on your host development system to the remote Node.js application
running on your headless IoT target device. Additional Node.js debugging options are described on
the Debugging Node.js Apps (https://nodejs.org/en/docs/inspector/) documentation page.

CONTENTS For help setting up a remote Node.js for IoT JavaScript development environment, see the companion
Using Chrome* Inspect for article titled Alternatives to Using the Intel® XDK to Develop Node.js* IoT Applications (/en-us/xdk
Node.js* /articles/alternatives-to-using-the-intel-xdk-to-develop-nodejs-iot-applications).

 Using Node Inspector

NOTE: The Nuclide* package for Atom* (https://nuclide.io/) "add-on" provides built-in support
for Chrome DevTools (https://nuclide.io/docs/features/debugger/) and remote development of
Node.js applications (https://nuclide.io/docs/features/remote/) within a convenient development
environment. You will need to install the Atom editor by GitHub* (http://atom.io/) to use this tool.

Using Chrome* Inspect for Node.js*

This debug technique requires:

Chrome Browser version 55 or higher on your host development system

Node.js version 6.3.0 or higher on your IoT target device

If you are using older versions of the above components consider using the Node Inspector debug
solution, described in the next major section of this document.

2 de 16 15/4/20 12:07
Using Chrome* DevTools to Debug your Remote IoT Node.js* Application... https://software.intel.com/en-us/articles/using-chrome-devtools-to-debug...

If your versions of Node.js and Chrome meet the requirements stated above, there is nothing more
that needs to be installed onto your target IoT device or your host development system.

Configuring Chrome*

CONTENTS Some initial configuration in the Chrome browser is required to make this work. Open your the
Chrome browser on your host development system and type the following into the URL address bar:
Using Chrome* Inspect for
Node.js*
 Using Node Inspector chrome://inspect (chrome://inspect)

Then, make sure the Discover network targets box is checked and push the Configure... button
located to the right of that checkbox item (as shown in the image below).

3 de 16 15/4/20 12:07
Using Chrome* DevTools to Debug your Remote IoT Node.js* Application... https://software.intel.com/en-us/articles/using-chrome-devtools-to-debug...

CONTENTS
Using Chrome* Inspect for
Node.js*
 Using Node Inspector

The Configure... button will bring up a Target discovery settings dialog similar to the one shown
below. In this dialog you can add the names (or IP addresses) of your IoT target devices, appended
with port 9229.

4 de 16 15/4/20 12:07
Using Chrome* DevTools to Debug your Remote IoT Node.js* Application... https://software.intel.com/en-us/articles/using-chrome-devtools-to-debug...

CONTENTS
Using Chrome* Inspect for
Node.js*
 Using Node Inspector

In this example, we are using an IoT device named "de3815-paf2" which is addressable as "de3815-
paf2.local" on the local network via MDNS/Avahi/Bonjour (see this companion article (/en-us/xdk
/articles/alternatives-to-using-the-intel-xdk-to-develop-nodejs-iot-applications) for more information
about configuring MDNS). If you have a corporate name service on your network the device might be
named something like "my-iot-hostname.mycompany.com" or it might be accessible simply as "my-iot-
hostname" without any domain qualifier. Use any name that responds to a "ping" command, or use
the device IP address if it is statically assigned and you know it will never change.

Using Chrome* Inspect

With "chrome://inspect" configured and running, you can get started debugging your remote IoT
application in Chrome DevTools. Using ssh (or PuTTY), log into your IoT target and start the
application in "debug mode" by typing the following:

5 de 16 15/4/20 12:07
Using Chrome* DevTools to Debug your Remote IoT Node.js* Application... https://software.intel.com/en-us/articles/using-chrome-devtools-to-debug...

$ node --inspect --debug-brk <my-app-name>.js

In the example below, the application to be debugged is named main.js and is located in the

~/node-debug-test folder.
CONTENTS
Using Chrome* Inspect for
Node.js*
 Using Node Inspector

The application being debugged in this example uses the MRAA library, which requires that this
application be run as root. Thus the reason for the sudo -E bash command, which is simply a
convenient way to get a root prompt.

The --debug-brk option pauses your application at the first line of executable code. Additional
command-line options are described in the Node.js debug doc pages (https://nodejs.org/en/docs
/inspector/#command-line-options).

6 de 16 15/4/20 12:07
Using Chrome* DevTools to Debug your Remote IoT Node.js* Application... https://software.intel.com/en-us/articles/using-chrome-devtools-to-debug...

NOTE: DO NOT open the long "chrome-devtools://devtools/..." URL! That only works if the
application and Chrome are on the same system. In this case the application is running on your
IoT target device and Chrome is on your host development system.

CONTENTS
Once the application has been started in "debug mode" it should appear in the chrome://inspect tab
Using Chrome* Inspect for
in the Chrome browser window on your host development system. If you do not have Chrome
Node.js*
running, start it and enter chrome://inspect into the URL address bar to see a list of debuggable
 Using Node Inspector devices and applications.

Click the blue inspect link that appears in the chrome://inspect tab.

7 de 16 15/4/20 12:07
Using Chrome* DevTools to Debug your Remote IoT Node.js* Application... https://software.intel.com/en-us/articles/using-chrome-devtools-to-debug...

CONTENTS
Using Chrome* Inspect for
Node.js*
 Using Node Inspector

In this example you can see the application waiting to be debugged is listed under the title "Remote
Target #DE3815-PAF2.LOCAL" and lists the Node.js version (v6.10.3) followed by the name of the
application (main.js) and the location on the IoT file system of that application (/home/ubuntu/node-
debug-test/main.js).

Clicking the inspect link should bring up an instance of Chrome DevTools for Node.js, similar to that

8 de 16 15/4/20 12:07
Using Chrome* DevTools to Debug your Remote IoT Node.js* Application... https://software.intel.com/en-us/articles/using-chrome-devtools-to-debug...

shown below. Obviously, the details of the Chrome DevTools window will vary as a function of the
application you are debugging. This is a view of the "blink LED" sample application (https://github.com
/gomobile/iotapp-template-onboard-led-blink) borrowed from the Intel® XDK.

CONTENTS
Using Chrome* Inspect for
Node.js*
 Using Node Inspector

From here you can use a version of Chrome DevTools tailored for use with Node.js to single-step,
break and inspect objects within your application. Notice also that you have access to the JavaScript

9 de 16 15/4/20 12:07
Using Chrome* DevTools to Debug your Remote IoT Node.js* Application... https://software.intel.com/en-us/articles/using-chrome-devtools-to-debug...

console for quick tests and debugging.

For help with using Chrome DevTools, see these doc pages (https://developers.google.com/web/tools
/chrome-devtools/) on the Google Developers site.

CONTENTS
NOTE: if you use console.log() messages in your application they should appear in the
Using Chrome* Inspect for
Node.js* Chrome DevTools console, and they will also appear in your remote IoT device's ssh console.
This is especially of value if your application ends immediately after issuing some
 Using Node Inspector
console.log() messages, in which case those messages will appear in the ssh console but
may get dropped from the remote Chrome DevTools console, due to a sudden loss of the
debug connection.

Using Node Inspector

This debug technique works best with:

Chrome Browser on your host development system

Node.js version 6.2.x or lower on your IoT target device

NOTE: If your IoT target device is running Node.js version 6.3.0 or higher consider using the

10 de 16 15/4/20 12:07
Using Chrome* DevTools to Debug your Remote IoT Node.js* Application... https://software.intel.com/en-us/articles/using-chrome-devtools-to-debug...

Chrome Inspect for Node debug solution described in the previous section. It provides a
superior debug environment and is easier to setup.

Installing Node Inspector

CONTENTS
Before you can use this technique you must first install the Node Inspector node module on your IoT
Using Chrome* Inspect for
target. Log into your IoT target device, using ssh or PuTTY, and type the following command:
Node.js*
 Using Node Inspector
$ npm install -g node-inspector

No additional software needs to be installed on your host development system, other than the Chrome
browser.

Starting a Node Inspector Debug Session

At the remote login shell on your IoT target device, type the following:

$ node-debug --debug-brk --cli --web-host 192.168.0.2 my-app.js

Where the IP address listed after the --web-host option is your IoT target device's IP address and

my-app.js is the name of the Node.js application you are going to run and debug on your IoT
system.

If you are uncertain of your IoT device's IP address, type "ping $HOSTNAME" on the remote login

11 de 16 15/4/20 12:07
Using Chrome* DevTools to Debug your Remote IoT Node.js* Application... https://software.intel.com/en-us/articles/using-chrome-devtools-to-debug...

shell of your IoT target device and use the IP address that is reported by that command.

In the example below, the application to be debugged is named main.js and is located in the

~/node-debug-test folder.
CONTENTS
Using Chrome* Inspect for
Node.js*
 Using Node Inspector

The application being debugged in this example uses the MRAA library, which requires that this
application be run as root. Thus the reason for the sudo -E bash command, which is simply a
convenient way to get a root prompt.

The --debug-brk option pauses your application at the first line of executable code and the --cli
option makes sure node-debug does not attempt to automatically open a browser on your remote IoT
device. Additional command-line options are described in the Node Inspector README
(https://github.com/node-inspector/node-inspector#configuration).

Once the application has been started in "debug mode" it prints a URL (e.g.,

12 de 16 15/4/20 12:07
Using Chrome* DevTools to Debug your Remote IoT Node.js* Application... https://software.intel.com/en-us/articles/using-chrome-devtools-to-debug...

"http://192.168.20.37:8080/?port=5858" in the example above). Copy that URL into the Chrome
browser window on your host development system to open a copy of Chrome DevTools, as shown
below.

CONTENTS
Using Chrome* Inspect for
Node.js*
 Using Node Inspector

The details of the Chrome DevTools window you see will vary as a function of the application you are
debugging. This is a view of the "blink LED" sample application (https://github.com/gomobile/iotapp-

13 de 16 15/4/20 12:07
Using Chrome* DevTools to Debug your Remote IoT Node.js* Application... https://software.intel.com/en-us/articles/using-chrome-devtools-to-debug...

template-onboard-led-blink) borrowed from the Intel® XDK.

From here you can use Chrome DevTools to single-step, break and inspect objects within your
remote Node.js application. Notice also that you have access to the JavaScript console for quick tests
and debugging.
CONTENTS
For help with using Chrome DevTools, see these doc pages (https://developers.google.com/web/tools
Using Chrome* Inspect for
/chrome-devtools/) on the Google Developers site.
Node.js*
 Using Node Inspector
NOTE: if you use console.log() messages in your application they should appear in the
Chrome DevTools console, and they will also appear in your remote IoT device's ssh console.
This is especially of value if your application ends immediately after issuing some
console.log() messages; in which case those messages will appear in the ssh console but
may get dropped from the remote Chrome DevTools console, due to a sudden loss of the
debug connection.

More Info (https://software.intel.com/en-us/iot/tools)

Additional Resources
Intel IoT Developer Kit (https://software.intel.com/en-us/iot/tools)

Cylon.js: a JavaScript Framework for Robotics and IoT (https://cylonjs.com/)

JerryScript: a JavaScript Engine for IoT (http://jerryscript.net/)

14 de 16 15/4/20 12:07
Using Chrome* DevTools to Debug your Remote IoT Node.js* Application... https://software.intel.com/en-us/articles/using-chrome-devtools-to-debug...

Zephyr.js: a JavaScript Runtime for the Zephyr OS (https://github.com/01org/zephyr.js)

JS IDE for Zephyr.js (https://01org.github.io/zephyrjs-ide/)

For more complete information about compiler optimizations, see our Optimization Notice (/en-
CONTENTS us/articles/optimization-notice#opt-en).
Using Chrome* Inspect for
Node.js*
 Using Node Inspector

Training Related Programs

IoT Training Intel® AI: In Production

15 de 16 15/4/20 12:07
Using Chrome* DevTools to Debug your Remote IoT Node.js* Application... https://software.intel.com/en-us/articles/using-chrome-devtools-to-debug...

OpenVINO™ Toolkit Tech.Decoded Intel® Internet of Things

Intel® Media SDK GitHub*: Intel® IoT Developer Kit Solutions Alliance
Intel® System Studio 01.org
YouTube*: Intel® IoT

CONTENTS
Rate Us   Get the Newsletter Follow us:     
© Intel Corporation Terms of Use *Trademarks Privacy Cookies Email preferences

16 de 16 15/4/20 12:07