Puppeteer + TypeScriptでUIのテストを行う

設計の勉強会だったりbuildersconだったりで刺激的な話たくさん聞いたりできたりして、書きたいことはたくさんありますが結構文量がいる話で、普段の業務の忙しさにかまけて何もアウトプットしないということになりがちなので普段の業務で使っているようなライトなものでもアウトプットしていこうと思います。

Puppeteer + TypeScriptのテンプレート

画面があるアプリケーションを業務で作っていると粒度の大小はあれ手動や自動化などでUIのテストを行っていると思います。

そんな後者を便利に行えるツールでPuppeteerがありますが、私はチーム開発では型が欠かせないと思っているのでTypeScriptで書きたくなります。

そんなPuppetter+TypeScriptですがプロジェクトごとに都度用意するのはめんどくさいのである程度まで下処理してあるtemplate的なものをよく自分のGithubにあげています。

それがこちらです。

yarnを叩いたあとにyarn testを実行すればsampleのテストが1つ走ることの確認ができますので、確認ができたらあとはxxx.test.tsをお好みで作っていただいてガツガツ書いていくだけです。

どこかで誰かの役に立てば幸いです