如何在被div遮挡的Angular页面下拉框中设置选项（Selenium Java+Firefox环境）

嘿，我之前也踩过Angular下拉框在Firefox里被遮挡的坑！这种情况大概率是因为你用的Angular下拉组件（比如常见的MatSelect）不是原生的<select>标签，而是用一堆div、span模拟出来的，Selenium自带的Select类完全不管用，再加上Firefox对元素遮挡的检测比Chrome严格得多，就容易抛出这个错误。

给你几个亲测有效的解决方案，按需选：

方案一：模拟真实用户的点击流程（用Actions类） #

Angular的下拉组件需要先点击触发元素展开选项列表，再点击目标选项。用Actions类模拟鼠标移动+点击的操作，能避开Firefox的遮挡检测：

private void setSelect(int index) {
    WebDriverWait wait = new WebDriverWait(driver, Duration.ofSeconds(15));
    // 先定位下拉框的触发元素，这里要替换成你页面的实际选择器
    WebElement dropdownTrigger = wait.until(ExpectedConditions.elementToBeClickable(By.cssSelector("mat-select[formControlName='yourControlName']")));
    
    // 用Actions模拟鼠标移到元素上再点击，避免直接click的遮挡问题
    Actions actions = new Actions(driver);
    actions.moveToElement(dropdownTrigger).click().perform();
    
    // 等待选项列表加载，定位第index个选项（注意nth-child是从1开始的，所以要+1）
    WebElement targetOption = wait.until(ExpectedConditions.visibilityOfElementLocated(By.cssSelector("mat-option:nth-child(" + (index + 1) + ")")));
    // 同样用Actions点击选项
    actions.moveToElement(targetOption).click().perform();
}

方案二：用JavaScript强制点击（绕过遮挡检测） #

如果Actions还是不行，试试直接用JS触发元素的click事件——Selenium的原生click会检查元素是否完全可见可点击，而JS可以跳过这个检查：

private void setSelect(int index) {
    WebDriverWait wait = new WebDriverWait(driver, Duration.ofSeconds(15));
    WebElement dropdownTrigger = wait.until(ExpectedConditions.presenceOfElementLocated(By.cssSelector("mat-select[formControlName='yourControlName']")));
    
    // 执行JS点击展开下拉
    ((JavascriptExecutor) driver).executeScript("arguments[0].click();", dropdownTrigger);
    
    // 等待目标选项出现并点击
    WebElement targetOption = wait.until(ExpectedConditions.presenceOfElementLocated(By.cssSelector("mat-option:nth-child(" + (index + 1) + ")")));
    ((JavascriptExecutor) driver).executeScript("arguments[0].click();", targetOption);
}

方案三：先等待页面加载完成（排除遮罩层干扰） #

有时候报错只是因为页面还在加载，有个半透明的加载遮罩层没消失，这时候得先等遮罩层完全隐藏：

private void setSelect(int index) {
    WebDriverWait wait = new WebDriverWait(driver, Duration.ofSeconds(15));
    // 先等加载遮罩层消失，替换成你页面的遮罩选择器
    wait.until(ExpectedConditions.invisibilityOfElementLocated(By.cssSelector(".loading-overlay")));
    
    // 再执行后续的下拉框操作（用上面方案一或二的代码）
    WebElement dropdownTrigger = wait.until(ExpectedConditions.elementToBeClickable(By.cssSelector("mat-select[formControlName='yourControlName']")));
    Actions actions = new Actions(driver);
    actions.moveToElement(dropdownTrigger).click().perform();
    
    WebElement targetOption = wait.until(ExpectedConditions.visibilityOfElementLocated(By.cssSelector("mat-option:nth-child(" + (index + 1) + ")")));
    actions.moveToElement(targetOption).click().perform();
}

小提醒 #

• 一定要根据你页面的实际HTML结构修改选择器，比如如果不是MatSelect组件，要换成对应组件的触发元素和选项的选择器。
• 确保Firefox浏览器版本和GeckoDriver版本完全匹配，版本不兼容也会导致各种奇怪的元素交互问题。

备注：内容来源于stack exchange，提问作者Marcos Ribeiro Morais