Add badges for Wasm compatibility

[johnpryan]

Flutter web plugins are currently using dart:html and package:js to wrap JavaScript APIs. The new version of Dart-JavaScript interop will depend on package:web and dart:js_interop, respectively.

This is a proposal to display a "Wasm compatible" badge if the package imports the correct libraries, and "Wasm incompatible" if it is using the old libraries.

cc: @kevmoo @joshualitt

[kevmoo]

We're not quite ready to define the bits here, but it's good to have a placeholder!

[IchordeDionysos]

This should be possible by checking if the package depends on dart:html, dart:js, dart:js_util, or package:js?

Or any other dependency that does not support WASM (e.g. because it or one of its transitive dependencies depend on the above), right?

[kevmoo]

@IchordeDionysos – yep!

[IchordeDionysos]

Hmm, okay, the tricky part is that pub.dev does not know whether the package depends on dart:xxx packages ... https://github.com/flutter/packages/blob/main/packages/video_player/video_player_web/lib/src/video_player.dart#L6

This might have been easily doable (if this was already indexed / available) in the pub.dev database.

[isoos]

Hmm, okay, the tricky part is that pub.dev does not know whether the package depends on dart:xxx packages ...

Not sure if this is a typo or not, so just to be specific about it: pub.dev does package analysis (using package:pana) and part of it is to scan the dependency graph for dart:xxx library uses. We have started analysis for wasm-compatibility with the recent release, however it is not exposed on the UI yet.

[IchordeDionysos]

@isoos Actually, in my assumption, I thought the scan would not detect uses of dart:xxx, so wasn't a typo, just my lack of knowledge.

I came to that conclusion as usages of dart:xxx packages seem to be not exposed in the UI one pub.dev as well and I thought the reason is the data is not available.

e.g. video_player_web uses dart:html: https://github.com/flutter/packages/blob/main/packages/video_player/video_player_web/lib/video_player_web.dart#L6 But it's not listed as a dependency here: https://pub.dev/packages/video_player_web

Definitely nice to hear support for this badge is progressing 🙌

[IchordeDionysos]

however it is not exposed on the UI yet.

There is no filter yet, but this seems to work already 😍 https://pub.dev/packages?q=is%3Awasm-ready At least I can't find the video_player nor video_player_web package :)

If I'm getting too excited too early and the data is not yet fully up-to-date or if there's another reason it has yet to be added, I'm sorry :D

[isoos]

But it's not listed as a dependency here: https://pub.dev/packages/video_player_web

We list only package dependencies on the package page (direct ones in the infobox, direct+transient in the package score tab). It may be useful to also expose the SDK library dependencies (dart:*) too, e.g. using dart:io may or may not be a concern for users of the package, but we don't have any immediate plan to implement these.

There is no filter yet, but this seems to work already

We are still evaluating if the analysis is correct and makes sense.

[isoos]

We are still evaluating if the analysis is correct and makes sense.

Also, almost forgot: if you see something wrong with the tagging (either false positive or false negative), please report it (here or in package:pana).

[IchordeDionysos]

Yeah seen a few where it seemed incorrect, will compile a list.

[amrgetment]

@IchordeDionysos This filter shows image_picker and other packages that still don’t support wasm yet or in-progress https://pub.dev/packages?q=is%3Awasm-ready

image_picker still in-progress https://github.com/flutter/flutter/issues/117022

[amrgetment]

@isoos I think package:pana may need to check for dart:html
dart:js
dart:js_util
package:js in the package or its dependencies like @IchordeDionysos said

[IchordeDionysos]

Definition:

• false positive: Falsely marked as WASM-ready
• false negative: Falsely marked as non-WASM-ready

intl: false positive The package still seems to use dart:html

i18n_extension: false positive Also, packages depending on intl are listed as supported.

flutter_keyboard_visibility: false positive Depends on dart:html

intercom_flutter: false positive Depends on dart:js and dart:html

oauth2_client: false positive: Depends on a flutter_secure_storage which depends on flutter_secure_storage_web which depends on package:js

sensors_plus: false positive: Depends on both dart:html and dart:js_util

uni_links: false positive: Depends on dart:html

fetch_client: false negative ??? There is a pre-release version with WASM support, but still listed as unsupported? I guess that might be expected due to the pre-release

[kevmoo]

Just uploaded https://pub.dev/packages/flutter_markdown – which I think is wasm-ready, but it's not being labeled