dotnet / maui

.NET MAUI is the .NET Multi-platform App UI, a framework for building native device applications spanning mobile, tablet, and desktop.
https://dot.net/maui
MIT License
22.28k stars 1.76k forks source link

MAUI WebView Apps do not allow iframe videos to run full screen #8030

Open efonsecab opened 2 years ago

efonsecab commented 2 years ago

Description

In a MAUI Blazor app, when you try to make an iframe video to run full screen in android devices, nothing happens.

Steps to Reproduce

  1. Create a new MAUI Blazor app
  2. In the Index page, add an iframe to a video. Example below <iframe width="684" height="385" src="https://www.youtube.com/embed/sGYIDKx6cY0" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
  3. Deploy the app to an android device.
  4. Try to make the video to play full screen

Same thing happens with Azure Media Player

Version with bug

6.0 (current)

Last version that worked well

Unknown/Other

Affected platforms

Android

Affected platform versions

Android 12

Did you find any workaround?

No, I haven't found a workaround

Relevant log output

Log when using Azure Media Player [chromium] [INFO:CONSOLE(37)] "Uncaught (in promise) TypeError: fullscreen error", source: https://amp.azure.net/libs/amp/latest/azuremediaplayer.min.js (37) [CCodecBufferChannel] [c2.qti.avc.decoder#386] DEBUG: elapsed: n=16 [in=0 pipeline=0 out=12] [ViewRootImpl@c269f0c[MainActivity]] ViewPostIme pointer 0 [ViewRootImpl@c269f0c[MainActivity]] ViewPostIme pointer 1 [ViewRootImpl@c269f0c[MainActivity]] ViewPostIme pointer 0 [ViewRootImpl@c269f0c[MainActivity]] ViewPostIme pointer 1 [BufferPoolAccessor2.0] bufferpool2 0xb4000076260d9838 : 5(15667200 size) total buffers - 4(12533760 size) used buffers - 341/347 (recycle/alloc) - 9/345 (fetch/transfer) [ViewRootImpl@c269f0c[MainActivity]] ViewPostIme pointer 0 [CCodecBufferChannel] [c2.qti.avc.decoder#386] DEBUG: elapsed: n=16 [in=0 pipeline=0 out=12] [ViewRootImpl@c269f0c[MainActivity]] ViewPostIme pointer 1 [chromium] [INFO:CONSOLE(37)] "Uncaught (in promise) TypeError: Failed to execute 'exitFullscreen' on 'Document': Document not active", source: https://amp.azure.net/libs/amp/latest/azuremediaplayer.min.js (37) Thread finished: #16 Thread finished: #18 Thread finished: #15

Eilon commented 2 years ago

@efonsecab thank you for the report. For this part:

Try to make the video to play full screen

Do the usual controls for attempting to show full screen show up, but when you tap it, nothing happens? Or does the full screen button not even show up?

jfversluis commented 2 years ago

Maybe (partially) related to #4807 ? @efonsecab did you also test on iOS or Windows? Does it work properly there?

efonsecab commented 2 years ago

@efonsecab thank you for the report. For this part:

Try to make the video to play full screen

Do the usual controls for attempting to show full screen show up, but when you tap it, nothing happens? Or does the full screen button not even show up?

Yes, the controls appear, it's just that the full screen action is not executing. I just confirmed the issue also happens when using Azure Media Player. I updated the Relevant log output for this scenario.

TanayParikh commented 2 years ago

@efonsecab to help us isolate this issue, can you please confirm if the issue also reproduces in the base MAUI WebView (without Blazor)?

efonsecab commented 2 years ago

@efonsecab to help us isolate this issue, can you please confirm if the issue also reproduces in the base MAUI WebView (without Blazor)?

Yes, same issue with a normal MAUI app with a WebView.

Seems related/duplicate of this: https://github.com/dotnet/maui/issues/7720

kristinx0211 commented 2 years ago

verified repro on android.

Guandaru6967 commented 2 years ago

Maybe (partially) related to #4807 ? @efonsecab did you also test on iOS or Windows? Does it work properly there?

Works fine on Windows . ``` <iframe allowfullscreen="allowfullscreen" ..../>

vhugogarcia commented 1 year ago

I'm facing this issue as well. I have on my Maui App 7.0.x a webview playing a video and it does not allow for full screen in Android. On iOS it works natively.

vhugogarcia commented 1 year ago

Hello friends, I found a solution and I wrote an article about how to implement it, hopefully you find it helpful :)

In this post, I will show you how to enable the feature allowing users to watch videos in full-screen mode on .NET MAUI WebViews for Android, using a simple custom handler and some native code. https://dev.to/vhugogarcia/net-maui-webviews-how-to-play-videos-in-full-screen-1j03

Thank you all!

ghost commented 1 year ago

We've added this issue to our backlog, and we will work to address it as time and resources allow. If you have any additional information or questions about this issue, please leave a comment. For additional info about issue management, please read our Triage Process.