[BUG] Embeded YouTube video with <iframe> not showing

[gtu-myowin]

Describe the bug: The HTML code that comes from API contains youtube embed iframe and it is not being rendered on the app. I have tried this answer https://github.com/flutter/flutter/issues/26893#issuecomment-474725615 but the result remain the same.

HTML to reproduce the issue:

<iframe src="https://www.youtube.com/embed/zwI0zO5i-QM?autoplay=0&amp;rel=0" allowfullscreen="allowfullscreen"></iframe>

Html widget configuration:

Html(
    data: '<iframe src="https://www.youtube.com/embed/zwI0zO5i-QM?autoplay=0&amp;rel=0" allowfullscreen="allowfullscreen"></iframe>',
);

Expected behavior: Should display YouTube video and can play

Screenshots:

Device details and Flutter/Dart/flutter_html versions: Flutter 3.3.3 • channel stable Dart SDK version: 2.18.2 (stable) (Tue Sep 27 13:24:11 2022 +0200) on "macos_x64" flutter_html: ^3.0.0-alpha.6

Additional info: No error in Debug Console

A picture of a cute animal (not mandatory but encouraged)

[erickok]

Have you added flutter_html_iframe?

[gtu-myowin]

Yes, I did add flutter_html_iframe and also tried with flutter_html_all but it is not working with any of them. I even tried someone's code https://github.com/Sub6Resources/flutter_html/issues/1023#issuecomment-1264619558 which claimed to be working but apparently not for me.

Here is my full dependencies

environment:
  sdk: ">=2.18.1 <3.3.3"
dependencies:
  animations: ^2.0.5
  dio: ^4.0.6
  dio_http_cache: ^0.3.0
  flutter:
    sdk: flutter
  flutter_mdetect: ^0.0.4
  get: ^4.6.5
  get_storage: ^2.0.3
  google_fonts: ^3.0.1
  html: ^0.15.0
  intl: ^0.17.0
  rabbit_converter: ^2.0.0
  salomon_bottom_bar: ^3.3.1
  url_launcher: ^6.1.6
  flutter_svg: ^1.1.5
  flutter_html: ^3.0.0-alpha.6
  flutter_html_iframe: ^3.0.0-alpha.3
dev_dependencies:
  flutter_lints: ^2.0.0
  flutter_test:
    sdk: flutter
flutter:
  generate: true

[erickok]

And did you add the custom render?

Widget html = Html(
  customRenders: {
    iframeMatcher(): iframeRender(),
  }
);

[gtu-myowin]

Sorry for the late reply. If I add that, my widget would look like this and and I got error in console which comes from ~/.pub-cache/hosted/pub.dartlang.org/flutter_html_iframe-3.0.0-alpha.3/lib/iframe_mobile.dart

[Sub6Resources]

Please upgrade flutter_html_iframe to the latest version. That should resolve your issue.

[gtu-myowin]

Thank you! The update fixed the issue.

[avdept]

@gtu-myowin how did you fix it? Having same issue with YouTube videos

[gtu-myowin]

@avdept according to my last reply, you just need to add flutter_html_iframe: ^3.0.0-alpha.4 and run flutter pub get

[Roasted-Peanut]

flutter_html 3.0.0-beta.2 not working!!!