microsoft / microsoft/TypeScript

Generic typing used for "input" event listeners

Offen
#54,336 3 Kommentare 2 Reaktionen 0 zugewiesene Personen Auf GitHub ansehen

Dieses Issue hat noch niemand übernommen.

Domain: lib.d.ts Help Wanted Possible Improvement
Vorherrschende Sprache
Go
Sterne
111k
Forks
14.3k
Ø Merge
1 T. 19 Std.
Gemergte PRs (30 T.)
117

Beschreibung

# Bug Report

🔎 Search Terms

typescript input event
ts InputEvent
typescript addEventListener("input",

🕗 Version & Regression Information

I just found it today but verified it was present back to 3.3.3333
I also verified it existed on nightly

Please keep and fill in the line that best applies:

This is the behavior in every version I tried, and I reviewed the FAQ for entries about... I looked at entries about event listeners, HTML element types, and callbacks.

⏯ Playground Link

Demo Playground Link

💻 Code
// Error on the typing of the event parameter
(null as any as HTMLInputElement).addEventListener("input", (e: InputEvent) => {});
(null as any as HTMLTextAreaElement).addEventListener("input", (e: InputEvent) => {});
🙁 Actual behavior

The sample code fails to compile because the input event is always typed as an Event, not InputEvent.

🙂 Expected behavior

For most elements, the callback event should be Event, but for <textarea> and <input>, it should be InputEvent.

According to MDN

For <textarea> and elements that accept text input (type=text, type=tel, etc.), the interface is InputEvent; for others, the interface is Event.

According to the W3C spec, it should be InputEvent for any element that is contenteditable. I don't know that you can trigger an input event on other non-contenteditable elements so perhaps the event type can be made InputEvent, regardless of the element type it is called on.

Beitragsleitfaden

Beitragsleitfaden öffnen

Erste Schritte

  1. Lies das ganze Issue und danach den Beitragsleitfaden des Projekts.
  2. Schreib ins Issue, dass du es übernimmst — das erspart doppelte Arbeit.
  3. Forke das Repository und arbeite in einem Branch.
  4. Öffne einen Pull Request, der die Issue-Nummer nennt.

Rechercherichtung

Beginne mit den addEventListener-Typings, die durch den bereitgestellten TypeScript Playground-Code für HTMLInputElement und HTMLTextAreaElement getestet werden. Ermittle, wie das input event für diese Elemente typisiert werden sollte, wobei Event für andere Elemente erhalten bleibt, und überprüfe anschließend, dass das Beispiel kompiliert und das umfassendere contenteditable-Verhalten abgedeckt ist.

Vom Indexierungsmodell aus dem Issue-Text verfasst.

Bewertung

Tech-Stack
typescript
Bereich
frontend
Issue-Typ
Bug
Schwierigkeit
4/5
Geschätzter Aufwand
3-5 Tage
Aktivitätsstatus
Veraltet
Klarheit
Größtenteils klar
Anfängerfreundlichkeit
35/100

Neue Issues direkt in Ihr Postfach

Eine kurze Übersicht über anfängerfreundliche GitHub-Issues.