Questions tagged [react-error-boundary]
102 questions
26
votes
2 answers
React Error Boundaries not working with React
This is my Error Boundary file -
class ErrorHandling extends Component {
state = { hasError: false }
componentDidCatch() {
this.setState({ hasError: true })
}
render() {
// debugger
if (this.state.hasError)…

M3ghana
- 1,231
- 1
- 9
- 19
18
votes
2 answers
How to properly type a React ErrorBoundary class component in Typescript?
Here is my current attempt on how to properly type a React ErrorBoundary class component in Typescript:
import React from "react";
import ErrorPage from "./ErrorPage";
import type { Store } from "redux"; // I'M PASSING THE REDUX STORE AS A CUSTOM…

cbdeveloper
- 27,898
- 37
- 155
- 336
9
votes
3 answers
reset error boundary on back journey using useErrorHandler hook from react-error-boundary
I am using react-error-boundary package to show the fall back UI in case application throws any errors. The package works fine for me. I need to understand how to reset application error state if I go to previous pages using browser back button as…

SuRaj Creator
- 945
- 1
- 9
- 25
9
votes
1 answer
How do I test the fallback component for the ErrorBoundary?
I have this component:
import React, { lazy, Suspense } from 'react';
import { ErrorBoundary } from '../ErrorBoundary';
const FALLBACK = ;
const ERROR = (
5
votes
2 answers
React Error Boundary Intermittently masking error with generic error message
We are testing React error boundaries within our application. Currently, we are seeing the React error boundary intermittently mask the error with the following:
"An error was thrown inside one of your components, but React doesn't know what it was.…

Brennan Mann
- 1,467
- 2
- 17
- 26
5
votes
0 answers
How to hide React-Error-Boundary console errors in jest
From the react docs on Error Boundaries:
React 16 prints all errors that occurred during rendering to the
console in development, even if the application accidentally swallows
them.
Due to the above I am getting loads of unnecessary console errors…

wolfe111
- 51
- 2
5
votes
0 answers
Wrap entire app in single ErrorBoundary (react-error-boundary)
We have an App.js file in React, and I would like to add an error boundary that wraps around the majority of routes. The App.js file broadly looks like this:
import { ErrorBoundary } from 'react-error-boundary';
function ErrorFallback({ error })…

Canovice
- 9,012
- 22
- 93
- 211
5
votes
1 answer
React.js Log all GraphQL queries in Sentry
I have a React application which I've surrounded with an ErrorBoundary that sends errors to Sentry and it works fine. I would like to log all my GraphQL query errors into Sentry as well but my problem now is for all my GraphQL queries, I have a…

digiwebguy
- 460
- 1
- 8
- 20
4
votes
2 answers
React-router stops working when error boundary catches an error in route
The codepen linked to below, uses react-router and an error boundary to catch errors within each route.
If you click on "Shop", the error is caught as expected, but the other links then no longer works. What's going on here? Why does…

Svish
- 152,914
- 173
- 462
- 620
3
votes
2 answers
React - Error boundary not catching error
I have a component where I am fetching mock data. I am doing a query by using react-query with Suspense. I was following their docs. This is the component:
export const WorkHistory = () => {
const { caseId } = useContext();
const { api:…

Leff
- 1,968
- 24
- 97
- 201
3
votes
1 answer
Using React error boundary with react router
We are trying to use react-error-boundary with react-router (v6) but seems like we need to wrap every route element with an error boundary as shown below
import { ErrorBoundary } from "react-error-boundary";
export const AppRoutes =…

user3205479
- 1,443
- 1
- 17
- 41
3
votes
1 answer
React Error Boundary does not catch errors
I have my react app created from vite and there I have my Custom React Error Boundary Component wrap from Components the thing is it cannot catch errors.i debug my error component but it cannot recieve any value in getDerivedStateFromError not…

Sikander Ahmad
- 45
- 1
- 6
3
votes
1 answer
How to catch uncaught errors in React ErrorBoundary
I have been using react.lizy alongside ErrorBoundary but there's a weird case I want to solve, whenever I have an error that ErrorBoundary catches and I handle the UI there's a logged "uncaught error" in the console!
My example follows a similar…

adabuyaman
- 107
- 1
- 10
3
votes
0 answers
ErrorBoundary replaces current content with fallbackRender instead of adding it on top
I'm trying to display a banner with an error message on top of the page/component that's throwing the error. The error is triggered by an API call, so I'm using both the hook and the component from react-error-boundary.
I can catch the error and…

Sania García
- 71
- 5
3
votes
1 answer
How to get React Error Boundary to reset state with Try Again button?
My Pokemon application is using the following libraries: React Hook Form, React Query, and React Error Boundary.
When a request hasn't been made, it will should render No Pokemon Yet, Please Submit a Pokemon. When an error occurs, a Try Again button…

ln09nv2
- 965
- 4
- 19
- 35