【Node】人形使い（puppeteer）

Puppeteer は Chrome を制御するノードライブラリ。
RPA（ロボティクプロセスオートメーション）として、Webの定型作業を自動化・代行できる。
もちろん Webのテストを自動化することも可能。

Get Start

初期化と Puppeteer インストール

# プロジェクトを初期化する。
% npm init -y
# インストール
% npm i puppeteer

スクリプト作成

Googleのトップページのスクショを撮る簡単なサンプル。
index.js

const puppeteer = require('puppeteer');

(async () => {
  const browser = await puppeteer.launch({
    headless: true // 画面表示 true:なし / false:あり
  });
  const page = await browser.newPage(); // ブラウザの新しいページを開く
  await page.goto('https://www.google.co.jp', { waitUntil: 'domcontentloaded' }); // ページ遷移
  await page.screenshot({ path: 'scsho.png' }); // 画面のスクショ
  await browser.close(); // ブラウザを閉じる
})();

headless: false にすると、実際の動きが確認できる。

スクリプトの実行

scsho.png にスクショが保存される。

% node index.js

---

よく使う機能

セレクターの指定方法

セレクターにはいくつかの指定方法がある。

セレクタ	要素	説明
#id	<input id="id">	この id を持つ要素に合致
.class	<input class="class">	この class を持つ要素に合致
a[href^="index.html"]	<a href="index.html">...</a>	index.html 始まりの href を持つ a タグ
input[name="login_id"]	<input name="login_id">	name が login_id の input タグ

ページ遷移

await page.goto(遷移先URL);
await page.goto(遷移先URL, { waitUntil: 'domcontentloaded' });

下はDOMの読み込み完了まで待たせる指定。

ページ遷移待ち

await page.goto(遷移先URL);
// await page.waitForNavigation();
await page.waitForNavigation({ timeout: 60000, waitUntil: 'domcontentloaded' });

下はタイムアウト60秒でDOMの読み込み完了まで待たせる指定。
ただし、リアクタブルなサイトで、見た目が変わっても画面遷移がない場合は処理できない。

入力

await page.type(セレクタ, 文字列);

クリック

ボタンもチェックボックスもラジオも。

await page.click(セレクタ);

値の取得

var value = await page.$eval(セレクタ, x => x.value);

ミリ秒遅延

await page.waitforTimeout(2000); // 2秒待ち