CypressでStorybookのcavasに表示されているページのフルスクリーンのキャプチャを撮りたい しかし、このページのURLでは左にコンポーネントツリーが見えているし、下までスクロールすることができない ちょっと調べた結果、左上のアイコンを押すとcanvasだ…

Cypressを使ってE2Eテストを行う その時調べたCommandのメモ ラジオボタン、チェックボックスをチェックする check | Cypress Documentation cy.get('[type="checkbox"]').check() cy.get('[type="radio"]').first().check() ２要素目をチェック cy.get('[ty…

CypressでE2Eテストを行う際にスマホのテストをしたい スマホのテストとは以下をスマホアクセスと同様に設定してテストをする user-agent：chromeの開発者モードのiPhone 6/7/8 Plusにしたときと同じに viewport：iPhone6の414 x 736に user-agent やり方① c…

Cypressには値が確かかどうかを調べるための様々なassertionが用意されている docs.cypress.io その中でもパッと出てこなかったassertionをメモっておく セレクトボックスで選択されている値 URLに含まれているクエリ セレクトボックスで選択されている値 ht…

Cypressで404ページに遷移することを確認したいケースがある ただCypressdeではデフォルで404ページに遷移するケースはテストが失敗で終わるので、これを失敗にしないようにしたい failOnStatusCodeを使う 結論 Cypress.request() のfailOnStatusCodeオプシ…

Cypressをローカルで試したときはうまくいったが、GCP上のCloud Buildで動かそうとしたら失敗した uga-box.hatenablog.com ログは以下 Step #1: Step #1: Running: sample.spec.js (1 of 1) Step #1: Step #1: Step #1: country Step #1: [428:0806/021104.4…

Cypressを使ってE2Eテストを実施することにしたが、これをCloud Buildで実施したい uga-box.hatenablog.com 考えているフロー Cypressのdocker imageをCloud Buildで利用する そして、Cloud BuildでCypressを実行したあと、ScreenshotをGCSに登録する ローカ…

Cypressで画面のScreenshotを取得する その際に、以下の設定を行いたいので設定の仕方を調査 Screenshot取得前に前回のファイルを消したい Screenshotの出力先を変更したい Screenshotを取得するタイミングを延ばしたい docs.cypress.io 設定 やりたいこと …

Cypressでfull screenshotを指定した場合、viewport分スクロールをしてスクリーンショットを撮り、それを繋ぎ合わせる そのため、position: fixedまたはposition: stickyのコンテンツが最終的なスクリーンショットに複数回表示されることになる これを制御す…

Web UI の自動テストツールいわゆるE2Eテストツールの一つにCypressというのがあることを知った Storybookを活用したテストを考えていて、StorybookとJestやPuppeteerをつかったe2eテストは聞いたことがあるが、StorybookとCypressはあまり聞いたことがなか…