React テスト ライブラリの findBy の前に waitFor ステートメントが配置されていないため、テストは失敗します。

Question

rree

ユーザーがボタンをクリックするテストを書きました。このボタンはネットワーク リクエストを送信し、200 が返されるとタイマーが表示され、秒単位でカウントを開始します。 MSW を使用して模擬応答を返しています。ネットワークリクエストは明らかに非同期なので、screen.findByRole が呼び出されるのを待ってこのタイマーを検索します。私が抱えている問題は、userEvent.click(startTimerButton) を呼び出して await screen.findByRole('cell', {name: /00:00/i}) を呼び出した後にのみ機能することです。 テストは、await waitFor(() => {}) が呼び出された場合にのみ合格できます。このテストは、タイマーを検索する前にしばらくスリープさせた場合にのみ合格するようです。検索タイマーをすぐに開始できない理由がわかりません。

waitFor ステートメントを使用しないと、次のようなエラー メッセージが表示されます:

エラー: スロー: 「テストのタイムアウトが 5000 ミリ秒を超えました。 長時間実行されるテストの場合は、 jest.setTimeout(newTimeout) を使用してタイムアウト値を増やします。 」 var evt = document.createEvent('イベント'); TypeError: null のプロパティ 'createEvent' を読み取れません

理由を知っている人はいますか?今みたいにぐるぐる回らなくてもよかったと思います。

また、await findBy を waitFor ステートメント内にラップされた getBy に変更しようとしましたが、それも機能しませんでした。しばらく寝かせてから探すしかないようです。

Answer 1

この行には await がありません:

リーリー

それで試してみてください:

リーリー

バージョン 14 では、userEvent API は非同期です。