Puppeteerでボタンをクリックする

Puppeteerの基本的な書き方をコーディング例で紹介します。
Puppeteerでボタンをクリックします。

Puppeteerの基本的な書き方は過去記事を参照ください。
www.kennejs.com


ボタンをクリックするときの書き方

f:id:aonion2:20190205012425p:plain
f:id:aonion2:20190205012450p:plain

画像みたいなinputタグでtype属性が付いているようなボタンはpuppeteerのpage.click()で押すことができます。

await page.click('input[type="submit"]');


aタグでbuttonクラスが属性に含まれている場合は以下のような方法でclickできます。

const loginButton = await page.$('a.button');
await loginButton.click();

Puppeteerでボタンをクリックできない場合

基本的にボタンは上記のどちらかで押せますが、Webサイトによってはうまくクリックできないことがあります。
その場合は下の「タグで探してボタンをクリックする」試してみてください。


タグで探してボタンをクリックする

f:id:aonion2:20190205012343p:plain
画像はこのブログですが、Categoryの「ライフハック」をクリックする場合は以下のようなコーディングをします。

「ライフハック(3)」はaタグぐらいしか情報がないので、aタグを使っている要素を抽出して部分一致で検索します。

const linkLifeHack = await page.$$('a');
let text = [];
let indicator = "";

for (let i = 0; i < linkLifeHack.length; i++) {
  tagText1.push(await (await linkLifeHack[i].getProperty('textContent')).jsonValue())
  if(text[i].match(/ライフハック/)){
    indicator = i;
    break;
  }
}
linkNodeJs[indicator].click();

aタグだけでなくても色々なタグで実践可能です。力技ですが、以下の記載を繰り返せば概ねスクレイピングは達成できます。

是非試してみてください。