A practical collection of browser DevTools console tricks to boost debugging productivity. Covers shorthand selectors like $() and $$() for DOM querying, top-level await with the Fetch API, console.table for formatted data output, the copy() function for clipboard access, the debug() helper in Chrome/Edge, Firefox's :screenshot
Table of contents
$ and friendsMake HTTP requests with fetchFormat data like a proCopy thingsDebug JavaScript functions with debug() (⚠ only in Edge and Chrome)Advanced screenshot features with :screenshot (⚠ only in Firefox)Know when data gets evaluatedWrite on multiple linesAccess your historySort: