Modèles de Migration de Tests React 19

Référence pour toutes les migrations de fichiers de test requises par React 19.

Ordre de Priorité

Corrigez les fichiers de test dans cet ordre ; chaque couche dépend de la précédente :

1. Import act à corriger en premier, cela débloque tout le reste
2. Simulate → fireEvent à corriger immédiatement après act
3. Nettoyage complet react-dom/test-utils supprimer les imports restants
4. Comptages d'appels StrictMode mesurer le réel, ne pas deviner
5. Wrapping async act pour les avertissements "not wrapped in act" restants
6. Helper render personnalisé vérifier une fois par codebase, pas par test

1. Correction de l'Import act()

// Avant  SUPPRIMÉ dans React 19 :
import { act } from 'react-dom/test-utils';

// Après :
import { act } from 'react';

S'il est mélangé avec d'autres imports test-utils :

// Avant :
import { act, Simulate, renderIntoDocument } from 'react-dom/test-utils';

// Après  divisez les imports :
import { act } from 'react';
import { fireEvent, render } from '@testing-library/react'; // remplace Simulate + renderIntoDocument

2. Simulate → fireEvent

// Avant  Simulate SUPPRIMÉ dans React 19 :
import { Simulate } from 'react-dom/test-utils';
Simulate.click(element);
Simulate.change(input, { target: { value: 'hello' } });
Simulate.submit(form);
Simulate.keyDown(element, { key: 'Enter', keyCode: 13 });

// Après :
import { fireEvent } from '@testing-library/react';
fireEvent.click(element);
fireEvent.change(input, { target: { value: 'hello' } });
fireEvent.submit(form);
fireEvent.keyDown(element, { key: 'Enter', keyCode: 13 });

3. Mappage Complet de l'API react-dom/test-utils

4. Corrections du Comptage d'Appels StrictMode

React 19 StrictMode n'invoque plus deux fois useEffect en développement. Les assertions d'espion comptabilisant les appels d'effet doivent être mises à jour.

Stratégie toujours mesurer, jamais deviner :

# Lancez le test qui échoue, lisez le comptage réel à partir de l'erreur :
npm test -- --watchAll=false --testPathPattern="[filename]" --forceExit 2>&1 | grep -E "Expected|Received"

// Avant (React 18 StrictMode  les effets s'exécutaient deux fois) :
expect(mockFn).toHaveBeenCalledTimes(2);  // 1 appel × 2 (double-invocation stricte)

// Après (React 19 StrictMode  les effets s'exécutent une fois) :
expect(mockFn).toHaveBeenCalledTimes(1);

// Appels en phase de rendu (corps du composant)  toujours double-invoqués dans React 19 StrictMode :
expect(renderSpy).toHaveBeenCalledTimes(2);  // reste à 2 pour les appels du corps de rendu