fix(mq): use addListener and removeListener (#402)

* fix(mq): use addListener and removeListener * fix(select): ie arrow
core-ds · Dec 2, 2020 · 9918383 · 9918383
1 parent c0c1723
commit 9918383
Show file tree

Hide file tree

Showing 4 changed files with 9 additions and 8 deletions.
diff --git a/packages/mq/src/Component.test.tsx b/packages/mq/src/Component.test.tsx
@@ -6,17 +6,17 @@ import { Mq } from './Component';
 jest.mock('./utils', () => ({
     isPointerEventsSupported: jest.fn(() => true),
     getMatchMedia: jest.fn(() => ({
-        addEventListener: jest.fn,
-        removeEventListener: jest.fn,
+        addListener: jest.fn,
+        removeListener: jest.fn,
         matches: false,
     })),
     releaseMatchMedia: jest.fn,
 }));
 
 function mockGetMatchMedia(result: boolean) {
     (getMatchMedia as jest.Mock).mockReturnValueOnce({
-        addEventListener: jest.fn,
-        removeEventListener: jest.fn,
+        addListener: jest.fn,
+        removeListener: jest.fn,
         matches: result,
     });
 }

diff --git a/packages/mq/src/useMatchMedia.test.tsx b/packages/mq/src/useMatchMedia.test.tsx
@@ -7,8 +7,8 @@ jest.mock('./utils');
 
 function mockGetMatchMedia(matches: boolean) {
     (getMatchMedia as jest.Mock).mockReturnValue({
-        addEventListener: jest.fn,
-        removeEventListener: jest.fn,
+        addListener: jest.fn,
+        removeListener: jest.fn,
         matches,
     });
 }

diff --git a/packages/mq/src/useMatchMedia.tsx b/packages/mq/src/useMatchMedia.tsx
@@ -13,11 +13,11 @@ export const useMatchMedia = (query: string) => {
 
         const handleMatchChange = () => setMatches(mql.matches);
 
-        mql.addEventListener('change', handleMatchChange);
+        mql.addListener(handleMatchChange);
         handleMatchChange();
 
         return () => {
-            mql.removeEventListener('change', handleMatchChange);
+            mql.removeListener(handleMatchChange);
             releaseMatchMedia(query);
         };
     }, [query]);

diff --git a/packages/select/src/components/arrow/index.module.css b/packages/select/src/components/arrow/index.module.css
@@ -8,6 +8,7 @@
 
     background: var(--select-arrow-background);
     background-size: cover;
+    background-position: center;
     transition: opacity 0.2s ease;
 }