fix: add fallback media query listeners for older browsers

expo · Mar 4, 2021 · 94343c7 · 94343c7
1 parent db91622
commit 94343c7
Showing 1 changed file with 12 additions and 2 deletions.
diff --git a/src/theme/ThemeProvider.tsx b/src/theme/ThemeProvider.tsx
@@ -39,7 +39,12 @@ export function ThemeProvider(props: ThemeProviderProps) {
 
     const mediaQuery = window.matchMedia('(prefers-color-scheme: dark)');
 
-    mediaQuery.addEventListener('change', onThemeChange);
+    try {
+      mediaQuery.addEventListener('change', onThemeChange);
+    } catch {
+      // Fallback to old-style listeing for changes, for Safari and IE
+      mediaQuery.addListener(onThemeChange);
+    }
 
     const themePreference = window.localStorage.getItem('data-expo-theme');
 
@@ -50,7 +55,12 @@ export function ThemeProvider(props: ThemeProviderProps) {
     }
 
     return function unMount() {
-      mediaQuery.removeEventListener('change', onThemeChange);
+      try {
+        mediaQuery.removeEventListener('change', onThemeChange);
+      } catch {
+        // Fallback to old-style listeing for changes, for Safari and IE
+        mediaQuery.removeListener(onThemeChange);
+      }
     };
   }, []);