Puppeteer：点击网站上的按钮不起作用

Question

我正在尝试为 puppeteer 找到相应的代码来自动按下按钮。

在用户脚本中可以通过

轻松完成

document.getElementsByClassName("details-cart-button btn btn-primary btn-block btn-lg d-flex justify-content-center tp-button ")[0].click();

然而，我正在努力使用木偶操作来复制相同的行为。

到目前为止我尝试了什么：

//Try 1:
await page.click('a[class="details-cart-button btn btn-primary btn-block btn-lg d-flex justify-content-center tp-button "]');

//Try 2:
await page.$eval('a[class^="details-cart-button"]', el => el.click());

//Try3: 
const form = await page.$('id#add-to-cart-form');
await form.evaluate( form => form.click() );

//Try4: 
await Promise.all([
await page.click('#add-to-cart-form > a.details-cart-button.btn.btn-primary.btn-block.btn-lg.d-flex.justify-content-center.tp-button')
]);

None 的方法似乎很糟糕，我不知道如何完成它。

谁能给我指出正确的方向？

非常感谢！

Answer 1

下面的代码应该可以工作。

const puppeteer = require('puppeteer');

(async ()=>{
  const browser = await puppeteer.launch({headless:false});
  const [page] = await browser.pages();
  await page.goto('https://www.alternate.de/html/product/1685585');

 
  const acceptCookiesSelector='button[class="cookie-submit-all"]';
  await page.waitForSelector(acceptCookiesSelector);
  await page.click(acceptCookiesSelector);

  const buySelector='a[class="details-cart-button btn btn-primary btn-block btn-lg d-flex justify-content-center tp-button "]';
  await page.waitForSelector(buySelector);
  await page.click(buySelector);

})();

我会尝试解释为什么您的代码不起作用。

您在页面上使用的点击方法滚动到您要点击的视图元素并使用鼠标左键点击它，在您的情况下，按钮在视图中，但它被遮盖了通过接受 cookie 横幅，所以您所要做的就是单击接受 cookie 以摆脱该横幅，然后单击购买按钮，它就会起作用。

您的第一个示例之所以成功，是因为浏览器控制台中的点击方法与 Puppeteer 上使用的方法不同，并且之所以成功，是因为它不依赖鼠标来生成点击。

Puppeteer：点击网站上的按钮不起作用

Puppeteer: Clicking button on a website doesn't work

forms

button

puppeteer