ゆるりとねっと。

ヲタクなワーママのゆるゆる雑記ブログ

いきなりpuppeteerに触ってみたメモ

業務でpuppeteerを試しているのですが、その過程でプライベートでちょっとやってみたいことを思いついたので自宅の個人PCにも入れて遊んでみることにしました。ちなみにWindowsです。
github.com

準備

Node.jsインストール

ちなみにNode.jsも何それ美味しいの状態でとりあえず下記手順に沿って入れてみた感じなので、もう少しちゃんと勉強したいなと思います。。
qiita.com

puppeteerインストール

Node.js command promptで以下打ち込むだけ。

npm i puppeteer

あら簡単。

動かしてみる

あとはこちらの記事や公式サンプルなどからアレンジしてどんなもんか試してみました。
qiita.com

試したコード例

Googleで「銀座 子連れ ランチ」を検索し、検索結果ページをスクショする
const puppeteer = require('puppeteer');
puppeteer.launch({
  headless: false,
  args: [
    '--no-sandbox',
    '--disable-setuid-sandbox'
    ],
  slowMo: 200 // slow down by 250ms
}).then(async browser => {
  const page = await browser.newPage();

  await page.goto('https://www.google.co.jp/',{waitUntil: 'networkidle2'});
  await page.waitFor('input[type="submit"]');
  await page.type('input[type="text"]','銀座 子連れ ランチ');
  await page.click('input[type="text"]');
  await page.click('input[type="submit"]');
  await page.screenshot({path: '../../pictures/cap/search_result.png'});
  browser.close();
});

headless:falseにしてヘッドレスブラウザが立ち上がって閉じるまでを見ながら確認すると、途中まではうまくいくものの、検索窓に打ち込んだ際に表示されるサジェストの3件目あたりがクリックされていました。。
f:id:tomo-sankaku:20180131013101p:plain:w400
f:id:tomo-sankaku:20180131013844p:plain:w400
うーん、なんでだろ。