NodeJS 即使我使用的是Puppeteer提供的索引,Puppeteer在使用第n个子级时仍抛出“未找到选择器的元素”错误

jgwigjjp  于 2023-03-29  发布在  Node.js
关注(0)|答案(1)|浏览(255)

我现在正在和一个我以前没有遇到过的问题作斗争,我试图收集一个产品变量的url,例如mywebsite.com/item/an-item?variant=1234
我的方法是在puppeteer中加载mywebsite.com/item/an-item,计算出有多少个变量,然后循环并点击每个变量(一个输入),然后将url推送到一个数组中,然后继续。
这是我的代码,我已经尝试过等待选择器,以及只是去点击。
只要点击选择器,我就会得到Error: No element found for selector: .swatch.selectors > div > input:nth-child(1),当我等待选择器时,它超时了。

const getVariantUrls = async (url) => {
  const browser = await puppeteer.launch();
  const page = await browser.newPage();
  await page.goto(url);

  const variantUrls = [];
  const variantListLength = (await page.$$(".swatch.selectors > div > input"))
    .length;

  for (let i = 0; i < variantListLength; i++) {
    await page.click(`.swatch.selectors > div > input:nth-child(${i + 1})`);

    // also tried the following
    /** Errors out with:  Waiting for selector `.swatch.selectors > div > input:nth-child(1)` failed: Waiting failed: 30000ms exceeded */
    // const radio = await page.waitForSelector(
    //   `.swatch.selectors > div > input:nth-child(${i + 1})`
    // );
    // await radio.click();

    await sleep(0.5);
    const vurl = await page.url();
    variantUrls.push(vurl);
  }

  await browser.close();
  return variantUrls;
};

我不太明白为什么它找不到一个有效的选择器,因为我使用的是第n个child,puppeteer已经告诉我存在的索引。如果我记录variantListLength,它会给我6个选择器,这正是我所期望的。但是当我使用相同的选择器与nth-child(1-6)时,它每次都出错。

5n0oy7gb

5n0oy7gb1#

找到了这个问题。我通过运行一个非无头的puppeteer浏览器进行调试,注意到如果我向下滚动到选择器,这是工作的,所以看起来网站需要你看到选择器才能点击它们。简单地将默认视口放大,这样选择器就在加载时的框架中,它解决了这个问题。

const browser = await puppeteer.launch({
    args: [`--window-size=1920,1080`],
    defaultViewport: {
      width: 1920,
      height: 1080,
    },
  });

相关问题