Kann CustomEvent nicht als Event hinzufügen

[Schwer5]

document.addEventListener('hello', output); gibt mir den Fehler [{ "resource": "/Users/piaschwer/Documents/GitHub/EIA2_SoSe_22-23/A02_EventInspector/EventInspector.ts", "owner": "typescript", "code": "2769", "severity": 8, "message": "No overload matches this call.\n Overload 1 of 2, '(type: keyof DocumentEventMap, listener: (this: Document, ev: Event | MouseEvent | UIEvent | AnimationEvent | InputEvent | ... 13 more ... | ClipboardEvent) => any, options?: boolean | ... 1 more ... | undefined): void', gave the following error.\n Argument of type '\"hello\"' is not assignable to parameter of type 'keyof DocumentEventMap'.\n Overload 2 of 2, '(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions | undefined): void', gave the following error.\n Argument of type '(_event: CustomEvent<any>) => void' is not assignable to parameter of type 'EventListenerOrEventListenerObject'.\n Type '(_event: CustomEvent<any>) => void' is not assignable to type 'EventListener'.\n Types of parameters '_event' and 'evt' are incompatible.\n Type 'Event' is missing the following properties from type 'CustomEvent<any>': detail, initCustomEvent", "source": "ts", "startLineNumber": 18, "startColumn": 9, "endLineNumber": 18, "endColumn": 51 }] https://github.com/Schwer5/EIA2_SoSe_22-23/blob/main/A02_EventInspector/EventInspector.ts

[KohlerAl]

Meiner Erfahrung nach sollte es gehen, wenn im Kopf der Funktion (_event: Event) statt (_event: CustomEvent) steht ... kommt eine andere Fehlermeldung, wenn du nur Event drin stehen hast?

[Schwer5]

Ja, da habe ich dann keine Fehlermeldung mehr. Aber es gibt mir dann in der console auch nichts aus...da habe ich dann nur die drei Klicks.

[KohlerAl]

Wenn du ein custom Event dispatchen möchtest, musst du das immer "von einem HTML Element aus" machen. Also in dem Fall wäre das dein Button, der das event dispatcht :)

[Schwer5]

Habe es jetzt auf button.dispatchEvent(customeventnew) geändert. Aber in der Console gibt es mir trotzdem nur die drei clicks aus

[KohlerAl]

Ich habe grade nochmal nachgeschaut, custom Events bubbeln nicht, wenn man die Eigenschaft nicht explizit auf "true" setzt. Schau mal hier: https://blog.logrocket.com/custom-events-in-javascript-a-complete-guide/

[JirkaDellOro]

Siehe auch das Beispiel in der Lektion https://jirkadelloro.github.io/EIA2-Inverted/L02_Events/#customevents

[Schwer5]

Ahja, danke ! :) Musste mein Button Element auch nochmal in der output suchen & bubbles ist jetzt auf true. Jetzt funktioniert es