Cypress のチュートリアルでDOMのスナップショットが表示されない問題を解決しました

問題

表題の通りです。
Cypress のチュートリアルでDOMのスナップショットが表示されず困っていました。

問題の挙動

本来であればこのような表示なります。

正しい挙動

解決策

対象画面に遷移する処理の次に下記のコードを追記する。

cy.visit("http://localhost:3000")
+ cy.get("#__next").should("be.visible")

参考サイト

• https://stackoverflow.com/questions/73314678/element-is-not-visible-message-when-trying-to-view-test-step-in-cypress

まとめ

普段はplaywirghtを使っていますが、cypressも気になっていたツールなので遊んでみてます。
playwrightよりチュートリアルが充実していて、楽しく学べそう😊