dart-lang / web

Lightweight browser API bindings built around JS static interop.
https://pub.dev/packages/web
BSD 3-Clause "New" or "Revised" License
132 stars 23 forks source link

`JSImmutableListWrapper` should index using `[]` instead of `.item` #316

Open Gustl22 opened 1 day ago

Gustl22 commented 1 day ago

The HTMLVideoElement textTracks / TextTrackList, audioTracks / AudioTrackList ,videoTracks / VideoTrackList are not iterable. This is a regression comparing to the dart:html directive.

https://api.flutter.dev/flutter/dart-html/TextTrackList-class.html https://pub.dev/documentation/web/latest/web/TextTrackList-extension-type.html

The consequence is, that we cannot return a list of available tracks, as the list is basically not accessible. The method getTrackById is only searching the tracks by their DOM id (as far as I understood).

All these track lists should implement some form of iterable.

srujzs commented 1 day ago

There are [] and length members on these types, so you can still access the tracks by iterating over it e.g.

for (var i = 0; i < textTracks.length; i++) {
  print(textTracks[i]);
}

There's a small Dart list wrapper we use for many other list types to make it more ergonomic, but it looks like TrackLists use [] and not item. Resolving this could be to pass a flag telling that class to use [] to index and not item.

Note that this wrapper can never emulate the exact semantics of dart:html, as we mix the definition and the list interface into one definition there.

Gustl22 commented 1 day ago

The operator [] is not available. And this would also make me wonder because the definition does not inherit anything regarding to itarables: extension type TextTrackList._(JSObject _) implements EventTarget, JSObject. So where should it come from.

grafik

It does have a length getter indeed. The docs are incorrect media.TextTracks[n] doesn't work, so I think it was just forgotten to be added.

srujzs commented 1 day ago

You'll likely need to update your pubspec version to at least v1.1.0: https://github.com/dart-lang/web/blob/d3a61aa9b4e43cdaf949a69c159038cdecf5681a/web/lib/src/dom/html.dart#L3983. external indexing operators can be defined either in interop extension types or in extensions on one: https://dart.dev/interop/js-interop/usage#interop-type-members

Gustl22 commented 1 day ago

You are right, the template for plugins was created with an old compatiblity of the web dependency. I created a PR in flutter. Thank you and sorry for wasting your time!

Gustl22 commented 22 hours ago

There's a small Dart list wrapper we use for many other list types to make it more ergonomic, but it looks like TrackLists use [] and not item.

Thank you for the hint and indeed, it would be good to have such a wrapper for all lists. As far as I understood, there is a common TS/JS type for iterables based on []: https://github.com/microsoft/TypeScript/pull/24669

This enables the helper to just use the [] operator (instead of the .item) which should be available for every class (in contrast to the .item operator).

srujzs commented 21 hours ago

This enables the helper to just use the [] operator (instead of the .item) which should be available for every class (in contrast to the .item operator).

Nice! It does look like that may be the case (I'll need to double-check but your linked PR gives me more confidence). I'll rename this bug to reflect tracking this change.

Edit: Alas, it may not be true for CSSStyleDeclarations. I haven't checked through every list type in this package, but it looks like that may be the anomaly. We could of course try [] first, and if that doesn't work, do item.

Gustl22 commented 18 hours ago

Thank you! Yes, this should be double-checked, I'm no expert in TS ^^