Playwright页面对象模型中条件代码实现问题求助

给你梳理几个核心问题和对应的解决办法：

1. 先确认选择器是否真的能匹配元素 #

直接打开浏览器控制台，输入document.querySelectorAll('.s-wrapper.s-wrapper_placeholder')，看返回的NodeList长度是否大于0。如果控制台都找不到元素，那肯定是选择器写错了——比如有没有漏了父元素限制？或者元素类名是动态生成的，你写的静态类名不匹配？

如果元素在iframe里，定位器得先切换到iframe，示例：

this.pagePlaceholder = page.frameLocator('iframe[name="目标iframe名称"]').locator('.s-wrapper.s-wrapper_placeholder');

2. count()返回0大概率是元素未加载完成就调用了 #

Playwright的Locator是惰性求值的，但如果元素是动态渲染的，刚进入页面就调用count()，可能元素还没挂载，所以返回0。可以加个短超时等待，既不会因元素不存在报错，又能等元素加载：

async clearUpPage() {
  // 等待2秒看元素能否挂载，超时则跳过
  try {
    await this.pagePlaceholder.waitFor({ state: 'attached', timeout: 2000 });
  } catch (e) {}

  const placeholdersNumber = await this.pagePlaceholder.count();
  console.log(placeholdersNumber);

  if (placeholdersNumber < 1) {
    await this.mainSection.hover({
      position: { x: 200, y: 150 },
    });
    // Playwright不支持:visible伪类，用filter筛选可见元素
    await this.page.locator('.section-options__btn._del').filter({ visible: true }).click();
    await expect(this.pagePlaceholder).toBeVisible();
  }
}

3. 别用错误的判断方式 #

• if (this.pagePlaceholder)没用：this.pagePlaceholder是Locator对象，不管元素存不存在，这个对象都存在，所以判断永远为true。
• isVisible()必须加await：它是异步方法，不加await拿到的是Promise对象，判断也永远为true，正确写法：

  const isPlaceholderVisible = await this.pagePlaceholder.isVisible();
  if (!isPlaceholderVisible) {
    // 执行删除操作
  }
  

4. 替换不支持的:visible伪类 #

你原代码里的.section-options__btn._del:visible，Playwright的Locator不支持这种CSS伪类，必须用filter({ visible: true })筛选可见元素，否则点击可能失败。

内容的提问来源于stack exchange，提问作者Let 'er Rip