reactjs - Vitest-varoitus: Nykyinen testin suorittaja ei tue afterEach-/teardown-koukkuja

Ongelma:
Työskentelen React-projektin parissa käyttäen Viteä ja TypeScriptiä, ja olen kohdannut joitakin varoituksia ajettaessa testejä Vitestillä ja RTL:llä (React Testing Library). Vaikka testit toimivat hyvin, olen aiemmin kohdannut ongelmia, kun cleanup()-funktiota ei käytetty, mikä rikkoi joitakin testejä. Varoitukset ovat seuraavat:

stderr | unknown 
test The current test runner does not support afterEach/teardown hooks. This means we won't be able to run automatic cleanup and you should be calling cleanup() manually.

The current test runner does not support beforeAll/afterAll hooks. This means you should be setting IS_REACT_ACT_ENVIRONMENT manually.

Ympäristö:

• Suoritetaan devContainerissa (Node.js- ja TypeScript-kuva)
• Node-versio: 20.x

Riippuvuudet:

{
  "name": "armada-website",
  "private": true,
  "version": "1.0.0",
  "engines": {
    "node": "20.x"
  },
  "scripts": {
    "dev": "vite",
    "test": "vitest",
    "coverage": "vitest --coverage",
  },
  "dependencies": {
    "@swc/helpers": "^0.5.0",
    "react": "^18.2.0",
    "react-dom": "^18.2.0",
    "react-router-dom": "^6.9.0"
  },
  "devDependencies": {
    "@testing-library/jest-dom": "^5.16.5",
    "@testing-library/react": "^14.0.0",
    "@types/react": "^18.0.28",
    "@types/react-dom": "^18.0.11",
    "@vitejs/plugin-react-swc": "^3.2.0",
    "@vitest/coverage-istanbul": "^0.29.8",
    "happy-dom": "^12.10.3",
    "jsdom": "^21.1.1",
    "typescript": "^5.2.2",
    "vite": "^4.5.0",
    "vite-tsconfig-paths": "^4.2.1",
    "vitest": "^0.29.7"
  },
}

Vite-konfiguraatio (vite.config.ts):

import react from '@vitejs/plugin-react-swc';
import type { UserConfig } from 'vite';
import { defineConfig } from 'vite';
import tsconfigPaths from 'vite-tsconfig-paths';
import type { InlineConfig } from 'vitest';

interface VitestConfigExport extends UserConfig {
  test: InlineConfig;
}

// https://vitejs.dev/config/
export default defineConfig({
  plugins: [react(), tsconfigPaths()],
  test: {
    environment: 'happy-dom',
    coverage: {
      provider: 'istanbul',
      lines: 90,
      functions: 90,
      branches: 90,
      statements: 90,
    },
    dir: 'src/__tests__',
  },
  exclude: ['src/__tests__'],
} as VitestConfigExport);

TypeScriptin määritykset (tsconfig.json):

{
  "compilerOptions": {
    "target": "ESNext",
    "useDefineForClassFields": true,
    "lib": ["DOM", "DOM.Iterable", "ESNext"],
    "allowJs": true,
    "skipLibCheck": true,
    "esModuleInterop": true,
    "noUnusedLocals": true,
    "noUnusedParameters": true,
    "noFallthroughCasesInSwitch": true,
    "allowSyntheticDefaultImports": true,
    "strict": true,
    "forceConsistentCasingInFileNames": true,
    "module": "ESNext",
    "moduleResolution": "Node",
    "resolveJsonModule": true,
    "isolatedModules": true,
    "emitDecoratorMetadata": true,
    "experimentalDecorators": true,
    "noEmit": true,
    "jsx": "preserve",
    "incremental": true,
    "baseUrl": ".",
    "paths": {
      "~/*": ["src/*"]
    }
  },
  "include": ["vite.config.ts", "**/*.ts", "**/*.tsx"],
  "exclude": ["node_modules"]
}

Kysymys: Kuinka voin ratkaista nämä varoitukset varmistaakseni vakaan testausympäristön? Onko olemassa tiettyjä asetuksia tai versioita, joita minun pitäisi käyttää Vitestin ja RTL:n kanssa näiden ominaisuuksien tukemiseksi?

Huomautus Työskentelin aiemmassa projektissa, jossa oli käytännössä samat asetukset ja versiot, eikä minulla ollut tähän liittyviä varoituksia.

Vastaus #1

Vitest odottaa, että afterEach on määritelty globaalisti, mikä ei oletuksena ole tilanne.

Joten yritä lisätä seuraava Vite-konfiguraatioosi

test: {
  ....
  globals: true
}

Katso lisätietoja osoitteesta https://github.com/testing-library/vue-testing-library/issues/296