Uncaught TypeError: 'JSArray' is not a subtype of type 'List<ResizeObserverEntry>'

[kevmoo]

@kenzieschmoll commented on Mon Apr 29 2019

I have some resize observer code that looks as follows:

    final observer = html.ResizeObserver(allowInterop((entries, _) {
       _details.uiEventDetails.flameChart.updateForContainerResize();
    }));
    observer.observe(element);

And in the dart2js version of the web app, I am getting a TypeError. I do not get this error when using webdev serve.

Uncaught TypeError: Instance of 'JSArray': type 'JSArray' is not a subtype of type 'List<ResizeObserverEntry>'
    at Object.wrapException (main.dart.js:1115)
    at Object.assertSubtype (main.dart.js:1975)
    at EventDetails_closure.call$2 (main.dart.js:42132)
    at Object.Primitives_applyFunction (main.dart.js:1001)
    at Object.Function_apply (main.dart.js:5440)
    at _callDartFunctionFast (main.dart.js:7374)
    at main.dart.js:7365
    at Function.call$2 (main.dart.js:54318)
    at invokeClosure (main.dart.js:1307)
    at ResizeObserver.<anonymous> (main.dart.js:1325)

---

@rakudrama commented on Mon Apr 29 2019

Can you show more of the code, especially something declared with the list type in question?

JavaScript arrays coming from JS-interop are currently considered by dart2js to implement List<dynamic>, which is not assignable to List<ResizeObserverEntry>.

I don't think this is really a html issue so much as a JS-interop issue.
There is an issue to improve these JS-interop issues:
#35084
And a proposal:
https://github.com/dart-lang/sdk/blob/js_interop/pkg/js/proposal.md

[kevmoo]

@kenzieschmoll @rakudrama – moved to SDK

[kenzieschmoll]

I updated the code snippet to show the entirety of the observer code. entries is not actually used, which is why I left it out originally.

[natebosch]

One thing to note here, the allowInterop call should not be used.

allowInterop is for calls passed to JS() annotated methods. Calls to code in dart:html should not use it.

The problem remains either way.

Opened flutter/devtools#966 to remove unnecessary allowInterop.

[jacob314]

What got lost in the initial bug description is we were writing the code in that strange way to workaround a bug in dart:html.

[natebosch]

What was the bug?

[jacob314]

The dart:html code had a bug where it required a JS function rather than a Dart function. @terrylucas may have fixed that at some point.

[natebosch]

On the original issue, it looks like we fixed some signatures to take List - #33891

Maybe ResizeObserver was missed?

[natebosch]

@jacob314 - The other issue being worked around was #35484 which is resolved

[jacob314]

Ok sounds good.

[morrica]

What is the status of this issue? I have something that looks similiar with the latest dart sdk v2.6.1.
The following code works fine with webdev serve (dartdevc), but fails with webdev build (dart2js).

Code Snippet:

@override
  void ngOnInit() {
    _resizeObserver = ResizeObserver((List<ResizeObserverEntry> entries, ResizeObserver observer) {
      if(_chart != null) {
        try {
          _chart.resize();
        } catch(error) {
          log.warning("Unable to resize _chart because $error");
        }
      }
    });
    _resizeObserver.observe(chartRef);
  }

As I said, the above works fine with dartdevc, but with dart2js it fails with the following error each time the window size changes.

Uncaught TypeError: Instance of 'minified:f2': type 'minified:f2' is not a subtype of type 'List<minified:iu>'
    at Object.h (main.dart.js:477)
    at Object.f (main.dart.js:824)
    at wv.$2 (main.dart.js:16940)
    at Z0 (main.dart.js:553)
    at ResizeObserver.<anonymous> (main.dart.js:560)

I apologize for the minified code. I have been unable to force webdev build to build without minification or get source-maps working with the command.

My code is not using allowInterop() so perhaps I should file a separate issue for this?

EDIT
Looking at the previously referenced issue #33891 I see a comment by @tonyclickspace in #33891 (comment) that lists ResizeObserverCallback as one of the classes that needs to be included in a fix. However the commit that closed the issue (7b77fa2) appears to have left it out.

[sigmundch]

Thanks for following up! Indeed it appears like that case was accidentally omitted. I sent https://dart-review.googlesource.com/c/sdk/+/127500 to include it too.