Puppeteer 单击没有 id 的元素的父节点

Question

我正在尝试 select 在这个 website 上达到一定的大小，我已经尝试了多种方法，这些方法到目前为止在 puppeteer 中对我有用，但其中 none 似乎在这个实例上工作。我可以打开尺寸选项卡，但不知道如何 select 特定尺寸。

我的代码：

        await page.goto(data[ii][0]), { //the website link
            waitUntil: 'load', 
            timeout: 0 
        }; 

        //part 1

        await page.click('span[class="default-text__21bVM"]'); //opens size menu
        
        let size = data[ii][1]; //gets size from an array, for example 9
        
        // const xp = `//div[contains(@class, "col-3") and text()="${size}"]`;
        // await page.waitForXPath(xp);
        // const [sizeButton] = await page.$x(xp);
        // await sizeButton.evaluate(btn => {
        //     btn.parentNode.dispatchEvent(new Event("mousedown"));
        // });


        await delay(1500);
        await page.evaluate((size) => {
            document.querySelector(`div > div[class="col-3"][text="${size}"]`).parentElement.click()
        });

        await page.click('span[class="text__1S19c"]'); // click on submit button

我的两种方法都没有用。我得到 Error: Evaluation failed: TypeError: Cannot read property 'parentElement' of null 意思是 div 出于某种原因找不到

这是 div 的 html 我想点击：

我尝试了 querySelector 的不同变体，但其中 none 有效，所以我将问题发布在这里，看看这是否可行，或者我是否只是在这个过程中犯了一个错误

Answer 1

这似乎有效：

import puppeteer from 'puppeteer';

const browser = await puppeteer.launch({ headless: false, defaultViewport: null });

try {
  const [page] = await browser.pages();

  await page.goto('https://releases.footshop.com/nike-air-force-1-07-lx-wmns-5iBRxXsBHBhvh4GFc9ge');

  await page.click('span[class="default-text__21bVM"]');

  const size = 9;
  const xp = `//div[contains(@class, "col-3") and text()="${size}"]`;
  await page.waitForXPath(xp);

  const [sizeButton] = await page.$x(xp);
  await sizeButton.click();
  await page.click('span[class="text__1S19c"]');
} catch (err) { console.error(err); }

Puppeteer 单击没有 id 的元素的父节点

Puppeteer click parent node of a element with no id

node.js

puppeteer