Fix different signatures of addEventListener and addListener (#155)

Co-authored-by: Kostiantyn Ko <[email protected]> Co-authored-by: Rogin Farrer <[email protected]>
roginfarrer · Jul 18, 2023 · 2a098e1 · 2a098e1
1 parent 263c05d
commit 2a098e1
Show file tree

Hide file tree

Showing 2 changed files with 16 additions and 3 deletions.
diff --git a/.changeset/mean-insects-warn.md b/.changeset/mean-insects-warn.md
@@ -0,0 +1,5 @@
+---
+"react-collapsed": patch
+---
+
+Account for different signatures of addEventListener and addListener, fix #152
diff --git a/packages/react-collapsed/src/utils/usePrefersReducedMotion.ts b/packages/react-collapsed/src/utils/usePrefersReducedMotion.ts
@@ -15,10 +15,18 @@ export function usePrefersReducedMotion() {
     }
 
     // Fallback to addListener/removeListener for older browsers, #152
-    (mediaQueryList.addEventListener ?? mediaQueryList.addListener)('change', listener)
-    return () => {
-      (mediaQueryList.removeEventListener ?? mediaQueryList.removeListener)('change', listener)
+    if (mediaQueryList.addEventListener) {
+      mediaQueryList.addEventListener('change', listener)
+      return () => {
+        mediaQueryList.removeEventListener('change', listener)
+      }
+    } else if (mediaQueryList.addListener) {
+      mediaQueryList.addListener(listener)
+      return () => {
+        mediaQueryList.removeListener(listener)
+      }
     }
+    return undefined
   }, [])
   return prefersReducedMotion
 }