microsoft / microsoft/TypeScript

Mixed es5/es2015 code with mixin classes causes runtime errors

Offen
#17,088 15 Kommentare 6 Reaktionen 0 zugewiesene Personen Auf GitHub ansehen

Dieses Issue hat noch niemand übernommen.

Awaiting More Feedback Effort: Moderate Help Wanted Suggestion
Vorherrschende Sprache
Go
Sterne
111k
Forks
14.3k
Ø Merge
1 T. 19 Std.
Gemergte PRs (30 T.)
117

Beschreibung

TypeScript Version: 2.4.1 (but likely anything since 2.2)

When utilising code targeted at ES5 mixed with code targeted at ES6 causes a runtime error when using mixin classes. The real world use case was using a library that was targeted at ES5 for distribution compatibility reasons while downstream code is being targeted at ES2017 because of running in a known limited environment.

Code

Tagged.ts

// @target: es5
export interface Constructor<T> {
    new(...args: any[]): T;
    prototype: T;
}

export default function Tagged<T extends Constructor<{}>>(Base: T) {
    return class extends Base {
        _tag = '';
    }
}

TaggedExample.ts

// @target: es2015
import Tagged from './Tagged';

class Example {
  log() {
    console.log('Hello World!');
  }
}

const TaggedExample = Tagged(Example);

const taggedExample = new TaggedExample(); // Uncaught TypeError: Class constructor Example cannot be invoked without 'new'

Expected behavior:

No run-time errors.

Actual behavior:

A runtime error of Uncaught TypeError: Class constructor Example cannot be invoked without 'new'.

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 Snippets Tagged.ts und TaggedExample.ts und kompiliere sie mit den angegebenen ES5- und ES2015-Zielen, um das erzeugte JavaScript zu untersuchen. Verfolge, wie die ES5-Mixin-Ausgabe die ES2015-Basisklasse aufruft, und füge anschließend eine Regressionstestabdeckung hinzu, die zeigt, dass das Beispiel mit gemischten Zielen ohne einen Laufzeitfehler ausgeführt wird.

Vom Indexierungsmodell aus dem Issue-Text verfasst.

Bewertung

Tech-Stack
javascript, typescript
Bereich
compilers
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.