DevTools Tips hero logo

DevTools Tips: Snippets and live expressions

Published on

Use Snippets in DevTools to run code you frequently use and live expression to watch JavaScript values in real time.

Watch the video to learn how to:

  • Create a snippet or open the Snippets pane:

  • Run your new snippet:

    • With the Command / Control + Enter shortcut in Sources
    • From the Command Menu using !.
  • Pass values to your snippet:

    1. Pause it with a breakpoint.
    2. Set values in the Sources > Scope pane.
    3. Resume execution.
  • Execute snippets from the Console: load them as global functions and run once.

  • Use Console Utilities API in your snippets.

  • Use Console > Live Expressions:

    • To execute a piece of code you want to run repeatedly, for example, during a debugging session.
    • Watch how the values change during execution in real time.

To learn more, see:

Published on Improve article


Google Summer of Code and Chrome Extensions


Related Website Sets - the new name for First-Party Sets in Chrome 117

This site uses cookies to deliver and enhance the quality of its services and to analyze traffic. If you agree, cookies are also used to serve advertising and to personalize the content and advertisements that you see. Learn more about our use of cookies.