I can't seem to find a way to add a watch expression for the selected JavaScript text in Chrome developer tools, the same way I would in Firebug with Ctrl+W. Is there really no way to do this in Chrome? I can't even right-click the selection as it unselects as soon as I do it, and there is no "Add watch" context menu item. Do I really have to type in every watch I want to add while debugging JS?
To add a variable to the watch list use the add icon to the right of the section heading. This will open an inline input where you provide the variable name to watch. Once it is filled in press your Enter key to add it to the list. The watcher will show you the current value of the variable as it is added.
To add a custom device: Click the Device list and then select Edit. On the Settings > Devices tab, either choose a device from the list of supported ones or click Add custom device to add your own. If you're adding your own, enter a name, width, and height for the device, then click Add.
From the Chrome DevTool docs on JS Debugging Reference > Watch the values of custom JavaScript Expressions, you can do it in 1 of 3 ways:
Highlight text, right click, and selct Add selected text to watches
*Note: this used to be "Add to watch"
Highlight text and press Ctrl + Shift + A
Add expression on the watch panel directly in the top right corner of the sources tab
You can do it by clicking 'add to watch' after right clicking
You can also select the expression/variable and hit Ctrl + Shift + A
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With