Specify more explicit browser targets (#405)

* specify more explicit browser targets

* add compatibility note in readme

* rename to isBrowserSupported

* fix typo

* refer to package.json

* changeset

.changeset/yellow-experts-joke.md

@@ -0,0 +1,5 @@
+---
+'livekit-client': patch
+---
+
+Update browserslist

README.md

@@ -277,3 +277,12 @@ setLogExtension((level: LogLevel, msg: string, context: object) => {
 | Firefox         | Windows, macOS, Linux | Android   |
 | Safari          | macOS                 | iOS       |
 | Edge (Chromium) | Windows, macOS        |           |
+
+We aim to support a broad range of browser versions by transpiling the library code with babel.
+You can have a look at the `"browerslist"` section of `package.json` for more details.
+
+> Note that the library requires some specific browser APIs to be present.
+> You can check general compatibility with the helper function `isBrowserSupported()`.
+> Support for more modern features like adaptiveStream and dynacast can be checked for with `supportsAdaptiveStream()` and `supportsDynacast()`.
+
+If you are targeting legacy browsers, but still want adaptiveStream functionality you'll likely need to use polyfills for [ResizeObserver](https://www.npmjs.com/package/resize-observer-polyfill) and [IntersectionObserver](https://www.npmjs.com/package/intersection-observer).

package.json

@@ -78,8 +78,15 @@
     "typescript": "4.7.4"
   },
   "browserslist": [
-    "defaults",
     "safari >= 11",
-    "not IE 11"
+    "ios_saf >= 11",
+    "chrome >= 56",
+    "and_chr >= 56",
+    "android >= 56",
+    "firefox >= 53",
+    "edge >= 50",
+    "Samsung >= 6.0",
+    "not IE 11",
+    "not dead"
   ]
 }

src/index.ts

@@ -18,7 +18,7 @@ import { TrackPublication } from './room/track/TrackPublication';
 import {
   getEmptyAudioStreamTrack,
   getEmptyVideoStreamTrack,
-  isDeviceSupported,
+  isBrowserSupported,
   supportsAdaptiveStream,
   supportsDynacast,
 } from './room/utils';
@@ -36,7 +36,7 @@ export {
   setLogExtension,
   getEmptyAudioStreamTrack,
   getEmptyVideoStreamTrack,
-  isDeviceSupported,
+  isBrowserSupported,
   supportsAdaptiveStream,
   supportsDynacast,
   LogLevel,

src/room/utils.ts

@@ -33,7 +33,7 @@ export function supportsDynacast() {
   return supportsTransceiver();
 }
 
-export function isDeviceSupported() {
+export function isBrowserSupported() {
   return supportsTransceiver() || supportsAddTrack();
 }