Console errors, HAR files and DevTools

Open DevTools from the keyboard

Chrome doesn't let an extension open DevTools, so Open DevTools lists the quickest ways in, with the keys for your computer (Mac or Windows and Linux). Click the page first so the keys reach it.

• DevTools: F12 or Ctrl+Shift+I (⌥⌘I on a Mac).
• Inspect an element: Ctrl+Shift+C (⇧⌘C), then click it on the page.
• Console: Ctrl+Shift+J (⌥⌘J).
• Page source: Ctrl+U (⌥⌘U).

Under Each panel, open DevTools, press Ctrl+Shift+P (⇧⌘P) for the command menu and type the panel's name. Every panel is listed, from Elements and Network to Lighthouse, Rendering, Coverage and Sensors, with a button that copies its command (such as Show Network) to paste in. Inside DevTools lists the shortcuts for the command menu, opening a file, searching every file, the device toolbar, the drawer, the next and previous panel, docking, a hard reload and pausing scripts.

Under Also are View this page's source, Debug a phone or another device, Service workers and Inspect an extension's pages. In DevTools' Elements panel, the DevTools+ tab beside Styles shows the selected element's selector, box and colors; see Right-click menu, shortcuts and the Elements tab.

Record console errors

1. Open the page with the problem and click Console errors in the toolbar panel.
2. Leave Reload the page first on to catch errors while the page loads, or switch it off to catch what happens when you do something on the page.
3. Press Reload and record. It records the page's errors and warnings for 6 seconds.
4. The results are grouped by where each one came from: extensions first (often the surprise), then This site, then other sites. The same message repeated shows once with a count.
5. Press Copy as text to paste the list into a bug report.

Chrome shows its "debugging this browser" bar while it records; it goes away when the recording ends. Nothing recorded leaves your computer.

Record a HAR file

1. Open the page and click Record a HAR file, then press Start recording. The panel closes and a Recording network traffic banner stays on the page. The toolbar icon shows REC.
2. Do what you need on the page: reload it, sign in, reproduce the bug.
3. Press Stop and save on the banner (or in the toolbar panel). Press Cancel to throw the recording away.
4. The file saves to your Downloads, named after the site and the time. A note says how many requests it holds, how many with bodies, how many failed and its size.

The HAR file includes response bodies. Open it in DevTools' Network panel (drop it in) or any HAR viewer. It can hold cookies, tokens and personal data from that session, so share it with care. Closing Chrome's debugging bar while it records stops the recording without saving.

Open your AI tools

AI tools lists your AI products, each opening in a new tab beside the current one. Codex, Claude Code and GitHub Copilot are on to start. ChatGPT, Claude, Gemini, AI Studio, NotebookLM, Microsoft Copilot, Claude Design, Figma Make and Mermaid are a switch away under Settings → Tools → AI tools, where you can also reorder them and add your own. The gear in the tool's header goes straight there; see Choose and order your tools.

Open Chrome's developer pages

Chrome's developer pages collects Chrome's internal pages in groups (Debugging, Network, Rendering and media, Storage, Browser and Privacy sandbox), each opening in a tab beside the current one. Among them: chrome://inspect for phones, tabs and service workers, net-internals for clearing the DNS cache and flushing sockets, a NetLog recording, WebRTC internals, GPU, tracing, media playback, accessibility trees, IndexedDB, storage quota, version, flags, policies, processes and crash reports.

Related guides

Next, read Emulate devices, networks and preferences, Change requests with request rules or Troubleshoot common issues.