microsoft / microsoft/TypeScript

Missing controlsList property in HTMLMediaElement

Offen
#31,532 7 Kommentare 1 Reaktion 0 zugewiesene Personen Auf GitHub ansehen

Dieses Issue hat noch niemand übernommen.

Needs Investigation
Vorherrschende Sprache
Go
Sterne
111k
Forks
14.3k
Ø Merge
2 T. 4 Std.
Gemergte PRs (30 T.)
132

Beschreibung

TypeScript Version: 3.4.0-dev.201xxxxx

Search Terms:

controlsList HTMLMediaElement

Code

const video = $htmlVideoElement as HTMLVideoElement
video.controlsList.value = "nodownload";

Expected behavior:

Works so we can do things as shown https://googlechrome.github.io/samples/media/controlslist.html and as documented by https://developer.mozilla.org/en-US/docs/Web/API/HTMLMediaElement/controlsList

Actual behavior:

controlsList is not valid for HTMLVideoElement

Playground Link:
https://www.typescriptlang.org/play/#src=interface%20HTMLMediaElement%20%7B%0D%0A%20%20%20%20readonly%20controlsList%3A%20DOMTokenList%20%0D%0A%7D%0D%0A%0D%0Aclass%20Greeter%20%7B%0D%0A%20%20%20%20greeting%3A%20string%3B%0D%0A%20%20%20%20constructor(message%3A%20string)%20%7B%0D%0A%20%20%20%20%20%20%20%20this.greeting%20%3D%20message%3B%0D%0A%20%20%20%20%7D%0D%0A%20%20%20%20greet()%20%7B%0D%0A%20%20%20%20%20%20%20%20return%20%22Hello%2C%20%22%20%2B%20this.greeting%3B%0D%0A%20%20%20%20%7D%0D%0A%7D%0D%0A%0D%0Alet%20greeter%20%3D%20new%20Greeter(%22world%22)%3B%0D%0A%0D%0Alet%20video%20%3D%20document.createElement('video')%20as%20HTMLVideoElement%3B%0D%0A%0D%0Avideo.controlsList.value%20%3D%20%22nodownload%22%0D%0A%0D%0Adocument.body.appendChild(video)%3B

Related Issues:
https://github.com/DefinitelyTyped/DefinitelyTyped/issues/19500

Workaround is to add and let the declarations get merged.

declare global {
  interface HTMLMediaElement {
    readonly controlsList: DOMTokenList 
  }
}

Or add an ambient type file

interface HTMLMediaElement {
    readonly controlsList: DOMTokenList;
}

interface DOMTokenList {
    /**
     * Returns the associated set as string.
     * Can be set, to change the associated attribute.
     */
    value: string;
}

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 damit, die Deklarationen von HTMLMediaElement und DOMTokenList zu finden, die vom HTMLVideoElement-Beispiel verwendet werden. Vergleiche die dokumentierte controlsList-API und ihre value-Eigenschaft mit den aktuellen Deklarationen und überprüfe anschließend, dass der bereitgestellte Playground-Code ohne den ambient workaround typgeprüft wird.

Vom Indexierungsmodell aus dem Issue-Text verfasst.

Bewertung

Tech-Stack
typescript
Bereich
frontend
Issue-Typ
Bug
Schwierigkeit
2/5
Geschätzter Aufwand
1-3 Stunden
Aktivitätsstatus
Veraltet
Klarheit
Klar beschrieben
Anfängerfreundlichkeit
45/100

Neue Issues direkt in Ihr Postfach

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