fix: handle undefined mediaDevices

src/useMediaDevices.ts

@@ -10,16 +10,17 @@ const useMediaDevices = () => {
     let mounted = true;
 
     const onChange = () => {
-      navigator.mediaDevices
-        .enumerateDevices()
-        .then(devices => {
-          if (mounted) {
-            setState({
-              devices: devices.map(({ deviceId, groupId, kind, label }) => ({ deviceId, groupId, kind, label })),
-            });
-          }
-        })
-        .catch(noop);
+      navigator.mediaDevices &&
+        navigator.mediaDevices
+          .enumerateDevices()
+          .then(devices => {
+            if (mounted) {
+              setState({
+                devices: devices.map(({ deviceId, groupId, kind, label }) => ({ deviceId, groupId, kind, label })),
+              });
+            }
+          })
+          .catch(noop);
     };
 
     on(navigator.mediaDevices, 'devicechange', onChange);

src/util.ts

@@ -1,5 +1,23 @@
 export const isClient = typeof window === 'object';
 
-export const on = (obj: any, ...args: any[]) => obj.addEventListener(...args);
+export const on = (obj: any, ...args: any[]) => {
+  try {
+    obj.addEventListener(...args);
+  } catch (error) {
+    handleError(error);
+  }
+};
 
-export const off = (obj: any, ...args: any[]) => obj.removeEventListener(...args);
+export const off = (obj: any, ...args: any[]) => {
+  try {
+    obj.removeEventListener(...args);
+  } catch (error) {
+    handleError(error);
+  }
+};
+
+const handleError = (error: any) => {
+  if (process.env.NODE_ENV !== 'production') {
+    console.error(error);
+  }
+};