[web] Add views proxy and getInitialData.

[ditman]

Adds a Dart API so Application/Plugin programmers can retrieve the initialData configuration value that may be passed when adding a view from JS in a multiViewEnabled app.

When adding a view to an app like this:

flutterApp.addView({
  hostElement: someElement,
  initialData: {
    randomUUID: globalThis.crypto.randomUUID(),
  }
});

initialData can be accessed from Dart by defining a JS-interop class like:

import 'dart:js_interop';

// The JS-interop definition of the `initialData` object passed to the views of this app.
@JS()
@staticInterop
class InitialData {}

/// The attributes of the [InitialData] object.
extension InitialDataExtension on InitialData {
  external String? get randomUUID;
}

And then, from the code of the application:

...
  Widget build(BuildContext context) {
    final int viewId = View.of(context).viewId;
    final InitialData? data = ui_web.views.getInitialData(viewId) as InitialData?;
    return Text('${data?.randomUUID}');
  }
...

Testing

Will add unit tests once naming is sorted out :)

Pre-launch Checklist

• I read the Contributor Guide and followed the process outlined there for submitting PRs.
• I read the Tree Hygiene wiki page, which explains my responsibilities.
• I read and followed the Flutter Style Guide and the C++, Objective-C, Java style guides.
• I listed at least one issue that this PR fixes in the description above.
• I added new tests to check the change I am making or feature I am adding, or the PR is test-exempt. See testing the engine for instructions on writing and running engine tests.
• I updated/added relevant documentation (doc comments with ///).
• I signed the CLA.
• All existing and new tests are passing.

If you need help, consider asking for advice on the #hackers-new channel on Discord.

[wanjm]

beside web, other platform should also need to get the initData, can we add a property to FlutterView?

[ditman]

beside web, other platform should also need to get the initData, can we add a property to FlutterView?

@wanjm please, create a new issue with a feature request so @goderbauer knows you want this too for other platforms (what other platforms?).

If the framework ever supports initialData or similar, we'll harmonize the web implementation to match the framework API. For now this is only supported on the web, and in multi-view mode, and so the API lives in web-only specific bits.

[mdebbar]

Before we add official APIs for initial data, I still would like us to explore without it. Here's an example of how I could see this done:

Let's have a getViewOptions API:

// Of course, we would need to make `JsFlutterViewOptions` public thru `dart:ui_web`.
JsFlutterViewOptions? getViewOptions(int viewId) {
  return _viewManager.getOptions(viewId);
}

And then users can define their custom JsFlutterViewOptions implementation:

import 'dart:js_interop';
import 'dart:ui_web' as ui_web;

// The JS-interop definition of the view options object passed when creating a flutter view.
@JS()
@staticInterop
// I'm not sure if `extends` or `implements` is better here.
class MyJsFlutterViewOptions implements ui_web.JsFlutterViewOptions {}

extension MyJsFlutterViewOptionsExtension on MyJsFlutterViewOptions {
  // Users can put properties directly here
  external String? get randomUUID;

  // or package everything into an `initialData` property
  external MyJsInitialData get initialData;
}

This way, users also get access to the view's hostElement, sizeConstraints, etc.

[ditman]

See @loic-sharma's review here:

• [Multi view] Allow runner app to pass initial data to a view flutter#140855 (comment)

[mdebbar]

After giving it some more thought, I'm not opposed to having an API for initialData. It makes the feature easily discoverable by new users and makes documentation straightforward.

[ditman]

Adding some unit tests and prepping to land this.

[ditman]

I think this is ready to go, PTAL @mdebbar!

[mdebbar]

LGTM!

[mdebbar]

is as JSAny? necessary? I would expect this to work:

Suggested change

	return _viewManager.getOptions(viewId)?.hostElement as JSAny?;
	return _viewManager.getOptions(viewId)?.hostElement;

[ditman]

analyzer is not happy without the cast:

A value of type 'DomElement?' can't be returned from the method
'getHostElement' because it has a return type of 'JSAny?'.
(return_of_invalid_type)

(It's the same if I make the return a JSObject?)

[albertolina]

Hello! Is this feature already live? I can't seem to find any docs on it. Thanks

[ditman]

I can't seem to find any docs on it.

@albertolina It's been pushed to flutter master so it can be validated by some internal customers, but it hasn't been announced or documented yet, so: patience please!

[albertolina]

Thank you for clarifying @ditman! Much appreciated