Nightwatch可定位元素但报element not interactable无法点击

elements() 方法成功返回元素ID，仅代表匹配的DOM节点存在于页面文档结构中，和元素是否可见、是否可点击没有任何关系。

• 选择器存在两处笔误：
  1. 调用elements()时传入的选择器为div[aria-describedby='dialogWindowTooSmall button.ui-button']，漏写了属性选择器的闭合方括号，该选择器会匹配aria-describedby属性值完全等于dialogWindowTooSmall button.ui-button的div节点，并非你预期的「aria-describedby属性为dialogWindowTooSmall的div下的ui-button类按钮」，返回的2个ELEMENT是页面中其他隐藏的DOM节点，不是目标弹窗按钮。
  2. click()方法里的选择器字符串末尾多写了一个右括号，属于多余字符，会导致选择器匹配逻辑异常。
• 判断逻辑存在缺陷：仅校验DOM节点是否存在就执行点击，没有校验元素可交互状态。DOM中存在的元素可能因以下任意一种情况无法被点击：
  • 元素被设置display: none、visibility: hidden、opacity: 0等隐藏样式
  • 元素被其他z-index层级更高的节点遮挡
  • 元素宽高为0，不在页面可视区域内
  • 元素处于弹窗入场动画过程中，还未渲染到可交互位置
  • 元素在视口范围外，未滚动到可见区域

不要手动调用elements()判断DOM存在，直接使用Nightwatch内置的状态等待API，确认元素可见后再执行点击；针对Loadero云测试环境的负载波动特性，将等待超时设置为10秒即可适配大部分场景：

// 等待目标按钮可见，超时时间10000ms
client.waitForElementVisible('div[aria-describedby="dialogWindowTooSmall"] button.ui-button', 10000, function (checkResult) {
    if (checkResult.value) {
        // 可选：先移动鼠标到元素位置，规避视口偏移、元素遮挡类问题
        client.moveToElement('div[aria-describedby="dialogWindowTooSmall"] button.ui-button', 0, 0);
        // 确认元素状态正常后执行点击
        client.click('div[aria-describedby="dialogWindowTooSmall"] button.ui-button');
    }
})

补充说明：如果弹窗为动态加载渲染，不要将等待超时设置过短。Loadero测试运行环境为云主机，网络和页面渲染速度普遍慢于本地环境，过短的等待时间会导致元素还未渲染完成就触发点击，复现同类报错。

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