--- title: "How to open the browser console (Chrome, Edge, Firefox, Safari)" description: "Open the browser console in Chrome, Edge, Firefox, Safari or a Chromebook, then copy or save the logs and send them to a developer." canonical: https://faylee.app/docs/guides/browser-console --- # 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](https://faylee.app/docs/guides/browser-console#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](https://faylee.app/tools/browser-info) shows both and copies them, with the screen and window size, in one click. For a complete report, use the [bug report template](https://faylee.app/docs/guides/bug-report-template.md). 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](https://faylee.app/docs/guides/bug-report-template.md) has the steps to export one. :::caution[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](https://chromewebstore.google.com/detail/hlpfigkebjnklihappcmmjimjkmpmaif), which also works in Edge, Brave and Arc, the console and every network request are attached to each [recording](https://faylee.app/docs/capture/recording.md), [screenshot](https://faylee.app/docs/capture/screenshots.md) and [instant replay](https://faylee.app/docs/capture/instant-replay.md). 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](https://faylee.app/docs/workspace/privacy.md) before anything is uploaded. The reporter shares one link. The developer reads the [console and network](https://faylee.app/docs/viewer/devtools.md) 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](https://faylee.app/docs/agents/mcp.md) or [CLI](https://faylee.app/docs/agents/cli.md). Reports sent from the [site widget](https://faylee.app/docs/support/widget.md) carry the console and network too. A [recording link](https://faylee.app/docs/support/recording-links.md) sends the screen recording only. To try it, [start free](https://app.faylee.app/users/sign-up), or see [pricing](https://faylee.app/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](https://faylee.app/docs/guides/bug-report-template.md) - [Console, network and more](https://faylee.app/docs/viewer/devtools.md) - [Instant replay](https://faylee.app/docs/capture/instant-replay.md)