Selenium-ChromeDriver按钮点击报错问题求助

问题描述 #

访问https://demoqa.com/text-box页面填写表单后，尝试多种定位方式点击id为submit的按钮均失败，报错ElementClickInterceptedException，提示目标元素被其他div拦截无法点击。

代码示例 #

WebDriver driver = new ChromeDriver();
driver.get("https://demoqa.com/text-box");
driver.findElement(By.id("userName")).sendKeys("Daniel");
driver.findElement(By.id("userEmail")).sendKeys("daniel@mail.it");
driver.findElement(By.id("currentAddress")).sendKeys("Italia");
driver.findElement(By.id("permanentAddress")).sendKeys("Italia");

// 尝试过的定位方式
//driver.findElement(By.xpath("//button[@id='submit']")).click();
//driver.findElement(By.cssSelector("#submit")).click();
driver.findElement(By.id("userName")).click();
//driver.findElement(By.id("userName")).submit();
//driver.findElement(By.linkText("Submit")).click();

报错详情 #

Exception in thread "main" org.openqa.selenium.ElementClickInterceptedException: element click intercepted: Element <button id="submit" type="button" class="btn btn-primary">...</button> is not clickable at point (728, 631). Other element would receive the click: <div>...</div>
  (Session info: chrome=112.0.5615.50)
Build info: version: '4.8.3', revision: 'b19b418e60'
System info: os.name: 'Windows 11', os.arch: 'amd64', os.version: '10.0', java.version: '19.0.2'
Driver info: org.openqa.selenium.chrome.ChromeDriver
Command: [XXXXXXXXXXXXXX, clickElement {id=XXXXXXXXXXXX}]
Capabilities {acceptInsecureCerts: false, browserName: chrome, browserVersion: 112.0.5615.50, chrome: {chromedriverVersion: 112.0.5615.49 (XXXXXXXX..., userDataDir: C:\Users\XXXXXXX\AppData\Loca...}, goog:chromeOptions: {debuggerAddress: localhost:XXXXX}, networkConnectionEnabled: false, pageLoadStrategy: normal, platformName: WINDOWS, proxy: Proxy(), se:cdp: ws://localhost:XXXXX/devtoo..., se:cdpVersion: XXXXXXXX, setWindowRect: true, strictFileInteractability: false, timeouts: {implicit: 0, pageLoad: XXXXXXX, script: XXXXXX}, unhandledPromptBehavior: dismiss and notify, webauthn:extension:credBlob: true, webauthn:extension:largeBlob: true, webauthn:extension:minPinLength: true, webauthn:extension:prf: true, webauthn:virtualAuthenticators: true}
Element: [[ChromeDriver: chrome on WINDOWS (XXXXXXXXXXXXXXXXXx)] -> xpath: //button[@id='submit']]
Session ID: XXXXXXXXXXXXX
    at java.base/jdk.internal.reflect.DirectConstructorHandleAccessor.newInstance(DirectConstructorHandleAccessor.java:67)
    at java.base/java.lang.reflect.Constructor.newInstanceWithCaller(Constructor.java:500)
    at java.base/java.lang.reflect.Constructor.newInstance(Constructor.java:484)
    at org.openqa.selenium.remote.codec.w3c.W3CHttpResponseCodec.createException(W3CHttpResponseCodec.java:200)
    at org.openqa.selenium.remote.codec.w3c.W3CHttpResponseCodec.decode(W3CHttpResponseCodec.java:133)
    at org.openqa.selenium.remote.codec.w3c.W3CHttpResponseCodec.decode(W3CHttpResponseCodec.java:53)
    at org.openqa.selenium.remote.HttpCommandExecutor.execute(HttpCommandExecutor.java:193)
    at org.openqa.selenium.remote.service.DriverCommandExecutor.invokeExecute(DriverCommandExecutor.java:183)
    at org.openqa.selenium.remote.service.DriverCommandExecutor.execute(DriverCommandExecutor.java:158)
    at org.openqa.selenium.remote.RemoteWebDriver.execute(RemoteWebDriver.java:543)
    at org.openqa.selenium.remote.RemoteWebElement.execute(RemoteWebElement.java:257)
    at org.openqa.selenium.remote.RemoteWebElement.click(RemoteWebElement.java:78)
    at selenium.fondamenti.Gestione_e_Convalida_TextBox.main(Gestione_e_Convalida_TextBox.java:44)

解决方案 #

1. JavaScript直接触发点击 #

绕过元素遮挡，直接调用元素点击事件：

WebElement submitBtn = driver.findElement(By.id("submit"));
JavascriptExecutor js = (JavascriptExecutor) driver;
js.executeScript("arguments[0].click();", submitBtn);

2. 滚动到元素可见后点击 #

先将页面滚动至按钮可见区域，再执行点击：

WebElement submitBtn = driver.findElement(By.id("submit"));
Actions actions = new Actions(driver);
actions.moveToElement(submitBtn).click().perform();

// 或用JavaScript滚动
// JavascriptExecutor js = (JavascriptExecutor) driver;
// js.executeScript("arguments[0].scrollIntoView(true);", submitBtn);
// submitBtn.click();

3. 显式等待元素可交互 #

确保元素完全加载并可点击后再操作：

WebDriverWait wait = new WebDriverWait(driver, Duration.ofSeconds(10));
WebElement submitBtn = wait.until(ExpectedConditions.elementToBeClickable(By.id("submit")));
submitBtn.click();

4. 移除遮挡元素（若允许） #

如果遮挡的div是弹窗或遮罩，可先隐藏它：

// 替换为实际遮挡元素的定位方式
WebElement overlay = driver.findElement(By.className("overlay"));
JavascriptExecutor js = (JavascriptExecutor) driver;
js.executeScript("arguments[0].style.display = 'none';", overlay);

driver.findElement(By.id("submit")).click();

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