Open13

スナップショットテストの導入検討

たにたに

フロントエンドのリファクタリングを進めるためにスナップショットテストをしたい。調査して、できたら試す!

たにたに

「正解のデータ」を用意するのも自動でやりたいなあ…
productionやmasterブランチをクロール=正解のデータ
リファクタリングしたブランチをクロール、正解のデータと比較

たにたに

ありがたい〜この通り触ってみる

https://qiita.com/ThanhLe/items/fabd16539b80399a1a50

jest --verbose true

  • jest
    • 全てのテストを実行する(既定値)
  • --verbose
    • 各テストごとの結果をテストスイートの階層構造とともに表示します。

https://jestjs.io/ja/docs/cli

たにたに
20 error code ELIFECYCLE
21 error errno 1
22 error jest-puppeteer-202108@1.0.0 test: `jest --verbose true`
22 error Exit status 1
23 error Failed at the jest-puppeteer-202108@1.0.0 test script.
23 error This is probably not a problem with npm. There is likely additional logging output above.

https://qiita.com/frost_star/items/83d58072374d61de9e10

テストが失敗してExit status 1 が出ていることによってnpm ログがエラーだって言ってる?

npm run test --silent

でOK

たにたに

そのままだと失敗したし、同じように検索結果を48個取得するセレクタの特定はしていないけど、
セレクタ変えたらテストできていることはわかったのでOK!

たにたに

テストの効率や実行時間を一旦無視すれば、
これで
DEVの特定ページの操作 → 特定DOMの中身 = expectValue
ローカルの特定ページの操作 →特定DOMの中身 = testValue

expect(testValue).toBe(expectValue);

でいけそう!