Any modern web browser allows us to easily debug JavaScript code. Now, we will use Chrome Developer Tools (CDT) to debug the asynchronous JavaScript code that runs in our web application. You can perform the same tasks with other browsers; you will just need to follow different steps.
Make sure that you are using Chrome to render the home_automation.html web page. In Chrome, select the Chrome menu located on the upper-right corner of the window and then select More Tools | Developer Tools. Chrome will display a window or a panel with the developer tools. The tools can be undocked into a separate window, docked to the bottom of the main window, or docked to the right of the main window.
Click on the Sources tab, navigate to home_automation.js, and click on this JavaScript file. The source code for the JavaScript file will be displayed.
You can easily establish breakpoints by clicking on the line numbers. Click on the...
