Skip to content

Live expressions in devtools

chrome

You can create live expressions in chrome devtools that always display the latest value of an expression.

It is very useful for tracking the dom state. For example, you can use document.activeElement to see what element is currently focused. Other useful expressions include $0 to see what element is currently selected in the elements panel.

demo of using live expressions

You are not limited to just expressions. You can also assign values in live expressions. This is useful for getting back control on some sites which disable right-clicking or copy/pasting text.

js
document.body.oncontextmenu = (e) => e.stopPropagation();

Read more about live expressions: