Exceptions throw in hooks are now handled properly by onError.

Fixes #292

Author: ciscoheat

CHANGELOG.md

@@ -16,6 +16,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 - Tainted fields were set to undefined when not needed, unwantingly triggering client-side validation.
 - Schema transformations now updates the form data depending on input type. Checkboxes, radio buttons and selects updates the data immediately. Other inputs waits until blurred. ([#298](https://github.com/ciscoheat/sveltekit-superforms/issues/298))
 - In [SPA mode](https://superforms.rocks/concepts/spa), the `novalidate` attribute now only disables the browser validation constraints, not the entire client-side validation. ([#297](https://github.com/ciscoheat/sveltekit-superforms/discussions/297))
+- Exceptions throw in hooks are now handled properly by `onError`. Status will always be 500 though. ([#292](https://github.com/ciscoheat/sveltekit-superforms/issues/292))
 
 ## [1.11.0] - 2023-11-28
 

src/hooks.server.ts

@@ -0,0 +1,14 @@
+import { error, type Handle } from '@sveltejs/kit';
+
+export const handle: Handle = async ({ event, resolve }) => {
+  if (
+    event.request.method === 'POST' &&
+    event.request.url.includes('?throw-hooks-error')
+  ) {
+    throw error(403, {
+      message: 'Hooks error'
+    });
+  }
+
+  return await resolve(event);
+};

src/lib/client/formEnhance.ts

@@ -13,7 +13,11 @@ import {
 import type { z, AnyZodObject } from 'zod';
 import { stringify } from 'devalue';
 import type { Entity } from '../schemaEntity.js';
-import type { FormOptions, SuperForm } from './index.js';
+import {
+  defaultOnError,
+  type FormOptions,
+  type SuperForm
+} from './index.js';
 import { clientValidation, validateField } from './clientValidation.js';
 import { Form } from './form.js';
 import { onDestroy } from 'svelte';
@@ -423,7 +427,14 @@ export function formEnhance<T extends AnyZodObject, M>(
     }
 
     async function validationResponse(event: ValidationResponse) {
-      const result = event.result;
+      // Check if an error was thrown in hooks, in which case it has no type.
+      const result: ActionResult = event.result.type
+        ? event.result
+        : {
+            type: 'error',
+            status: 500,
+            error: event.result
+          };
 
       currentRequest = null;
       let cancelled = false;
@@ -505,8 +516,14 @@ export function formEnhance<T extends AnyZodObject, M>(
             if (options.onError !== 'apply') {
               const data = { result, message };
 
-              for (const event of formEvents.onError) {
-                if (event !== 'apply') await event(data);
+              for (const onErrorEvent of formEvents.onError) {
+                if (
+                  onErrorEvent !== 'apply' &&
+                  (onErrorEvent != defaultOnError ||
+                    !options.flashMessage?.onError)
+                ) {
+                  await onErrorEvent(data);
+                }
               }
             }
           }

src/lib/client/index.ts

@@ -159,6 +159,13 @@ export type FormOptions<T extends ZodValidation<AnyZodObject>, M> = Partial<{
   };
 }>;
 
+export const defaultOnError = (event: { result: { error: unknown } }) => {
+  console.warn(
+    'Unhandled Superform error, use onError event to handle it:',
+    event.result.error
+  );
+};
+
 const defaultFormOptions = {
   applyAction: true,
   invalidateAll: true,
@@ -174,12 +181,7 @@ const defaultFormOptions = {
   onResult: undefined,
   onUpdate: undefined,
   onUpdated: undefined,
-  onError: (event: { result: { error: unknown } }) => {
-    console.warn(
-      'Unhandled Superform error, use onError event to handle it:',
-      event.result.error
-    );
-  },
+  onError: defaultOnError,
   dataType: 'form',
   validators: undefined,
   defaultValidator: 'keep',

src/routes/tests/flash-onerror/+page.svelte

@@ -4,6 +4,7 @@
   import * as flashModule from 'sveltekit-flash-message/client';
   import SuperDebug from '$lib/client/SuperDebug.svelte';
   import { schema } from './schema';
+  import { page } from '$app/stores';
 
   export let data: PageData;
 
@@ -17,13 +18,17 @@
       }
     }
   });
+
+  $: action = $page.url.searchParams.has('throw-hooks-error')
+    ? '?throw-hooks-error'
+    : '';
 </script>
 
 <SuperDebug data={{ $form, $errors, $tainted }} />
 
 {#if $message}<h4>{$message}</h4>{/if}
 
-<form method="POST" use:enhance>
+<form method="POST" {action} use:enhance>
   <label>
     Name: <input name="name" bind:value={$form.name} />
     {#if $errors.name}<span class="invalid">{$errors.name}</span>{/if}