導入

これで導入するとChromiumの最新バージョンが含まれる。

npm i puppeteer

puppeteer-coreで導入するとChromiumは含まれない。

npm i puppeteer-core

動かしてみよう

以下はほとんどドキュメント内のサンプルのまま。

import puppeteer from 'puppeteer';

(async () => {
  const browser = await puppeteer.launch({ headless: true });
  const page = await browser.newPage();
  await page.goto('https://qiita.com/');

  await page.screenshot({ path: 'screenshot.png'});
  await page.pdf({ path: 'hn.pdf', format: 'a4' });
  await browser.close();

})();

browserオブジェクトを作成、pageオブジェクトを作成、page.gotoで移動し、page.screenshotでスクリーンショットを作成、page.pdfでpdfを作成する。

headlessオプションをfalseにすることでヘッドレスではなく見える状態でブラウザが起動する。

表示されるのを待ってからクリック

waitForNavigation([option])で遷移先が開くのを待つ。

await Promise.all([
  page.waitForNavigation(),
  page.click('a')
]);

特定の要素の出現を待ちたい場合は以下のようにwaitForSelectorを使う。

await Promise.all([
  page.page.waitForSelector(selector),
  page.click('a')
]);