12
2

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 1 year has passed since last update.

株式会社オーイーシーAdvent Calendar 2023

Day 18

テスト自動化ツールのPlaywrightについて学んだ結果

Last updated at Posted at 2023-12-12

はじめに

社会人10年目になり、ソフトウエア開発系の会社に転職したはいいものの、「コーディングまるでわからん(´・ω・`)」状態に陥ってしまった中の人です。

前職の会社もソフトウエア開発系ではあったものの、社会人4年目くらいから転職するまで、ずっと開発もしなけりゃ設計もしない、そんな別の会社に出向していたので、VSCode すら触ったことがありませんでした。

CSS とか JavaScript とか HTML とか学んではみましたが、やはりちんぷんかんぷん。一から作り上げることの難しさを痛感したものです。
見かねた上長が、助け舟を出してくれて、とあるテスト自動化ツール使ってみてほしいと言ってくれました。

ツール何使ったの

Playwrightをとりあえず使ってみました。
社内の勉強会で紹介されていたというのと、上述した上長からの勧めでとりあえずこれからはじめてみました。

Playwrightの特徴

どういうシーンで使うのか

Playwrightは、以下のシーンで使われます。

  1. ブラウザテスト: 自動化されたブラウザテストスクリプトの作成や実行をするとき。
  2. スクレイピング: ウェブサイトからデータを収集するためのスクレイピング作業をするとき。
  3. UIテスト: ユーザーインターフェースの動作や表示をテストをするとき。
  4. クロスブラウザテスト: 複数の主要なブラウザでのテストをカバーするとき。
  5. パフォーマンステスト: ブラウザのパフォーマンスや負荷に関するテストを実施するとき。

一からコードを書かなくていい

Excelマクロを作るときのごとく、画面をポチポチすると勝手にコードを作ってくれます。
多少の手直しが必要なケースは発生しますが、一からコーディングしなくて済むのはコーディングあまり出来ない勢からしたらとてもありがたい話です。

お値段フリー

やはりイニシャルコスト、ランニングコストが不要だといろいろ試せて良いですね。

マルチブラウザサポート

以下のブラウザに対応しているようです。一気に複数のブラウザでテストすることも可能です。

  • Chromium
  • WebKit
  • Firefox

マルチOSサポート

よく使われる OS には対応されています。

  • Windows
  • macOS
  • Linux

歴史が浅く書籍が無い(技術書は紙でも読みたい派なので、個人的に困ったのがこれです)

2020年に誕生した Playwright ですが、まだ歴史が浅いためこれに特化した書籍は2023年12月時点では発売されていません。Qiita記事やZenn記事ではいろんな人が書いてくれていますが、Selenium や Puppeteer のように書籍で学びたい人はまだまだ時間がかかりそうです。

他のテスト自動化テストツールは?

他のE2Eテスト

  • Selenium:Playwright と似たようなテスト自動化ツールで、歴史もあり、書籍も充実している。

  • Puppeteer:Chrome のみのサポートではあるが、従来から利用されている自動化ツールである。ただ、現時点で Playwright ではできないが、 Puppeteer でできるというものはほぼない模様。

npm trends(npm上に登録されているパッケージのDL数の変遷をグラフとして可視化できるWebサイト)で、それぞれどのくらい使われているか見てみたところ・・・
https://npmtrends.com/playwright-vs-puppeteer-vs-selenium-webdriver

2023年12月3日時点ではまだまだ Puppeteer が大人気ですね。
ただ、このグラフの遷移を見る限り Playwright と Puppeteer のDL数逆転が起きるのも時間の問題かもしれません。
今から新しく学ぶなら Playwright がよいのかもしれません。きっと今後書籍やQiita記事がどんどん増えていくでしょう。

最後に

  • 社内の勉強会(動画の視聴)で1時間ほど使い方を学んでいたものの、そのときの情報から Playwright アップデートしていたため、結局公式サイトをかなり読み込むことになりました。
  • 記述方法は JavaScript か TypeScript が選べたのですが、TypeScript が JavaScript のスーパーセットだからという理由で TypeScript をチョイスしました。おかげで、TypeScript についても多少学ぶ羽目ことになりました。
  • Puppeteer と Playwright のどっち使うか?みたいな状態になった場合、Playwright を選択するのがベターのようです。
  • 技術記事をQiitaのような情報共有サービス上で書くという機会が今回もらえましたが、自分が学んだことの棚卸的なこともでき、Markdown も使うことができたので、アウトプットすることの大事さを久しぶりに体感しました。
12
2
3

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
12
2

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?