在 JS 的编剧测试中丢失上下文

Question

我的问题如下。我在页面上有几个链接，我必须遵循这些链接，然后返回同一页面。我尝试通过以下方式做到这一点：

const els = await page.$$('div[name="olymp"] a'); // get links on the page
        for (let i = 0; i < els.length; i++) {
            await els[i].click(); // clicking on a link that leads to another page
            await page.waitForLoadState('networkidle');
            await page.click('div.floating:nth-child(1)'); 
            await page.click('div.floating:nth-child(1) div.extra a') // a link on another page that leads to the first page
        }

我在第二次迭代时遇到了错误： elementHandle.click: Protocol error (DOM.describeNode): Cannot find context with specified id 也许有人遇到过类似的？ 我正在使用 Playwright v1.13

Answer 1

问题在于循环的第二次迭代，元素句柄已被释放。在页面提交导航后，剧作家和木偶剧资源都会被转储。与其对每个元素句柄进行操作，不如尝试如下操作：

const linksCount = await page.$$eval('div[name="olymp"] a', (links) => links.length);
for (let i = 0; i < linksCount; i += 1) {
    await Promise.all([
        page.$$eval('div[name="olymp"] a', links => links[i].click()),
        page.waitForLoadState('networkidle')
    ]);

    await page.click('div.floating:nth-child(1)');
    await Promise.all([
        page.click('div.floating:nth-child(1) div.extra a'),
        page.waitForLoadState('networkidle')
    ]);
}

请注意，如果实际上单击这些链接会导致导航/页面重新加载，您可能希望使用 page.waitForNavigation 而不是 page.waitForLoadState。每当您执行一些触发导航的操作（例如单击链接）时，将其与上述Promise.all 包装起来被认为是一种很好的做法，以防止出现竞争条件。

来源：

https://playwright.dev/docs/api/class-page#page-wait-for-navigation https://github.com/puppeteer/puppeteer/issues/2258