Logo Questions Linux Laravel Mysql Ubuntu Git Menu
HTML CSS JAVASCRIPT SQL PYTHON PHP BOOTSTRAP JAVA JQUERY R React Kotlin
 

React dev tools - Deactivate "break on warnings"

Tags:

reactjs

javascript-debugger

While developing with create-react-app, my browser enters debugger mode on warnings:

Paused in debugger

It breaks on the source code of react-dev-tools:

   // --- Welcome to debugging with React DevTools ---    // This debugger statement means that you've enabled the "break on warnings" feature.    // Use the browser's Call Stack panel to step out of this override function-    // to where the original warning or error was logged.

How can I deactivate this behavior?

like image 538
Noan Cloarec Avatar asked Jul 10 '20 13:07

Noan Cloarec

People also ask

How to disable DevTools in react?

Luckily, there’s a way to disable it. All you need to do is override the devtools global hook before React is loaded: You can find more information by checking out the issue.

What is the react profiler for developer tools?

React Developer Tools is a Chrome DevTools extension for the open-source React JavaScript library. It allows you to inspect the React component hierarchies in the Chrome Developer Tools. You will get two new tabs in your Chrome DevTools: "⚛️ Components" and "⚛️ Profiler".

How to disable react developer tool in Redux?

This answer concerns Redux DevTools. Not relevant. You can use @fvilers/disable-react-devtools package to disable React Developer tool Call the disableReactDevTools () method before React is loaded, in your main file.

How can I deactivate the break on error warning in chrome?

// Use the browser's Call Stack panel to step out of this override function- // to where the original warning or error was logged. How can I deactivate this behavior? Show activity on this post. Go to Chrome Devtools → in the Chrome console, go to Component → Click on Settings → unset Break on Warning.

Video Answer

2 Answers

Go to Chrome Devtools → in the Chrome console, go to Component → Click on Settings → unset Break on Warning. Do the same in Profiler → Settings → unset Break on warning.

@cadoman pointed check and then uncheck to make work for sure.

P.S: Image from https://github.com/facebook/react/issues/19308#issuecomment-656669792

Enter image description here

like image 135
Naresh Kumar Avatar answered Sep 20 '22 01:09

Naresh Kumar

Based on pull request DevTools: Make break-on-warn off by default #19309 it seems it's a bug.

The Break On Warnings box was unchecked for me and it still would break. Removing and readding the extension to force an update fixed it for me.

I don't know of another way to force Chrome to update an extension outside of its regular schedule.

like image 37
Chris Weiss Avatar answered Sep 20 '22 01:09

Chris Weiss
Sign in to Comment

Related questions

Event Handlers in React Stateless Components
How to configure package.json to run eslint script
Expected corresponding JSX closing tag for input Reactjs
Import JavaScript file and call functions using webpack, ES6, ReactJS
How to change the border color of MUI TextField
Jest, Enzyme: Invariant Violation: You should not use <Route> or withRouter() outside a <Router>
Extending HTML elements in React and TypeScript while preserving props
How do I pass state through React_router?
How do I dynamically set HTML5 data- attributes using react?
Passing props to react-redux container component
Set min/max on TextField type="number"?
onClick works but onDoubleClick is ignored on React component
How can I attach to a stateless component's ref in React?
Is there a way to check if the react component is unmounted?
ERROR in Cannot find module 'babel-core'. using react.js, webpack, and express server
Clear and reset form input fields
expected assignment or function call: no-unused-expressions ReactJS
React Function Components with hooks vs Class Components
What is the quickest way to convert a React app to React Native?
Error : Cannot read property 'map' of undefined

Donate For Us

If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!