Playwrightで画面遷移を待ってスクショする方法を知りたい
解決したいこと
テスト自動化ツール・Playwrightのスクレイピングをしようとしています。
特定の操作後、ページ遷移を待ってスクショを撮る方法を教えて欲しいです。
やりたいこと
1.ChromiumでGoogleニュースのページを開く
2.検索に任意の検索ワード「大谷翔平」を入力する
3.検索ボタンを押す
4.遷移後の画面でスクショを撮る
起きている問題
クリックはできるものの、ページ遷移を待たずにスクショしてしまう。
実装したコード
const { chromium } = require('playwright');
(async () => {
const browser = await chromium.launch({ headless: false, slowMo: 100 });
const context = await browser.newContext();
const page = await context.newPage();
//Googleニュースのトップに遷移する
await page.goto('https://news.google.com/topstories?hl=ja&gl=JP&ceid=JP:ja');
//検索窓に任意のキーワード「大谷翔平」を入力
await page.fill('input[jsname="dSO9oc"]','大谷翔平');
//検索用の虫眼鏡ボタンをクリックし、遷移を待つ
await Promise.all([
page.click('//*[@id="gb"]/div[2]/div[2]/div/form/button[4]'),
page.waitForNavigation(),
]);
//遷移後のページでスクショを撮る
await page.screenshot({ path: 'shotaniNews.png'});
await browser.close();
})();
自分で試したこと
SeleniumだとThread.sleepやエレメントの表示を待つことでなんとかなりそう。似たようなクラスがないかなと思い、他の方の記事を参考にしながらwaitForNavigationを使ってみましたが、だめでした。
ちなみに、playwright利用は初日です。
しかもjavaScriptはあまり経験がないので、何が間違っていて何が正しいかもよくわかっていません。
ご教示のほど何卒よろしくお願いいたします。
0
