chore(unit tests): Use side-effect import to fix TS errors (#9754)

packages/forms/jest.config.js

@@ -1,4 +1,5 @@
 /** @type {import('@jest/types').Config.InitialOptions} */
 module.exports = {
+  setupFilesAfterEnv: ['<rootDir>/jest.setup.ts'],
   testEnvironment: 'jest-environment-jsdom',
 }

packages/forms/jest.setup.ts

@@ -0,0 +1 @@
+import '@testing-library/jest-dom'

packages/forms/src/__tests__/form.test.tsx

@@ -1,10 +1,5 @@
 import React from 'react'
 
-import {
-  toHaveFocus,
-  toHaveClass,
-  toBeInTheDocument,
-} from '@testing-library/jest-dom/matchers'
 import {
   screen,
   render,
@@ -27,7 +22,6 @@ import {
   FieldError,
   Label,
 } from '../index'
-expect.extend({ toHaveFocus, toHaveClass, toBeInTheDocument })
 
 describe('Form', () => {
   const TestComponent = ({ onSubmit = () => {} }) => {

packages/router/jest.config.js

@@ -1,6 +1,6 @@
 /** @type {import('@jest/types').Config.InitialOptions} */
 module.exports = {
-  setupFilesAfterEnv: ['./jest.setup.js'],
+  setupFilesAfterEnv: ['./jest.setup.ts'],
   testEnvironment: 'jest-environment-jsdom',
   testMatch: ['**/*.test.+(ts|tsx|js|jsx)', '!**/__typetests__/*.ts'],
 }

packages/router/jest.setup.ts

@@ -0,0 +1,3 @@
+import '@testing-library/jest-dom'
+
+globalThis.scrollTo = jest.fn()

packages/router/src/__tests__/links.test.tsx

@@ -1,12 +1,7 @@
 import React from 'react'
 
-import { toHaveClass, toHaveStyle } from '@testing-library/jest-dom/matchers'
 import { render } from '@testing-library/react'
 
-// TODO: Remove when jest configs are in place
-// @ts-expect-error - Issue with TS and jest-dom
-expect.extend({ toHaveClass, toHaveStyle })
-
 import { NavLink, useMatch, Link } from '../links'
 import { LocationProvider } from '../location'
 import { flattenSearchParams } from '../util'