fix(dispatchEvent)!: change signature of dispatchEvent

Author: plusgut

src/index.ts

@@ -180,18 +180,23 @@ export function findParent<T = Element>(
 export function dispatchEvent<
   T extends HTMLElement,
   U extends keyof CustomEvents<T>,
->(target: T, eventName: U, detail: CustomEvents<T>[U]): Promise<unknown>[] {
+>(
+  target: T,
+  eventName: U,
+  customEventInit: CustomEventInit<CustomEvents<T>[U]>,
+): {
+  promises: Promise<unknown>[];
+  customEvent: CustomEvent<CustomEvents<T>[U]>;
+} {
   const previousEventPromises = active.eventPromises;
   const eventPromises: Promise<unknown>[] = [];
   active.eventPromises = eventPromises;
-
-  target.dispatchEvent(
-    new CustomEvent(eventName as string, { detail: detail }),
-  );
+  const customEvent = new CustomEvent(eventName as string, customEventInit);
+  target.dispatchEvent(customEvent);
 
   active.eventPromises = previousEventPromises;
 
-  return eventPromises;
+  return { promises: eventPromises, customEvent };
 }
 
 export function prop() {

test/async.test.tsx

@@ -30,7 +30,9 @@ describe("webcomponent", () => {
               onclick={async () => {
                 this.#loading.value = true;
                 try {
-                  await Promise.all(dispatchEvent(this, "foo", null));
+                  await Promise.all(
+                    dispatchEvent(this, "foo", { detail: null }).promises,
+                  );
                 } catch (_err) {}
                 this.#loading.value = false;
               }}

test/events.test.tsx

@@ -36,7 +36,11 @@ describe("webcomponent", () => {
       class NestedComponent extends HTMLElement {
         onfoo: (evt: CustomEvent<string>) => void;
         render(this: NestedComponent) {
-          return <button onclick={() => dispatchEvent(this, "foo", "mep")} />;
+          return (
+            <button
+              onclick={() => dispatchEvent(this, "foo", { detail: "mep" })}
+            />
+          );
         }
       },
     );