테스트 코드 작성 시 Property 'toBeInTheDocument' does not exist on type 'JestMatchers<HTMLElement>'.ts(2339)

테스트 환경 설정(React / Vite)

1. vite.config.ts

import react from '@vitejs/plugin-react';

export default defineConfig({
  plugins: [react()],
  test: {
    globals: true,
    environment: 'jsdom',  
    setupFiles: './setupTests.ts',  
  },
});

export default defineConfig({
  plugins: [react()],
  ...vitestConfig,
  
  // 기타 설정
  //define : {'global' : {}},
})

2. setupTest.ts

import '@testing-library/jest-dom';

3. tsconfig.json

jest와 @testing-library/jest-dom을 추가

{
  "compilerOptions": {"types": ["vitest/globals", "jest", "@testing-library/jest-dom"]},
    ...
  
}

위와 같이 설정을 완료했는데도 *.test.tsx 형태로 파일로 테스트 코드 작성시
toBeInDocument() 부분에 다음과 같은 오류가 발생해서

toBeInTheDocument' does not exist on type 'JestMatchers'.ts(2339)...

아래와 같이 타입을 설치해서 오류를 해결하였다.

npm install @types/testing-library__jest-dom