Selenium相同ID元素报Element not interactable异常如何解决

根因分析 #

• 页面存在重复ID元素：Page2页面内存在多个id为select2-ccnl-container的DOM节点，Selenium默认匹配到的第一个节点为隐藏不可交互状态，并非你肉眼可见的可操作元素。
• 元素加载时序不匹配：@FindBy注解会在Page类初始化时完成元素定位，若Page2的目标元素渲染速度慢于Page初始化速度，此时定位到的元素还未进入可交互状态。
• Select2组件结构差异：你使用的是Select2下拉组件，部分场景下select2-xx-container节点本身不支持直接点击触发，需要点击父级/相邻的select2-selection节点才会响应交互，Page1的组件结构刚好兼容container点击，Page2的结构差异导致交互失效。
• 元素被其他节点遮挡：Page2的目标元素可能被弹窗、固定定位顶栏/遮罩层遮挡，肉眼无感知但元素无法接收点击事件。

修复方案 #

1. 先确认是否存在重复元素：打开Page2的浏览器开发者控制台，执行document.querySelectorAll("#select2-ccnl-container")，若返回的节点数大于1，调整定位逻辑，增加父级唯一属性限定，精准匹配可见元素，示例：

// 替换为Page2页面内目标元素上层的唯一父节点属性进行定位
@FindBy(xpath = "//div[@class='page2-unique-wrapper']//*[@id='select2-ccnl-container']")
protected WebElement ccnlSelect;

2. 点击前增加显式等待：修改BasePage内的点击方法，等待元素进入可点击状态后再执行操作：

public void clickSettingCcnl(){
    new WebDriverWait(driver, Duration.ofSeconds(10))
        .until(ExpectedConditions.elementToBeClickable(ccnlSelect))
        .click();
}

3. 调整Select2组件的定位对象：直接定位Select2标准可交互节点，替换原有container定位：

@FindBy(css = "[aria-labelledby='select2-ccnl-container']")
protected WebElement ccnlSelect;

4. 遮挡场景下改用JS触发点击：如果确认是元素被遮挡导致常规点击失效，改用JavaScript强制触发点击事件：

public void clickSettingCcnl(){
    JavascriptExecutor js = (JavascriptExecutor) driver;
    js.executeScript("arguments[0].click();", ccnlSelect);
}

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