Playwright调用setInputFiles提示selector resolved to hidden如何解决？

报错根因 #

page.setInputFiles默认会校验目标元素可见性，你要操作的<input>设置了display: none隐藏属性，触发了可见性校验失败。

解决方法 #

• 方案1（最推荐）：直接添加force参数绕过可见性校验，无需修改页面元素

  await page.setInputFiles(
    '//*[@id="root"]/div/div/main/div/div[2]/div[3]/input',
    file,
    { force: true }
  );
  

• 方案2（备选）：临时修改元素为可见状态，上传完成后恢复

  const input = page.locator('//*[@id="root"]/div/div/main/div/div[2]/div[3]/input')
  // 临时取消隐藏
  await input.evaluate(el => el.style.display = 'block')
  // 执行上传
  await input.setInputFiles(file)
  // 恢复原有隐藏属性
  await input.evaluate(el => el.style.display = 'none')
  

优化提示 #

你目前使用的全路径XPath稳定性很低，页面DOM结构稍有调整就会定位失效，建议替换为更稳定的选择器，比如通过input[type="file"]结合上层节点的ID、类名等属性定位。

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