microsoft / microsoft/TypeScript

Generic typing used for "input" event listeners

Open
#54,336 3 comments 2 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

Domain: lib.d.ts Help Wanted Possible Improvement
Dominant language
Go
Stars
111k
Forks
14.3k
Avg merge
1d 19h
Merged PRs (30d)
117

Description

# 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.

Contributor guide

Open the contributing guide

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Start with the addEventListener typings exercised by the provided TypeScript Playground code for HTMLInputElement and HTMLTextAreaElement. Determine how the input event should be typed for these elements while preserving Event for other elements, then verify the example compiles and the broader contenteditable behavior is covered.

Written by the indexing model from the issue text.

Assessment

Tech stack
typescript
Domain
frontend
Issue type
Bug
Difficulty
4/5
Estimated time
3-5 days
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
35/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.