Puppeteer入門 Googleの検索結果を表示するサンプルアプリ

はじめに

Puppeteerの使い方メモ。
アプリのセットアップから、Google検索できるまでの方法をメモ。

事前作業

Node.jsをインストールしておくこと。

手順

• 任意のフォルダを作成し、移動。
• 以下のコマンドを実行し、npmを初期化＆Puppeteerインストール

npm init

~その後、アプリ名等を記載（ここでは省略）~

npm install puppeteer

• test.jsをファイルを作成。

test.js

const puppeteer = require('puppeteer');

(async () => {
const browser = await puppeteer.launch({
  headless: false,
  defaultViewport: { width: 2048, height: 1048 }
});
const page = await browser.newPage();

// Goolgeのページに移動
await page.goto("https://www.google.co.jp/");

// 検索ワードを入力　以下の例では"Puppeteer"
await page.type('input[title="検索"]', "Puppeteer", { delay: 50 });

//　検索ボタンをクリック
await page.evaluate(() => {
  document.querySelector('input[value^="Google"]').click();
});

// ページ遷移を待ちます。
await page.waitForNavigation({timeout: 600000, waitUntil: "domcontentloaded"});

  console.log('検索結果がブラウザに表示されました。');
})();

• 以下のコマンドで実行

$ node test.js