microsoft / microsoft/TypeScript

Event of type `"error"` incorrectly typed as ErrorEvent even when it's not actually ErrorEvent in practice

Offen
#54,040 4 Kommentare 0 Reaktionen 0 zugewiesene Personen Auf GitHub ansehen

Dieses Issue hat noch niemand übernommen.

Awaiting More Feedback Suggestion
Vorherrschende Sprache
Go
Sterne
111k
Forks
14.4k
Ø Merge
1 T. 19 Std.
Gemergte PRs (30 T.)
117

Beschreibung

Bug Report

🔎 Search Terms

ErrorEvent error capture

🕗 Version & Regression Information

This is the behavior in every version I tried, and I reviewed the FAQ for entries about events

⏯ Playground Link

Playground link with relevant code

💻 Code
const scriptElement = document.createElement('script');
scriptElement.addEventListener('error', event => {
  console.log(`1. script element error event constructor: ${event.constructor.name}`);
});
scriptElement.src = 'https://example.com/nonExistentScript.js';

const linkElement = document.createElement('link');
linkElement.addEventListener('error', event => {
  console.log(`2. link element error event constructor: ${event.constructor.name}`);
});
linkElement.rel = 'stylesheet';
linkElement.href = 'https://example.com/nonExistentStylesheet.css';

window.addEventListener('error', event => {
  console.log(`3. window error event constructor: ${event.constructor.name}`);
});

window.addEventListener('error', event => {
  console.log(`4. window error (with capture) event constructor: ${event.constructor.name}`);
}, {
  capture: true
});

document.head.appendChild(scriptElement);

document.head.appendChild(linkElement);

throw new Error('Uncaught Error');
🙁 Actual behavior

For the above code, the TypeScript compiler types each event callback parameter as ErrorEvent, even though that's not always the type at runtime

Note that the linked playground doesn't show the log messages for the uncaught Error case; here's the full log output:

3. window error event constructor: ErrorEvent
4. window error (with capture) event constructor: ErrorEvent
4. window error (with capture) event constructor: Event
2. link element error event constructor: Event
4. window error (with capture) event constructor: Event
1. script element error event constructor: Event
🙂 Expected behavior

I don't know enough about the DOM "error" event to know what a complete solution would be, but ideally, in the code above, I guess the type for event would be:

  1. Event
  2. Event
  3. ErrorEvent (assuming window non-capture event dispatches of type "error" are always ErrorEvent, which I don't know)
  4. ErrorEvent | Event

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 dem verlinkten TypeScript Playground und den beteiligten DOM-"error"-Event-Listener-Typisierungen in den Beispielen. Vergleiche die inferierten Callback-Parametertypen mit den zur Laufzeit protokollierten Konstruktoren für Script-, Link- und Window-Events und stelle anschließend sicher, dass die resultierenden Typen diese Fälle korrekt darstellen.

Vom Indexierungsmodell aus dem Issue-Text verfasst.

Bewertung

Tech-Stack
javascript, typescript
Bereich
frontend, web-dev
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.