Migrate to `package:web`

[navaronbracke]

This issue is a proposal to migrate from dart:html to package:web.

This would unblock migrating google_maps_flutter_web in https://github.com/flutter/packages/pull/5254

[a14n]

The migration will not be a little task and I'd prefer that package:web 0.3.0 was not in preview and not with a This package is highly experimental warning. That being said I'll try to find time to take a look. Is there some doc somewhere about this new package:web (and the underlying js-interop) ? /ping @kevmoo

[kevmoo]

We don't have docs...yet. We're holding off because we're waiting on extension types to start encouraging migrations.

Look at this diff for inspiration, though: https://github.com/flutter/packages/compare/main...pkg_web_wip

[kevmoo]

You'll HAVE to do a branch – or depend on a dev SDK to do the migration.

Another option is to wait for the next Dart release!

[johnpryan]

I made a branch with some small tweaks to get the script running, but the generated code has a lot of errors:

https://github.com/a14n/dart-google-maps/compare/master...johnpryan:dart-google-maps:pkg_web

@a14n have you had time to look at this lately?

[a14n]

Not really for now but I just recover my setup and I will try to take a look soon (hopefully in the coming days/weeks)

[a14n]

I just pushed a branch package-web containing the lib/ folder migrated to package:web. The example folder migration is in progress but you can already try the lib now.

The generator tool is not yet updated to use package:web instead of dart:html.

In the future I also plan to use static js interop but it requires more work so it is likely that this will not happen soon.

Side note about this migration : it was not obvious how to pass a JSFunction required by some functions like getCurrentLocation. I finally used a simple cast () {} as JSFunction that seems to work but that looks quite strange to me.

[navaronbracke]

@a14n You can make a JSFunction out of a Dart function using:

import 'dart:js_interop'
import 'package:js/js.dart';

allowInterop((arg) {
  // ...
}).toJS

where the arg is a JS type accepted by the compiler (so all the primitives: String, bool, int, double, null, and also JS types JSArray, JSObject, JSAny)

If you have a JSFunction and you need to call it in Dart, use the callAsFunction() method https://api.flutter.dev/flutter/dart-js_interop/JSFunctionUtilExtension/callAsFunction.html

[a14n]

I just push a 7.0.0-beta.1 version on pub you can use. Let me know when you test it and validate. Then I'll publish a 7.0.0.

[navaronbracke]

I updated the mentioned branch to run with 7.0.0-beta.1 and the google_maps_flutter_web integration tests pass locally for me. So I think you can release it?

[navaronbracke]

@a14n All the integration tests for google_maps_flutter_web pass locally for me. I think that is a good sign to publish google_maps: 7.0.0.

[a14n]

google_maps-7.0.0 is now published.