Question

我正在尝试等待弹出窗口完全加载，然后再继续操作，但是我不确定如何完成此操作，当前我正在使用await page.waitFor(3000);。有没有更优雅的方法可以执行此操作，然后等待弹出窗口完全加载，然后继续操作。

下面是我与代码相关的部分。

        await page.evaluate(async () => {
          await $('#myDataExport').click();
          await $('.export-btn a').click();
        },);
        await page.waitFor(3000);
        const browserPages = await browser.pages();
        const exportPopup = browserPages[browserPages.length - 1];

我也尝试使用以下内容

await Promise.all([
 await page.click('.export-btn a'),
 await page.waitForNavigation({ waitUntil: 'networkidle2' }),
]);

但是我收到错误消息Error: Node is either not visible or not an HTMLElement

在这方面的任何帮助都将非常有用，谢谢。

Answer 1

我试图举一个可行的例子。您可以忽略请求拦截代码。

const puppeteer = require('puppeteer')

;(async () => {

    const browser = await puppeteer.launch({headless: false})
    const [page] = await browser.pages()

    // This network interception due to massive ads on the page
    // You can remove this if you like, as this is just an example
    // page.setRequestInterception(true)
    // page.on('request', request => {
    //    if (request.url().startsWith('https://www.w3schools.com/')) {
    //        request.continue()
    //    } else {
    //        request.abort()
    //    }
    // })

    await page.goto('https://www.w3schools.com/tags/att_a_target.asp', {waitUntil: 'domcontentloaded'})
    const [popup] = await Promise.all([
        new Promise(resolve => page.on('popup', resolve)),
   
        // THE LINES COMMENTED BELOW IS JUST AN W3SCHOOL EXAMPLE
        // page.waitForSelector('a[target="_blank"].w3-btn.w3-margin-bottom'),
        // page.click('a[target="_blank"].w3-btn.w3-margin-bottom'),
    
        // YOUR CODE SHOULD LIKE THIS
        page.waitForSelector('.export-btn a'),
        page.click('.export-btn a'),
    ])

    await popup.waitForSelector('#iframeResult')
    await popup.screenshot({path: 'targetpopup.png'})
    await popup.close()

    await browser.close()

})()

Answer 2

您是否尝试过：browser.once与targetcreated目标域事件？

调用target.page()将Puppeteer连接到该标签并生成一个Page对象。

点击后不会立即打开新标签页。等待事件的一种方法是创建新的承诺。 [source]

示例：

const newPagePromise = new Promise(resolve => browser.once('targetcreated', target => resolve(target.page()));
await page.click('.export-btn a');
const newPage = await newPagePromise;

操纵wait的人等待弹出页面完全加载后再继续

2 个答案: