allowsFullscreenVideo breaks with <Modal>
See original GitHub issueBug description:
On Android, allowsFullscreenVideo
on a WebView that’s rendered inside a <Modal> 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 <Modal> 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
Issue Analytics
- State:
- Created 3 years ago
- Comments:9 (2 by maintainers)
Top Results From Across the Web
allowsFullscreenVideo breaks with <Modal> #1293 - GitHub
On Android, allowsFullscreenVideo on a WebView that's rendered inside a component completely breaks the app when the full screen button is ...
Read more >How to allow fullscreen on a modal? - Stack Overflow
I have a modal uses an html file which is an embed code (video). If I click on fullscreen, it fits the video...
Read more >react-native-webview: Versions - Openbase
android: Fix full=screen video when in modals (#1748 by ... This change shouldn't break any apps, but we are marking it as a...
Read more >SwiftUI Fullscreen Modal Hack withAnimation - YouTube
Something missing in SwiftUI right now is the ability to present a modal fullscreen. With a little bit of creativity we can hack...
Read more >How to trigger full-screen mode on play for emb...anycodings
... scrollEnabled={false} _left).offset allowsFullscreenVideo={true} ... import React from 'react'; import (TINY_ {Modal, StyleSheet, ...
Read more >Top Related Medium Post
No results found
Top Related StackOverflow Question
No results found
Troubleshoot Live Code
Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start FreeTop Related Reddit Thread
No results found
Top Related Hackernoon Post
No results found
Top Related Tweet
No results found
Top Related Dev.to Post
No results found
Top Related Hashnode Post
No results found
Top GitHub Comments
If you’re using react-native-modal try setting
<Modal coverScreen={false} />
.🎉 This issue has been resolved in version 11.2.3 🎉
The release is available on:
Your semantic-release bot 📦🚀