ErrorBoundary fallback renders twice #440
Comments
andreiborza
added a commit
to getsentry/sentry-javascript
that referenced
this issue
Jun 10, 2024
To automatically capture exceptions from inside a component tree and
render a fallback component, wrap the native Solid
JS `ErrorBoundary` component with `Sentry.withSentryErrorBoundary`.
```js
import * as Sentry from '@sentry/solidjs';
import { ErrorBoundary } from 'solid-js';
Sentry.init({
dsn: '__PUBLIC_DSN__',
tracesSampleRate: 1.0, // Capture 100% of the transactions
});
const SentryErrorBoundary = Sentry.withSentryErrorBoundary(ErrorBoundary);
render(
() => (
<SentryErrorBoundary fallback={err => <div>Error: {err.message}</div>}>
<ProblematicComponent />
</SentryErrorBoundary>
),
document.getElementById('root'),
);
```
**Note**: When using an `ErrorBoundary` in conjunction with Solid
Router, the fallback component renders twice, see
[here](solidjs/solid-router#440).
billyvg
pushed a commit
to getsentry/sentry-javascript
that referenced
this issue
Jun 10, 2024
To automatically capture exceptions from inside a component tree and
render a fallback component, wrap the native Solid
JS `ErrorBoundary` component with `Sentry.withSentryErrorBoundary`.
```js
import * as Sentry from '@sentry/solidjs';
import { ErrorBoundary } from 'solid-js';
Sentry.init({
dsn: '__PUBLIC_DSN__',
tracesSampleRate: 1.0, // Capture 100% of the transactions
});
const SentryErrorBoundary = Sentry.withSentryErrorBoundary(ErrorBoundary);
render(
() => (
<SentryErrorBoundary fallback={err => <div>Error: {err.message}</div>}>
<ProblematicComponent />
</SentryErrorBoundary>
),
document.getElementById('root'),
);
```
**Note**: When using an `ErrorBoundary` in conjunction with Solid
Router, the fallback component renders twice, see
[here](solidjs/solid-router#440).
|
Looks like issue is also closed by #442. I will have a release out shortly. |
|
Can confirm, it's fixed! |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Describe the bug
The ErrorBoundary fallback component renders twice when using solid router and navigating to a route that has an ErrorBoundary with an error.
Your Example Website or App
https://codesandbox.io/p/devbox/nameless-forest-45lzdm?file=%2Fsrc%2Findex.tsx%3A11%2C35
Steps to Reproduce the Bug or Issue
Go to errorlinkExpected behavior
Error should only be logged out once but is logged out twice.
Screenshots or Videos
CleanShot.2024-06-07.at.12.18.46.mp4
Platform
Additional context
Possibly related to: solidjs/solid#1586
The text was updated successfully, but these errors were encountered: