Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
4 changes: 2 additions & 2 deletions components/ErrorBoundary.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,7 @@ import React, { Component, ErrorInfo, ReactNode } from 'react';

interface Props {
children?: ReactNode;
fallback?: (error: Error, reset: () => void) => ReactNode;
fallback?: (error: Error, retry: () => void, reset: () => void) => ReactNode;
onError?: (error: Error, errorInfo: ErrorInfo) => void;
}

Expand Down Expand Up @@ -108,7 +108,7 @@ export class ErrorBoundary extends Component<Props, State> {
}

if (this.props.fallback) {
return this.props.fallback(this.state.error!, this.reset);
return this.props.fallback(this.state.error!, this.retry, this.reset);
}

return React.createElement('div', { className: 'flex items-center justify-center min-h-[200px]' },
Expand Down
4 changes: 2 additions & 2 deletions components/Navbar.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -67,10 +67,10 @@ export function Navbar() {
undefined value in a widget's state hook) shouldn't blank the
whole header, just fall back to a compact retry (fixes #191). */}
<ErrorBoundary
fallback={(_error, reset) => (
fallback={(_error, retry) => (
<button
type="button"
onClick={reset}
onClick={retry}
className="text-xs text-gray-400 hover:text-black dark:hover:text-white underline"
>
Reload wallet controls
Expand Down
56 changes: 56 additions & 0 deletions components/__tests__/ErrorBoundary.test.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -95,6 +95,62 @@ describe('ErrorBoundary (issue #92 regression)', () => {
expect(container.textContent).toContain('Too many errors');
});

it('preserves errorCount and trips the circuit breaker when retrying via a custom fallback', () => {
// Render custom fallback with Bomb throwing
act(() => {
root.render(
React.createElement(
ErrorBoundary,
{
fallback: (_err, retry) =>
React.createElement('button', { onClick: retry }, 'Custom Reload'),
},
React.createElement(Bomb, { shouldThrow: true }),
),
);
});

// 1st error occurred on initial render. Click custom retry button MAX_ERROR_COUNT - 1 times.
for (let i = 1; i < MAX_ERROR_COUNT; i++) {
const button = container.querySelector('button');
expect(button?.textContent).toBe('Custom Reload');
act(() => {
button!.dispatchEvent(new MouseEvent('click', { bubbles: true }));
});
}

// After MAX_ERROR_COUNT total errors, the circuit breaker should trip instead of displaying custom fallback.
expect(container.textContent).toContain('Too many errors');
});

it('resets errorCount when custom fallback explicitly invokes reset', () => {
act(() => {
root.render(
React.createElement(
ErrorBoundary,
{
fallback: (_err, _retry, reset) =>
React.createElement('button', { onClick: reset }, 'Full Reset'),
},
React.createElement(Bomb, { shouldThrow: true }),
),
);
});

// Clicking reset clears errorCount each time, preventing the circuit breaker from tripping.
for (let i = 0; i < MAX_ERROR_COUNT + 2; i++) {
const button = container.querySelector('button');
expect(button?.textContent).toBe('Full Reset');
act(() => {
button!.dispatchEvent(new MouseEvent('click', { bubbles: true }));
});
}

// Should still show custom fallback, not circuit breaker
expect(container.textContent).toContain('Full Reset');
expect(container.textContent).not.toContain('Too many errors');
});

it('does not throw when an unhandled promise rejection is observed', () => {
const onError = vi.fn();
act(() => {
Expand Down
Loading