Le test échoue car aucune instruction waitFor n'est placée avant findBy dans la bibliothèque de tests React.

Question

render(view)
let timerCellsList;
await waitFor(() => {
  lockCellsList = screen.getAllByTestId('TimerCell');
  expect(lockCellsList).toHaveLength(2);
});

const startTimerButton = within(timerCellsList[1]).getByRole('button');
userEvent.click(startTimerButton);
await waitFor(() => {}, {timeout: 0}); // 测试通过了，没有这行就失败了。
                                       // 我可以设置超时时间为任意数字，包括0。
const activeTimer = await screen.findByRole('cell', {name: /00:00/i});
expect(activeTimer).toBeInTheDocument();

J'ai écrit un test dans lequel l'utilisateur clique sur un bouton. Le bouton envoie une requête réseau, et si 200 est renvoyé, une minuterie s'affiche et commence à compter en secondes. J'utilise MSW pour renvoyer une réponse fictive. La requête réseau étant évidemment asynchrone, je recherche ce timer en attendant que screen.findByRole soit appelé. Le problème que j'ai est que le test ne réussit que lorsque userEvent.click(startTimerButton)和调用await screen.findByRole('cell', {name: /00:00/i})之间调用await waitFor(() => {}) est appelé. Il semble que ce test ne réussisse que si je le laisse dormir un moment avant de chercher la minuterie. Je ne comprends pas pourquoi je ne peux pas démarrer le minuteur de recherche immédiatement.

Sans l'instruction waitFor, le message d'erreur que je reçois est :

Erreur : renvoie : "Le délai d'attente du test a dépassé 5 000 ms. S'il s'agit d'un test de longue durée, utilisez jest.setTimeout(newTimeout) pour augmenter la valeur du délai d'attente. " var evt = document.createEvent('événement'); TypeError : Impossible de lire la propriété 'createEvent' de null

Est-ce que quelqu'un connaît la raison ? J'aurais aimé ne pas avoir à le contourner comme je le fais maintenant.

J'ai également essayé de changer mon wait findBy en un getBy enveloppé dans une instruction waitFor, mais cela n'a pas fonctionné non plus. Il semble que je dois juste le laisser dormir pendant un moment, puis commencer à chercher.

Answer 1

Ce qui vous manque dans cette ligneawait :

userEvent.click(startTimerButton);

Alors essayez-le :

await userEvent.click(startTimerButton);

Depuis la version 14, userEvent l'API est asynchrone.