How to open the browser console (Chrome, Edge, Firefox, Safari)

The browser console is where a web page writes its errors. To open it, press Ctrl+Shift+J in Chrome or Edge, or Cmd+Option+J on a Mac. Then repeat what broke, and copy the red lines for whoever is fixing the bug.

Browser	Windows and Linux	Mac
Chrome, Edge, Brave, Arc	Ctrl+Shift+J, or F12	Cmd+Option+J
Chromebook	Ctrl+Shift+J	–
Firefox	Ctrl+Shift+K	Cmd+Option+K
Safari	–	Cmd+Option+C, after you turn on the web developer features (see Safari)

F12 opens developer tools on the panel you used last, which isn’t always the console. The J shortcut always opens the console.

Open the console, step by step

Open the console in the tab where the bug happens. Every tab has its own console.

Chrome

1. Go to the page with the problem.
2. Press Ctrl+Shift+J (Cmd+Option+J on a Mac).
3. Without a shortcut: click the ⋮ menu to the right of the address bar, choose More tools, then Developer tools, and click the Console tab.

A quicker route is to right-click anywhere on the page and choose Inspect. That opens developer tools on the Elements tab. Click Console next to it.

Brave and Arc are built on the same engine as Chrome and use the same shortcuts and the same console.

Edge

1. Go to the page with the problem.
2. Press Ctrl+Shift+J (Cmd+Option+J on a Mac).
3. Without a shortcut: click the … menu at the top right, choose More tools, then Developer tools, and click the Console tab.

Right-click → Inspect works in Edge too.

Chromebook

A Chromebook keyboard has no F12 key, so use the shortcut or the menu:

1. Press Ctrl+Shift+J.
2. Or click the ⋮ menu, choose More tools, then Developer tools, and open the Console tab.

On a school or work Chromebook, the administrator can turn developer tools off. If neither route opens anything, that is the reason, and only the administrator can change it.

Firefox

1. Go to the page with the problem.
2. Press Ctrl+Shift+K (Cmd+Option+K on a Mac). This opens the Web Console, which the toolbar calls Console.
3. Without a shortcut: open the ☰ menu, choose More tools (called Browser Tools in some versions), then Web Developer Tools, and click the Console tab.

Right-click → Inspect opens the same tools.

Safari

Safari hides its developer tools until you turn them on. You only need to do this once.

1. Open Safari → Settings → Advanced.
2. Tick Show features for web developers. A Develop menu appears in the menu bar.
3. Go to the page with the problem.
4. Press Cmd+Option+C, or choose Develop → Show JavaScript Console.

What you’re looking at

The console lists messages the page logged, newest at the bottom.

• Errors are red, with a red icon. These are what a developer wants most.
• Warnings are yellow. Sometimes they matter and sometimes they’re noise. Include them if you aren’t sure.
• Info and log messages are plain text. They are often the app’s own notes about what it was doing.

Each error has a link on the right with a file name and a line number, such as checkout.js:212. Keep it in whatever you send, because it tells the developer where in the code to look. Click the small arrow at the start of an error to expand its stack, the list of functions that led to it.

The levels filter at the top of the console (Default levels in Chrome and Edge, the Errors and Warnings buttons in Firefox) hides or shows each kind of message. If the console looks empty, check that errors aren’t filtered out.

Open the console first, then repeat the bug

The console doesn’t show messages from before it was opened, and it clears itself when the page reloads or you move to another page. So:

1. Open the console.
2. Reload the page, or go back to where you started.
3. Do the thing that breaks, one more time.

If the bug happens while moving between pages, such as after a form submits or a login redirects, turn on Preserve log first. In Chrome and Edge, click the gear icon in the console’s top-right corner (Console settings) and tick Preserve log. In Firefox the same setting is called Persist Logs, in the console’s gear menu. Messages then survive reloads and page changes.

How to copy or save the console logs

Chrome, Edge, Brave and Arc

• Save everything: right-click anywhere in the console’s messages and choose Save as…. You get a .log text file you can attach to an email, a chat or an issue.
• Copy part of it: click and drag to select the errors you want, including their expanded stacks, and press Ctrl+C (Cmd+C on a Mac).

Firefox

Right-click in the console’s messages and choose Copy all Messages to copy the whole log, or Save all Messages to File to save it as a text file. You can also select lines and copy them as usual.

Safari

Select the messages you want and press Cmd+C, then paste them into your message.

Screenshots are a last resort

A screenshot of the console is better than nothing, but a developer can’t search it, copy an error into a search engine or open the file it names. Long errors are often cut off, too. Send the text whenever you can.

What to send the developer

Along with the console text, include:

• The error lines, with the file and line link text (such as checkout.js:212) and the expanded stack.
• What you did just before, as numbered steps: what you clicked and typed, in order.
• The page URL, copied from the address bar.
• The browser you used, and the operating system. The browser and screen checker shows both and copies them, with the screen and window size, in one click.

For a complete report, use the bug report template.

If an error mentions a request, a status such as 404 or 500, or Failed to fetch, the cause is often in the Network tab, next to Console. A developer may ask you to export it as a HAR file, which holds every request the page made. The bug report template has the steps to export one.

Before you share: check for secrets

Apps sometimes print tokens, email addresses or other personal data to the console. Read the log before you paste it into a public issue or a shared channel, and remove anything private.

Skip the steps: let the bug report collect the console

Every step above is something the browser already knows. With Faylee’s Chrome extension, which also works in Edge, Brave and Arc, the console and every network request are attached to each recording, screenshot and instant replay. There’s no developer tools panel to open and no file to save. Instant replay keeps the last few minutes of the page, so it also catches a bug that has already happened. Secrets in the captured data are redacted in the browser before anything is uploaded.

The reporter shares one link. The developer reads the console and network in the viewer, lined up with the video, and a coding agent such as Claude Code, Codex or Cursor can read the same report through Faylee’s MCP server or CLI. Reports sent from the site widget carry the console and network too. A recording link sends the screen recording only.

To try it, start free, or see pricing.

FAQ

Why is my console empty?

The console only shows what happened after it was opened, and it clears on reload. Open it, then repeat what broke. If the bug happens while the page changes or reloads, turn on Preserve log (Chrome, Edge) or Persist Logs (Firefox) first. Also check that the levels filter isn’t hiding errors.

Can I open the console on my phone?

Not on the phone itself. Mobile browsers don’t have a built-in console. A developer can connect the phone to a computer with a cable and read the console from the desktop browser, which is called remote debugging. Chrome on Android pairs with desktop Chrome, and Safari on iPhone pairs with Safari on a Mac.

Is it safe to send console logs?

Usually, yes. The console holds the page’s errors and messages, not your passwords. But an app can print tokens, emails or other personal data there, so read the log before you share it, and send it privately rather than in a public issue when in doubt.

Do I need to know JavaScript to do this?

No. You only open the console, repeat the bug, and copy what appears. You don’t need to understand the messages. The developer reads them.

Related

• Bug report template
• Console, network and more
• Instant replay