Debugging with Chrome Developer Tools Flashcards Preview

Phase_2 > Debugging with Chrome Developer Tools > Flashcards

Flashcards in Debugging with Chrome Developer Tools Deck (9)
Loading flashcards...
1

How do you open the Chrome Developer Tools?

super easy

2

Use the debugger statement to pause execution in the Chrome Developer Tools.

...

3

Use log values to the console in the Browser

super easy

4

Set breakpoints in code using the Chrome Developer Tools

https://www.youtube.com/watch?v=KbEx0s06VLs @ 4:42

To debug in the Chrome browser run your program and open up the dev tools. Open up the Sources tab and the main.js file.

To set a breakpoint navigate click on function you want to set a breakpoint on. When you run the program the code will run everything up to the point where the breakpoint is declared.

Step in:
Step over:
Step out:
Continue:

5

Inspect an element in the DOM using the Chrome Developer Tools.

super easy

6

Change element styling using the Chrome Developer Tools.

super easy

7

Inspect network requests using the Chrome developer tools

super easy

8

Describe the JS call stack

...

9

Use the debugger step in, step out, and step over function calls, in the Chrome Developer Tools.

...