无效的选择器/错误：找不到选择器的节点

Question

我正在尝试使用我的代码使用 puppeteer 单击按钮，但由于某种原因，该按钮始终无法找到（无效选择器/错误：找不到选择器节点）或 waitFor 过期，这是我的代码：

const puppeteer = require('puppeteer');

const product_url = "https://www.amazon.co.uk/Usoun-Multi-Angle-Heat-Vent-Adjustable-Compatible/dp/B086HNM8F7/ref=sr_1_7?crid=16VVWBHJOOAYE&keywords=laptop+stand+adjustable&qid=1645642193&sprefix=laptop+stand+adjustable%2Caps%2C75&sr=8-7"

async function givePage(){
const browser = await puppeteer.launch({headless: false});
const page = await browser.newPage();
return page;
}
async function buyNow(page){
await page.goto(product_url);
await page.waitFor(20000);
await page.click("button[class='a-button a-button-oneclick a-button-icon onml-buy-now- 
button buybox-button-enhancement-size']", elem => elem.click());
}
async function checkout(){
var page = await givePage();
await buyNow(page);
}
checkout();

Answer 1

运行此代码时，我遇到了一些问题：

• 需要接受 Cookie 同意（加载页面时弹出大窗口）
• 按钮的选择器是正确的，但要使其工作，您需要单击
  在它的父元素上。

幸运的是，亚马逊在其元素中使用了大量的 id，我建议您只要 id 在页面加载之间保持不变（通常是这样！），就始终使用该 id。

这是固定代码

const product_url = "https://www.amazon.co.uk/Usoun-Multi-Angle-Heat-Vent-Adjustable-Compatible/dp/B086HNM8F7/ref=sr_1_7?crid=16VVWBHJOOAYE&keywords=laptop+stand+adjustable&qid=1645642193&sprefix=laptop+stand+adjustable%2Caps%2C75&sr=8-7"

async function givePage() {
    const browser = await puppeteer.launch({ headless: false });
    const page = await browser.newPage();
    return page;
}

// helper function which checks for a possible cookie popup (in puppeteer this will always occur except you work with `data_dir` property.
async function acceptCookies(page) {
    try {
        console.log('try accepting cookie consent.')
        // accept cookies. Button is clickable via id!
        const btn = await page.waitForSelector('#sp-cc-accept')
        await btn.click()

        console.log('Cookie consent accepted!')
    } catch(err) {
        console.error('Could not accept cookies..')
    }
}

async function buyNow(page) {

    // using networkidle0 for waiting for the page to be loaded correctly.
    // No other waiting needed then!
    await page.goto(product_url, { waitUntil: 'networkidle0'})

    // make sure to accept cookies on page load
    await acceptCookies(page)

    // the very parent element of the ID button makes the click finally work.
    // clicking on the input itself did not work for me
    const selector = '#buyNow_feature_div'

    // use waitForSelector in case something gets rendered. This 
    // returns the element immediatly if found. 
    const el = await page.waitForSelector(selector)

    // element handles can directly be pressed!
    await el.click()

    // wait for the navigation to occur!.
    await page.waitForNavigation()

    console.log('naviagtion done..')
    // show an alert after the buy button was clicked..
    await page.evaluate(() => alert('Buy button was pressed!'))
   
    // ... other code
    
    // await browser.close()

}

async function checkout() {
    var page = await givePage();
    await buyNow(page);
}


checkout();