Race condition in RTCVideoRenderer for Web #1804
Description
Describe the bug
Hi @cloudwebrtc
I found a timing issue in RTCVideoRenderer for Web, causing the reported RTCVideoValue to be invalid (zero width/height).
It looks like the element created here takes a few milliseconds (~30 on my Firefox) to be visible for document.getElementById. In some cases, the first frame arrives before that, resulting in a null element here via these callbacks.
The easiest way to fix this would be to pass the local element to _updateAllValues. It could be used instead of the one returned by findHtmlView or as fallback if none is found.
Other fixes could be a future that's resolved via a Timer.periodic that checks existence of the element every few milliseconds. Or storing the element in a member variable and not searching it every time it's needed.
But in order to solve this bug, adding the parameter to _updateAllValues as fallback is the easiest. I'll send a PR with this solution shortly.
To Reproduce
This is a bit tricky, for me it happens in one out of 10-20 cases. In a basic video app, I keep toggling video on and off and log renderer sizes (or use them for rendering and see the issue). In some cases, reported width/height in onResize will be 0/0.
Expected behavior
Get proper RTCVideoValue data every time
Platform information
- Flutter version:
flutter doctor -v
[✓] Flutter (Channel stable, 3.29.2, on Arch Linux 6.13.8-arch1-1, locale en_US.UTF-8) [173ms]
• Flutter version 3.29.2 on channel stable at /home/tobias/src/3rdparty/flutter
• Upstream repository https://github.com/flutter/flutter
• Framework revision c236373904 (3 weeks ago), 2025-03-13 16:17:06 -0400
• Engine revision 18b71d647a
• Dart version 3.7.2
• DevTools version 2.42.3
[✓] Android toolchain - develop for Android devices (Android SDK version 35) [3.6s]
• Android SDK at /opt/android-sdk/
• Platform android-36, build-tools 35
• ANDROID_HOME = /opt/android-sdk/
• Java binary at: /opt/android-studio/jbr/bin/java
This is the JDK bundled with the latest Android Studio installation on this machine.
To manually set the JDK path, use: `flutter config --jdk-dir="path/to/jdk"`.
• Java version OpenJDK Runtime Environment (build 21.0.5+-13047016-b750.29)
• All Android licenses accepted.
[✓] Chrome - develop for the web [93ms]
• Chrome at google-chrome
[✓] Linux toolchain - develop for Linux desktop [300ms]
• clang version 19.1.7
• cmake version 4.0.0
• ninja version 1.12.1
• pkg-config version 2.4.3
[✓] Android Studio (version 2024.3) [91ms]
• Android Studio at /opt/android-studio
• Flutter plugin version 83.0.4
• Dart plugin can be installed from:
🔨 https://plugins.jetbrains.com/plugin/6351-dart
• Java version OpenJDK Runtime Environment (build 21.0.5+-13047016-b750.29)
[✓] Connected device (3 available) [199ms]
• SM A145R (mobile) • R8YW707S3KF • android-arm64 • Android 14 (API 34)
• Linux (desktop) • linux • linux-x64 • Arch Linux 6.13.8-arch1-1
• Chrome (web) • chrome • web-javascript • Mozilla Firefox 136.0.4
[✓] Network resources [664ms]
• All expected network resources are available.
• No issues found!
- Plugin version: 0.13.0
- OS: Web/Arch Linux
- OS version: tested on Firefox 136.0.4, Chromium 134.0.6998.165