标签: puppeteer

我想在任何一次测试失败时运行一个函数/任务.而不是用try/catch包装我的所有测试或添加if检查,有没有办法可以利用afterEach？

如果测试失败,那么我希望它失败,只需运行一个单独的功能.

例如:

test('nav loads correctly', async () => {
    const listItems = await page.$$('[data-testid="navBarLi"]')

    expect(listItems.length).toBe(4)

    if (listItems.length !== 4)
      await page.screenshot({path: 'screenshot.png'})

  })

这是添加一个if检查...但我希望我的所有测试更健壮.

使用Puppeteer,我想获取具有特定类名的页面上的所有元素,然后循环并单击每个元素

使用jQuery我可以实现这一点

var elements = $("a.showGoals").toArray();

for (i = 0; i < elements.length; i++) {
  $(elements[i]).click();
}

如何使用Puppeteer实现这一目标？

更新

在下面尝试了Chridam的答案,但我无法开始工作(尽管回答有用,所以感谢到那里)所以我尝试了下面这个工作

 await page.evaluate(() => {
   let elements = $('a.showGoals').toArray();
   for (i = 0; i < elements.length; i++) {
     $(elements[i]).click();
   }
});

我有一个 React/Redux 应用程序，我正在使用 Puppeteer 进行测试。根据文档，我使用以下代码来显示控制台输出：

page.on('console', msg => {
    for(let i = 0; i < msg.args().length; ++i) {
        let text = msg.args()[i];
        console.log(`${i}: ${text}`);
    }
});

但是，当 redux-logger 将对象记录到控制台（prevState、nextState）时，Puppeeter 会改为显示JSHandle@object在我的控制台输出中。如何查看此对象中的键和属性？

是否可以使用 Puppeteer 脚本打开页面并与之交互，然后按原样保存该浏览器会话，然后加载另一个脚本并从那里继续？

“浏览器会话”是指当前加载的页面，包括页面状态（DOM 空间和 javascript 变量等）、cookie、本地存储、整个shebang。基本上它需要的一切都在上一个脚本停止的地方继续。

如果没有，那么至少可以导出和导入 cookie 和本地存储吗？因此，我可以重新加载特定页面并继续处理，同时保持任何登录或会话数据完整无缺。

我正在尝试使用 puppeteer 登录https://kith.com/account/login?return_url=%2Faccount 当我登录并使用音频解决验证码时，它会将我检测为机器人，因此我尝试更改请求标头看看这是否有帮助，但找不到任何关于如何改变它们的信息。

我发现了这个，但它只显示 1 个标题：

await page.setRequestInterception(true)

        page.on('request', (request) => {
            const headers = request.headers();
            headers['X-Just-Must-Be-Request-In-All-Requests'] = '1';
            request.continue({
                headers
            });
        });

我们可以明确且具体地捕获 Puppeteer (Chrome/Chromium) 错误吗net::ERR_ABORTED？或者字符串匹配是目前唯一的选择？

page.goto(oneClickAuthPage).catch(e => {
  if (e.message.includes('net::ERR_ABORTED')) {}
})

/*  "net::ERROR_ABORTED" occurs for sub-resources on a page if we navigate
 *  away too quickly. I'm specifically awaiting a 302 response for successful
 *  login and then immediately navigating to the auth-protected page.
 */
await page.waitForResponse(res => res.url() === href && res.status() === 302)
page.goto(originalRequestPage)

理想情况下，这类似于我们可以捕获的潜在事件page.on('requestaborted')

单击 puppeteer 中的元素后，如何等待网络空闲？

const browser = await puppeteer.launch({headless: false});
await page.goto(url, {waitUntil: 'networkidle'});

await page.click('.to_cart'); //Click on element trigger ajax request
//Now I need wait network idle(Wait for the request complete)
await page.click('.to_cart');

UPD：点击元素后没有导航

最后我想出了如何使用 Node.js。安装了所有库/扩展。所以 puppeteer 正在工作，但就像以前使用 Xmlhttp 一样......它只获取页面的模板/正文，没有所需的信息。几秒钟后，页面上的所有脚本都会在浏览器（Web 应用程序？）中打开它。加载整个页面后，我需要获取某些标签内的信息。另外，我会问，是否可以使用纯 JavaScript，因为我不使用 jQuery 之类的代码。所以对我来说难度加倍...

这是我到目前为止所拥有的。

const puppeteer = require('puppeteer');
const $ = require('cheerio');
let browser;
let page;

const url = "really long link with latitude and attitude";

(async () => puppeteer
  .launch()
  .then(await function(browser) {
    return browser.newPage();
})
  .then(await function(page) {
    return page.goto(url).then(function() {
      return page.content();
    });
  })
  .then(await function(html) {
    $('strong', html).each(function() {
      console.log($(this).text());
    });
  })
  .catch(function(err) {
    //handle error
  }))();

我只在强标签中获得模板默认正文元素。但它应该包含比 10 个项目更多的数据。

我需要使用 Puppeteer 获取网站保存的所有数据：cookies 和 localStorage（例如登录后）。我已阅读所有 Puppeteer 文档，但找不到有关 localStorage 的任何信息。

我可以获取 cookie，但我不知道如何获取 localStorage。例如：

const puppeteer = require('puppeteer');

(async () => {
  const browser = await puppeteer.launch()
  const page = await browser.newPage()
  await page.goto('https://www.twitter.com/')

  //
  // code for login
  //

  const returnedCookie = await page.cookies();  
  console.log(returnedCookie)
  // const localStorage = ??
  // console.log(localStorage)

  await browser.close()
})()

我正在尝试测试一个带有回调的函数。我设置了一个模拟函数，但我还需要测试一个回调。

我试图将它作为另一个模拟函数分开，但它不算作覆盖。

我正在尝试测试的功能：

export const checkDescription = async page => {
    const metaDescription = await page.$eval(
      'meta[name="description"]',
      description => description.getAttribute("content")
    );
    return metaDescription;
};

我嘲笑了页面功能：

const page = {
  $eval: jest.fn(() => "Value")
};

我的测试：

test("Should return description", async () => {
  expect(await checkDescription(page)).toBe("Value"); 
  expect(page.$eval).toHaveBeenCalled();
});

我试图分开描述：

const description = {
  getAttribute: jest.fn(() => "Value")
};  

但我不认为这是在 $eval 中覆盖描述的正确方法。