dispatch "error" events after mounting

Author: Sean Wilson

src/lib/SchemaForm.svelte

@@ -1,14 +1,14 @@
 <script lang="ts">
   import 'core-js/actual/structured-clone';
   import type { JSONSchema7Definition } from "json-schema";
-  import { createEventDispatcher } from 'svelte';
   import DownloadOptions, { type DataTransform } from './DowloadOptions';
   import UISchema from "./UISchema";
   import JsonSchemaDereferencer from "@json-schema-tools/dereferencer";
   import Ajv, { type ValidateFunction } from "ajv";
   import ajvFormats from "ajv-formats";
   import mergeAllOf from "json-schema-merge-allof";
   import Paper, { Title, Subtitle, Content } from '@smui/paper';
+  import createMountedEventDispatcher from './createMountedEventDispatcher';
   import ObjectProps from "./controls/ObjectProps.svelte";
   import Control from "./Control.svelte";
   import ValidationError from "./ValidationError";
@@ -19,7 +19,7 @@
   export let data: { [prop: string]: any } = {};
   export let uischema: UISchema = {};
 
-  const dispatch = createEventDispatcher();
+  const dispatch = createMountedEventDispatcher();
   /* A bit of a hack - When bulding the static test site, the dereferencer is still behind a
    * `.default` property for some reason. I'm guessing it has something to do with how modules are
    * imported during the svelte build process. When running in browser, it appears to be imported

src/lib/createMountedEventDispatcher.ts

@@ -0,0 +1,30 @@
+import { createEventDispatcher, onMount } from 'svelte';
+
+type EventDispatcher<EventMap extends {} = any> = ReturnType<typeof createEventDispatcher<EventMap>>;
+type EventDispatcherhArgs<EventMap extends {} = any> = Parameters<EventDispatcher<EventMap>>;
+
+/**
+ * Created an event dispatcher with Svelte's `createEventDispatcher` that will queue events until the component is mounted.
+ */
+export default function createMountedEventDispatcher<EventMap extends {} = any>(): EventDispatcher<EventMap> {
+  let mounted = false;
+  const dispatchOnMount: EventDispatcherhArgs<EventMap>[] = [];
+  const dispatch = createEventDispatcher();
+
+  onMount(() => {
+    mounted = true;
+    dispatchOnMount.forEach(args => {
+      dispatch(...args);
+    });
+  });
+
+  return (...args: EventDispatcherhArgs<EventMap>) => {
+    if (mounted) {
+      return dispatch(...args);
+    }
+    else {
+      dispatchOnMount.push(args);
+      return false;
+    }
+  };
+}