Playwright JavaScript：如何等待链接变为粗体（替代类选择器）

直接使用page.waitForFunction执行自定义JavaScript逻辑，检查元素的计算样式中font-weight值是否达到粗体阈值（通常≥700），代码示例如下：

// 点击目标链接
await page.click("a[id$='clickablelink_0']");

// 等待元素变为粗体（font-weight ≥ 700）
await page.waitForFunction(selector => {
  const element = document.querySelector(selector);
  if (!element) return false;
  
  // 获取元素最终生效的计算样式
  const computedStyle = window.getComputedStyle(element);
  // 处理font-weight的关键字与数字转换：bold对应700，normal对应400
  const fontWeightValue = parseInt(computedStyle.fontWeight, 10) || 
    (computedStyle.fontWeight === 'bold' ? 700 : 400);
  
  return fontWeightValue >= 700;
}, "a[id$='clickablelink_0']");

关键说明 #

• 不依赖易变的类名，直接检测视觉表现的核心样式，稳定性更高
• 兼容font-weight的两种取值形式：数字（如400、700）和关键字（如bold、normal）
• 内置元素存在性检查，避免空元素报错
• 可根据实际需求调整阈值（比如半粗体可设为≥600），也可修改超时时间（通过{ timeout: 5000 }作为第三个参数传入）

内容的提问来源于stack exchange，提问作者sbonnick