allowsFullscreenVideo breaks with <Modal>

[cristianoccazinsp]

Bug description:

On Android, allowsFullscreenVideo on a WebView that's rendered inside a component completely breaks the app when the full screen button is pressed. The full screen player seems to render behind the modal, and closing the modal will leave a blank screen stuck on top of the app. After this point, the app is unusable and must be closed.

To Reproduce:

Render a <WebView allowsFullscreenVideo={true} /> inside a component. Have the webview render something with a video in it; for example, a youtube video. Lastly, press the full screen button and observe.

Expected behavior:

Full screen player should not break the application, and should properly play above the app's modal.

Screenshots/Videos:

Environment:

• OS: Android
• OS version: Android 8.1 and 10 (tested on these)
• react-native version: 0.61.5
• react-native-webview version: 9.0.2

[Gabogg07]

Same problem over here, is there any update on this issue?
I ended up creating a new view to display the webview instead of a modal. Not the desired outcome, but works.

[LonelyCpp]

The screen completely goes black after entering fullscreen from a modal :(

What is even happening here?

[bilalsyed001]

If you're using react-native-modal try setting <Modal coverScreen={false} />.

[gilshaan]

Issue still exists for Native Modal in react native.

[djhr]

having the same issue, also tried the Modal provided by react-native-community with coverScreen={false} but it doesn't help much since coverScreen={false} won't render a Modal

[github-actions]

Hello 👋, this issue has been opened for more than 2 months with no activity on it. If the issue is still here, please keep in mind that we need community support and help to fix it! Just comment something like still searching for solutions and if you found one, please open a pull request! You have 7 days until this gets closed automatically

[cristianoccazinsp]

Still an issue.

[cristianoccazinsp]

Update: Looks like the issue is related to these lines: https://github.com/react-native-webview/react-native-webview/blob/master/android/src/main/java/com/reactnativecommunity/webview/RNCWebViewManager.java#L730

Bascically, when in a , the root view is used incorrectly. I have been trying to find the right root view where to add the video View, but nothing works. Additionally, one could hide the root view if within a Modal, but there's also no way to know if the webview was rendered in a Modal or not. Still trying some work arounds.

Fix proposed: #1748

[react-native-community-bot]

🎉 This issue has been resolved in version 11.2.3 🎉

The release is available on:

• npm package (@latest dist-tag)
• GitHub release

Your semantic-release bot 📦🚀