Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

FallbackComponent not rendering

See original GitHub issue

Relevant code:

function ErrorFallback({ error }) {
		return (
			<div role="alert">
				<p>Something went wrong:</p>
				<pre style={{ color: "red" }}>{error.message}</pre>

	return (
				onReset={() => window.sessionStorage.clear()}
				onError={(error) => {
                            <button onClick={( ) => {throw new Error("Testing with an error")}}>Error thrower</button>

When I click on the button that triggers an error the FallbackComponent doesn’t render, even though the error gets logged(onError recognises it). Am I missing something?

Issue Analytics

  • State:open
  • Created 2 years ago
  • Reactions:3
  • Comments:5

github_iconTop GitHub Comments

JaedeokKcommented, Jan 17, 2022

error boundary doesn’t catch error in event handler, if you want catch error in event handler try to use useErrorHandler hook.

GideonMaxcommented, Jul 28, 2022

@JonhnyDev Can you provide the code for the child component that’s throwing the error that doesn’t get caught by the error boundary?

Read more comments on GitHub >

github_iconTop Results From Across the Web

Error boundary fallback ui not rendering in react?
The componentDidCatch not firing. I expected that the fallback UI will render but actually the original UI is still there and nothing is ......
Read more >
Fallback component not shown · Issue #116 - GitHub
Fallback component not shown #116 ... import React, { Component, useState, useEffect } from 'react'; import { render } from 'react-dom'; ...
Read more >
Blank Thoughts: exercise 7 (fallback component not rendering ...
Hi guys I`ve got in trouble with exercise seven: <ErroBoundary FallbackComponent={(props) => { return <FallbackUI {...props} newProp={"foo"} ...
Read more >
How to use Error Boundaries with Fallback UI in React - Medium
Error boundaries catch errors during rendering, in lifecycle methods, and in constructors of the whole tree below them.
Read more >
Error Boundaries - React
Component ; static getDerivedStateFromError(error) { ; // Update state so the next render will show the fallback UI. ; return { hasError: true...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Post

No results found

github_iconTop Related Hashnode Post

No results found