Feature: Add Generics to Event target

[TheColorRed]

Suggestion

🔍 Search Terms

• Event target generics

✅ Viability Checklist

My suggestion meets these guidelines:

• This wouldn't be a breaking change in existing TypeScript/JavaScript code
• This wouldn't change the runtime behavior of existing JavaScript code
• This could be implemented without emitting different JS based on the types of the expressions
• This isn't a runtime feature (e.g. library functionality, non-ECMAScript syntax with JavaScript output, new syntax sugar for JS, etc.)
• This feature would agree with the rest of TypeScript's Design Goals.

⭐ Suggestion

This would add the ability to use generics to type the target of an event.

📃 Motivating Example

This would remove the requirement of having to cast it each time you use it or assigning the target to a variable.

function myEvent(evt: KeyboardEvent) {
  // Option "A" save to variable and cast (Still good for large blocks of code)
  const input = evt.target as HTMLInputElement

  // Option "B" cast target every time
  if ((evt.target as HTMLInputElement).value === 'a') {
    // Do something
  } else if ((evt.target as HTMLInputElement).value === 'b') {
    // Do something else
  }
}

💻 Use Cases

With a generic type, you get a cleaner more readable result:

function myEvent(evt: KeyboardEvent<HTMLInputElement>) {
  if (evt.target.value === 'a') {
    // Do something
  } else if (evt.target.value === 'b') {
    // Do something else
  }
}

function myEvent(evt: KeyboardEvent<HTMLInputElement | HTMLDivElement>) {
  if (evt.target instanceof HTMLInputElement && evt.target.value === 'a') {
    // Do something
  } else if (evt.target instanceof HTMLDivElement && evt.target.innerText === 'b') {
    // Do something else
  }
}

[MartinJohns]

The target doesn't has to be the element you attached your event handler onto. TypeScript can't ensure that the generic type argument matches, and generated runtime checks are a no-go.

So the only "benefit" is that you don't have to use the type assertion, which is actually a huge drawback. It shows a wrong sense of safety where there is none.

It would make sense for currentTarget tho, which is why #299 exists.

[typescript-bot]

This issue has been marked as "Declined" and has seen no recent activity. It has been automatically closed for house-keeping purposes.