Browser compatibility

Understanding React Native Web for TV browser compatibility.

TV-browser compatibility validation in this fork is still in progress. Because this project builds on React Native Web, the baseline browser compatibility expectations generally follow React Native Web behavior. On top of that baseline, this fork adds LRUD-based spatial navigation support for TV-focused interaction patterns (which also work on PC browsers).

The browsers with known support include:

  • Chrome 60+
  • Safari 10.1+ / iOS Safari 10.1+
  • Edge 12+
  • Firefox ESR+
  • Opera

If specific exports have a different browser support expectation, it will be documented with that export.


JavaScript

Your application may need to polyfill Promise, Object.assign, Array.from, and ResizeObserver as necessary for your desired browser support.


CSS

Most CSS properties and values are supported. Vendor prefixes are automatically provided where necessary. For example, if you use the following style:

const style = {
userSelect: 'none'
}

The resulting CSS is:

.r-userSelect-24jds {
-webkit-user-select: none;
user-select: none;
}

Certain CSS properties are not supported across all browsers, but are polyfilled by React Native Web for TV.

(N.B. Safari prior to version 10.1 can suffer from extremely poor flexbox performance. The recommended way to work around this issue (as used on mobile.twitter.com) is to set display:block on Views in your element hierarchy that you know don’t need flexbox layout.)

Updated
React Native Web for TVPortions Copyright © Nicolas Gallagher, Meta Platforms, Inc., Facebook, Inc. and affiliates, and other contributors as noted in file headers and THIRD_PARTY_NOTICES.md. Modifications and TV extensions Copyright © Harpreet Singh and contributors.