Chrome拡張「Puppeteer Recorder」を使って簡単にブラウザの自動操作を行う

Puppeteer RecorderというChrome拡張がリリースされたので試しに使ってみました。

GitHub: checkly/puppeteer-recorder

概要

Puppeteer Recorderは、ブラウザで行った操作を記録してPuppeteerのコードを出力してくれるChrome拡張です。

似たようなChromeの拡張にSelenium IDEがあったりします。

使い方

READMEの画像にあるように、拡張機能を入れて「Record」をクリック、その後試したい操作をしてから「Stop」をクリックするとコードが出力されます。

実際に使ってみた感想

すでに使ってみた感想を書いてくれている記事（「Puppeteer Recorder」を試してみた - masalibの日記）がありますが、自分もだいたいこの記事と感想は同じでまだ不安定なところがあるな、という印象です。

例えば文字入力のイベントが取得されにくかったりします。これは、READMEにもあるように入力後にtabを叩く必要があります（READMEのUsageに Hit tab after you finish typing in an input element. とある）。

これ以外にも若干意図した動作が記録されないことがありましたが、まぁリリースされたばかりなので仕方ないかな、と思います。

さいごに

Puppeteerは使い勝手が良いので、この調子で周辺ツールが豊富になってくると嬉しいですね。

ちなみに余談ですが、Puppeteer RecorderはVue.jsで書かれています。ちょっとしたポップアップを作るには、やはりVueくらいの手軽さが優れていそうですね。