-
Notifications
You must be signed in to change notification settings - Fork 4
3 - Svelte playground - add more error triggers #143
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
base: feature/svelte-playground-hawk-catcher
Are you sure you want to change the base?
3 - Svelte playground - add more error triggers #143
Conversation
a240f51 to
505a928
Compare
779f6f4 to
fb8bc3b
Compare
505a928 to
9def40f
Compare
70da4c7 to
5bbf3cf
Compare
477c1ce to
58e8757
Compare
5bbf3cf to
f31904c
Compare
58e8757 to
41876c0
Compare
9f69024 to
b2a5df0
Compare
41876c0 to
7febdcd
Compare
…sveltekit playground
7febdcd to
1812102
Compare
| @@ -0,0 +1,9 @@ | |||
| <script lang="ts"> | |||
| let { shouldError }: { shouldError: boolean } = $props(); | |||
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
No need in $props() & if statement, just do throw
| </div> | ||
| {/snippet} | ||
|
|
||
| <svelte:boundary onerror={handleBoundaryError} failed={fallback}> |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Rendering error report request is not being sent to Hawk Tracker because it intercepted by both onerror and failed.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
The approach here will be to implement customErrorHandler() and change handleBoundaryError() like this:
./+page.svelte:
function handleBoundaryError(error: Error) {
console.error('🟡 [svelte:boundary] Caught rendering error:', error);
customErrorHandler(error);
}
../../../hawk-related:
export let customErrorHandler: (message: Error | string) => void = (message): void => console.error(message);
...(see hoooks.client.ts review)
| let showError = $state(false); | ||
| function triggerError() { | ||
| showError = true; |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Consider open/close behaviour with showError = !showError
| if (import.meta.env.VITE_HAWK_TOKEN) { | ||
| new Hawk({ | ||
| token: import.meta.env.VITE_HAWK_TOKEN, | ||
| }); | ||
| } |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
If implementing customErrorHandler() consider moving this part to ../../../hawk-related & wrapping like this so it could reassign customErrorHandler():
export const initHawk: () => void = () => {
onMount(() => {
if (browser && typeof localStorage !== 'undefined') {
if (import.meta.env.VITE_HAWK_TOKEN) {
const hawk = new Hawk({
token: import.meta.env.VITE_HAWK_TOKEN,
});
customErrorHandler = (message) => hawk.send(message);
}
}
});
};
Call initHawk() in script section of src/+layout.svelte as Hawk uses localStorage API available in browser enviroment only & sveltekit trying to do SSR.
|
|
||
| Example usage: | ||
|
|
||
| ```svelte |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Just so we don't forget to change this
Closes #137
Added error triggers in svelte playground for testing
HawkCatcherintegration.recording_2025-12-24_15.22.21.mp4