If you click the "Step Over" button about five times, you exit out of the main.
Refresh the page so the debugger pauses on line 49.ħ. Click “Add” and check the box above the pattern input to “Blackbox content scripts”.ĥ. Close the Settings window and return to the Sources tab.Ħ.
Google chrome script debugger code#
The code uses the console.table to print the results in a table as shown below.Ĥ. This performs a query task to view all counties in Connecticut. Open the Chrome Developer Tools by using shortcut keys (Windows: Control + Shift + I, and Mac: Command + Option + I), or by navigating to the top right-hand pane of the browser, clicking the three grey vertical dots, and choosing “More tools” > “Developer tools”.ģ. Click “Perform Query” in the sample application. Let’s take a look at the Console Table sample.ġ. Each element in the array is a row in the table. This function takes one mandatory argument, which must be an array or an object, and one additional optional parameter. One way to enhance our console log messaging and view data more easily is to display a list of objects as a table, which is accomplished using the console.table function. Part 1: Console.tableĬonsole.log is our primary debugging function, but this function's output can be a bit difficult to read (especially when viewing a lot of data). Specifically, we will focus on three areas: enhanced messaging to the console, better ways to set breakpoints using conditions specified at runtime, and a more efficient way of stepping through breakpoints in the Sources tab with a method called blackboxing. Our goal for this third blog post in the series is to introduce more advanced tips and tricks to enable you to more effectively debug and troubleshoot your JavaScript code. While most modern browsers have some form of developer tools, here we use Chrome for our examples.
In the past two JavaScript Debugging Tips posts on the Esri Support blog, we looked at the Network Tab and the Console Tab as part of the Google Chrome Developer Tools. See JavaScript Debugging Tips Part I and also JavaScript Debugging Tips Part II for our previous segments.
Google chrome script debugger series#
This blog post is the third in a series of JavaScript debugging tips and tricks to help you on your way.
0 kommentar(er)
