Javascript: How to Get Chrome to Break on All Errors

JavaScript: Is there a way to get Chrome to break on all errors?

Edit: The original link I answered with is now invalid.The newer URL would be https://developers.google.com/web/tools/chrome-devtools/javascript/add-breakpoints#exceptions as of 2016-11-11.

I realize this question has an answer, but it's no longer accurate. Use the link above ^

(link replaced by edited above) - you can now set it to break on all exceptions or just unhandled ones. (Note that you need to be in the Sources tab to see the button.)

Chrome's also added some other really useful breakpoint capabilities now, such as breaking on DOM changes or network events.

Normally I wouldn't re-answer a question, but I had the same question myself, and I found this now-wrong answer, so I figured I'd put this information in here for people who came along later in searching. :)

how to break on error in Javascript

Open developer tools in Chrome and go to Sources tab. At the right hand side where you'll find the controls to step through your code you can click on the pause button once and it will turn blue. Now when an error happens it will pause your code at that line.

Sample Image

Is there a way to break on warnings in Google Chrome?

If you are just trying to look at the console messages, turning on "Preserve log" might be an easier solution.

Sample Image

How to turn on Pause On Uncaught Exceptions in Google Chrome Canary?

The docuemntation is a little bit outdated.

In the new Chrome versions the "pause on exception" button doesn't toggle anymore between 3 states (disabled, "Pause on Exceptions","Pause on Uncaught Exceptions") but only between two states (disabled and "Pause on Exception").

In order to be able to also break on caught exceptions they introduced this checkbox (this is useful if you have a global exception handler in GWT but still want to break when the exception is thrown).

So if you don't catch the exception then the settings you have shown in your screenshot should work.

Is there any way to prevent throwing errors on the chrome console if anything goes wrong?

.catch(err => setTimeout(() => console.clear()))

...should do it. The setTimeout bit is necessary. It needs to be placed at the end of the execution queue.

See it working:

fetch('//non-existent-url')
  .catch(err => setTimeout(() => console.clear()))

How to throw a javascript error during runtime via browser (Chrome)?

You did not clearly mention how and where the error should be thrown. I will assume that you can use a modified copy of your JavaScript file to throw errors. The modified file will reside on your computer and only be used when you're using Chrome developer tools. This feature is called Local Overrides. The steps are as follows:

Open the webpage
Open Chrome developer tools for that webpage
In Sources panel go to Overrides tab
Click Select folder for overrides and choose a folder on your computer
- A warning appears on the webpage which reads "DevTools requests full access to ..." which you must allow
In Sources panel go to Page tab
Locate the file in which you need to inject the "throw error" code
Right click and choose Save for overrides

Now you can edit the copy of the file on your computer or from within developer tools. Insert the code that produces the error at the desired location. When you reload the page with developer tools open, Chrome will load the local copy of the JavaScript file and throw the error. The error thrown that way will contain the context from where it originated e.g. call stack. If the developer tools are closed then live copy will be used.

How to terminate script execution when debugging in Google Chrome?

In Chrome, there is "Task Manager", accessible via Shift+ESC or through

Menu → More Tools → Task Manager

You can select your page task and end it by pressing "End Process" button.