add matchMedia mock to test-helpers

primer · Mar 13, 2024 · d71e0f6 · d71e0f6
1 parent ef9c8ec
commit d71e0f6
Show file tree

Hide file tree

Showing 3 changed files with 17 additions and 32 deletions.
diff --git a/packages/react/src/UnderlineNav/UnderlineNav.test.tsx b/packages/react/src/UnderlineNav/UnderlineNav.test.tsx
@@ -15,22 +15,6 @@ import {
 import {UnderlineNav} from '.'
 import {checkExports, checkStoriesForAxeViolations} from '../utils/testing'
 
-// window.matchMedia() is not implemented by JSDOM so we have to create a mock:
-// https://jestjs.io/docs/manual-mocks#mocking-methods-which-are-not-implemented-in-jsdom
-Object.defineProperty(window, 'matchMedia', {
-  writable: true,
-  value: jest.fn().mockImplementation(query => ({
-    matches: false,
-    media: query,
-    onchange: null,
-    addListener: jest.fn(), // deprecated
-    removeListener: jest.fn(), // deprecated
-    addEventListener: jest.fn(),
-    removeEventListener: jest.fn(),
-    dispatchEvent: jest.fn(),
-  })),
-})
-
 const ResponsiveUnderlineNav = ({
   selectedItemText = 'Code',
   loadingCounters = false,

diff --git a/packages/react/src/__tests__/ThemeProvider.test.tsx b/packages/react/src/__tests__/ThemeProvider.test.tsx
@@ -4,22 +4,6 @@ import 'jest-styled-components'
 import React from 'react'
 import {Text, ThemeProvider, useColorSchemeVar, useTheme} from '..'
 
-// window.matchMedia() is not implemented by JSDOM so we have to create a mock:
-// https://jestjs.io/docs/manual-mocks#mocking-methods-which-are-not-implemented-in-jsdom
-Object.defineProperty(window, 'matchMedia', {
-  writable: true,
-  value: jest.fn().mockImplementation(query => ({
-    matches: false,
-    media: query,
-    onchange: null,
-    addListener: jest.fn(), // deprecated
-    removeListener: jest.fn(), // deprecated
-    addEventListener: jest.fn(),
-    removeEventListener: jest.fn(),
-    dispatchEvent: jest.fn(),
-  })),
-})
-
 const exampleTheme = {
   colors: {
     text: '#f00',

diff --git a/packages/react/src/utils/test-helpers.tsx b/packages/react/src/utils/test-helpers.tsx
@@ -44,3 +44,20 @@ if (typeof document !== 'undefined') {
 if (global.Element.prototype.scrollIntoView === undefined) {
   global.Element.prototype.scrollIntoView = jest.fn()
 }
+
+// window.matchMedia() is not implemented by JSDOM so we have to create a mock:
+// https://jestjs.io/docs/manual-mocks#mocking-methods-which-are-not-implemented-in-jsdom
+// eslint-disable-next-line ssr-friendly/no-dom-globals-in-module-scope
+Object.defineProperty(window, 'matchMedia', {
+  writable: true,
+  value: jest.fn().mockImplementation(query => ({
+    matches: false,
+    media: query,
+    onchange: null,
+    addListener: jest.fn(), // deprecated
+    removeListener: jest.fn(), // deprecated
+    addEventListener: jest.fn(),
+    removeEventListener: jest.fn(),
+    dispatchEvent: jest.fn(),
+  })),
+})