WebView video not playing on Fire TV Stick 4K Max (works on Android devices)

[O_Karas]

Hi everyone,

I’ve developed a React Native application for Fire OS, which is basically an Android app.
The app displays a WebView showing a web page that includes an HTML5 video element.

The issue is:

• The video plays correctly on Android emulators and physical Android devices (phones/tablets).

• The same app on Fire TV Stick 4K Max (Fire OS) does not play the video. The page loads fine, but the video either stays black or doesn’t start at all.

Technical details:

• Device: Fire TV Stick 4K Max (2nd Gen)

• Fire OS version: 8.1.4.9

• React Native version: 0.81

• WebView library: react-native-webview version 13.16.0

• Video type: MP4

• Video source: hosted on HTTPS server

• Player behavior: Works on Android WebView but not on FireOS WebView.

What I’ve tried:

• Enabling mediaPlaybackRequiresUserAction={false} and allowsInlineMediaPlayback={true} in WebView props

• Checking network permissions and CORS headers

• Testing with <video> tag and autoplay, controls, muted attributes

Question:

Is there a known limitation with HTML5 video playback inside WebView on Fire OS / Fire TV?
Do I need to use a specific player or permission for Fire TV devices?

Any help or workaround would be appreciated.

Thanks in advance!

[Moses]

Hi @O_Karas ,

I was able to get react-native-webview to work on Fire OS: GitHub - mosesroth/fire-tablet-webview-app and I was able to run a video.

I only had the chance to test it on a tablet, not on a TV stick, but it should work.

Have you reviewed the docs and made sure you were following all the guidelines?

Getting Started with Web Apps (Fire TV) | Amazon Fire TV

Moses

[O_Karas]

Hi @Moses

The react-native-webview works fine on Fire OS except for one issue I described in the ticket: the loaded webpage is unable to auto-start a video.

Test page: https://testvideoplayback.pages.dev/ — it auto-plays on Android but fails on Fire OS react-native-webview.

      <WebView
        mediaPlaybackRequiresUserAction={false}
        allowsInlineMediaPlayback={true}
        allowsFullscreenVideo={true}
        source={{ uri: 'https://testvideoplayback.pages.dev/' }}
        incognito={true}
      />

Thank you.

[O_Karas]

How to reproduce:

1. Init a new React Native TVOS project

npx @react-native-community/cli@latest init TVTest --template @react-native-tvos/template-tv

2. cd tvtest

cd TVTest

3. Install React Native WebView

npm install react-native-webview

4. Add WebView into App.tsx

import { StyleSheet, View } from ‘react-native’;

import { WebView } from ‘react-native-webview’;

function App() {

return (

<View style={styles.container}>

<WebView

mediaPlaybackRequiresUserAction={false}

allowsInlineMediaPlayback={true}

allowsFullscreenVideo={true}

source={{ uri: ‘Auto-start Video }}

incognito={true}

/>

);

}

const styles = StyleSheet.create({

container: {

flex: 1,

},

});

export default App;

4. Run it on the connected device

npx react-native run-android

It doesn’t start video as expected.

expected result is - video plays on page https://testvideoplayback.pages.dev/

[O_Karas]

Hi @Moses

I created a repository to help reproduce the issue: GitHub - olkarase/TVTest

Thank you.