用 Puppeteer 的 page.evaluate 来检查元素的可见性和可点击性

15 min read

使用 Puppeteer 的 page.evaluate 方法可以在浏览器环境中执行 JavaScript 代码。我们可以使用这个方法来检查元素的可见性和可点击性。

要检查元素的可见性,可以使用以下代码:

const isVisible = await page.evaluate((selector) => {
  const element = document.querySelector(selector);
  return element && element.offsetParent !== null;
}, '#element-selector');

上述代码首先通过 document.querySelector 方法获取要检查的元素,然后使用 element.offsetParent 属性来判断元素是否可见。如果元素存在且 offsetParent 不为空,则表示元素可见。

要检查元素的可点击性,可以使用以下代码:

const isClickable = await page.evaluate((selector) => {
  const element = document.querySelector(selector);
  return element && !element.disabled && !element.readOnly;
}, '#element-selector');

上述代码通过 document.querySelector 方法获取要检查的元素,并检查元素的 disabled 和 readOnly 属性来判断元素是否可点击。如果元素存在且 disabled 和 readOnly 均为 false,则表示元素可点击。

请确保将上述代码中的 "#element-selector" 替换为要检查的元素的选择器。