canvaskit.js:180 WARNING: Too many active WebGL contexts. Oldest context will be lost. causes UI to glitch

[r-durao-pvotal]

1. Issue description

When DropzoneView is inside a scrollable view that is scrollable (i.e., a list that shows content with a size larger than the device's screen), the warning in the title appears. This causes for the some of the UI to glitch out. This seems to happen when you start the app in a desktop sized screen. If you start it with a mobile sized screen this doesn't happen. It's a really weird bug :thinking:

2. output of flutter doctor

[✓] Flutter (Channel stable, 2.5.3, on Ubuntu 20.04.3 LTS 5.13.0-27-generic, locale en_US.UTF-8)
[!] Android toolchain - develop for Android devices (Android SDK version 30.0.3)
    ✗ cmdline-tools component is missing
      Run `path/to/sdkmanager --install "cmdline-tools;latest"`
      See https://developer.android.com/studio/command-line for more details.
    ✗ Android license status unknown.
      Run `flutter doctor --android-licenses` to accept the SDK licenses.
      See https://flutter.dev/docs/get-started/install/linux#android-setup for more details.
[✓] Chrome - develop for the web
[✓] Linux toolchain - develop for Linux desktop
[✓] Android Studio (version 4.2)
[✓] VS Code
[✓] Connected device (2 available)

3. Steps to reproduce:

• Launch sample app at https://github.com/r-durao-pvotal/flutter_dropzpone_web_gl_issue/tree/master/flutter_dropzone_web_gl_issue
• Scroll the list view until you see the WebGL warning and notice that some of the UI glitches out or is distorted

4. Video showcasing the issue

https://user-images.githubusercontent.com/91456269/151354592-aebacf64-e0c2-447b-8195-a79c1731e6c7.mp4

Just to show how severe this bug is, here's a screenshot of our app when the glitch happens and we start scrolling:

[deakjahn]

How many of those do you really have? Every one of the dropzones is a separate platform view, so I'm not very much suprised that the Flutter engine has an upper limit. :-)

[r-durao-pvotal]

How many of those do you really have? Every one of the dropzones is a separate platform view, so I'm not very much suprised that the Flutter engine has an upper limit. :-)

In the sample app there are quite a few, but in our app it is just one dropzone inside a scrollable view :thinking:

EDIT: I've changed the sample app to only use 1 dropzone in the widget tree, the warning persists.

https://user-images.githubusercontent.com/91456269/151761910-80a3d74b-0f46-4fea-82d3-b6a7ca2ee9c4.mp4