diff --git a/packages/react/src/errorboundary.tsx b/packages/react/src/errorboundary.tsx index 04794f15bd65..109e53116f25 100644 --- a/packages/react/src/errorboundary.tsx +++ b/packages/react/src/errorboundary.tsx @@ -198,7 +198,7 @@ class ErrorBoundary extends React.Component; } +function EffectSpyFallback({ error }: { error: Error }): JSX.Element { + const [counter, setCounter] = useState(0); + + React.useEffect(() => { + setCounter(c => c + 1); + }, []); + + return ( + + EffectSpyFallback {counter} - {error.message} + + ); +} + interface TestAppProps extends ErrorBoundaryProps { errorComp?: JSX.Element; } @@ -101,7 +115,7 @@ describe('ErrorBoundary', () => { it('renders null if not given a valid `fallback` prop function', () => { const { container } = render( // @ts-expect-error Passing wrong type on purpose - 'Not a ReactElement'}> + undefined}> , ); @@ -118,6 +132,15 @@ describe('ErrorBoundary', () => { expect(container.innerHTML).toBe('

Error Component

'); }); + it('renders a fallback that can use react hooks', () => { + const { container } = render( + + + , + ); + expect(container.innerHTML).toBe('EffectSpyFallback 1 - boom'); + }); + it('calls `onMount` when mounted', () => { const mockOnMount = jest.fn(); render(