Selenium+NodeJS点击两个div取消选择时出现StaleElementReferenceError如何解决

错误根因 #

StaleElementReferenceError的核心原因是你获取元素引用后，页面JS触发了DOM节点重绘/替换，哪怕元素视觉上没有变化，之前的引用也已经失效。你当前的代码存在两个核心问题：

• 所有异步操作用.then链式调用没有等待前序操作完成，第一次点击选项触发页面重绘后，还没等DOM稳定就立即查找下一个元素，自然会拿到失效引用
• elementLocated仅判断元素存在于DOM树中，没有判断元素是否完成渲染、可交互，点击时可能节点还处于重绘过程中

解决方案 #

方案1：改用async/await异步等待逻辑，每次操作前重新查找元素 #

把回调写法改成async/await，每一步操作都等待前序执行完成，并且每次点击前都重新查找元素确保引用有效：

async function selectMonth() {
    // 打开月份选择器
    await driver.findElement(by.xpath('//*[@id="mstr342"]/div')).click();

    // 等待下拉容器可见
    const selectContainer = by.xpath('//*[@id="mstr346"]/div/div');
    await driver.wait(until.elementIsVisible(driver.findElement(selectContainer)), 10000);

    // 选中目标月份（比如第3个选项）
    const targetMonth = by.xpath('//*[@id="mstr346"]/div/div/div[3]');
    await driver.wait(until.elementIsEnabled(driver.findElement(targetMonth)), 10000);
    await driver.findElement(targetMonth).click();

    // 等待DOM更新稳定
    await driver.sleep(300);

    // 点击确定
    const confirmBtn = by.xpath('//*[@id="mstr348"]/div');
    await driver.wait(until.elementIsEnabled(driver.findElement(confirmBtn)), 10000);
    await driver.findElement(confirmBtn).click();
}

方案2：直接执行JS操作DOM，彻底规避元素引用失效问题 #

针对自定义组件的操作，直接调用原生JS操作DOM，完全绕过Selenium元素引用的限制，稳定性最高：

async function selectMonthStable() {
    // 打开月份选择器
    await driver.findElement(by.xpath('//*[@id="mstr342"]/div')).click();
    // 等待下拉渲染完成
    await driver.wait(until.elementLocated(by.xpath('//*[@id="mstr346"]/div/div/div')), 10000);

    // 执行JS直接处理选中逻辑，仅保留第3个选项选中
    await driver.executeScript(`
        const monthOptions = document.querySelectorAll('#mstr346 > div > div > div');
        monthOptions.forEach((item, index) => {
            // 索引从0开始，2对应第3个选项，可根据需求修改
            if(index === 2) {
                item.click();
            } else {
                // 移除其他选项的选中状态，active类名可替换为你实际组件的选中类
                item.classList.remove('active');
            }
        });
        // 点击确定按钮
        document.querySelector('#mstr348 > div').click();
    `);
}

注意事项 #

• 不要复用提前声明的元素引用，每次操作前都重新执行findElement获取最新节点
• 操作元素前优先用elementIsVisible/elementIsEnabled代替elementLocated，确保元素可交互
• 自定义组件的操作优先用executeScript实现，比模拟点击的稳定性高很多

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