Internet Explorer: Element is not clickable if there is a hidden HTML element with z-index

[eugenedani]

Meta -

OS: Windows 10
Selenium Version: 3.11.0
Browser: Internet Explorer
Browser Version: 11.909.15063.0 (Update Version: 11.0.51)
IE WebDriver: 3.11.1.1

Expected Behavior -

If there is a hidden element with z-index parameter on a page, visible element will be clicked

Actual Behavior -

there is a hidden element with z-index parameter on a page, clicking on visible element throws exception:
org.openqa.selenium.ElementClickInterceptedException: Element not clickable at point (31,17). Other element would receive the click: <td>
<table style="width: 100%; border-top-color: rgb(233, 246, 255); border-bottom-color: rgb(62, 95, 128); border-left-color: rgb(233, 246, 255); border-top-width: 1px; border-bottom-width: 1px; border-left-width: 1px; border-top-style: solid; border-bottom-style: solid; border-left-style: solid;" valign="top">
<tbody><tr>
<td> Login </td>
</tr>
</tbody></table>
</td>
Build info: version: '3.11.0', revision: 'e59cfb3', time: '2018-03-11T20:33:15.31Z'
System info: os.name: 'Windows 10', os.arch: 'amd64', os.version: '10.0', java.version: '1.8.0_161'
Driver info: org.openqa.selenium.ie.InternetExplorerDriver
Capabilities {acceptInsecureCerts: false, browserName: internet explorer, browserVersion: 11, javascriptEnabled: true, pageLoadStrategy: eager, platform: WINDOWS, platformName: WINDOWS, proxy: Proxy(), se:ieOptions: {browserAttachTimeout: 0, elementScrollBehavior: 0, enablePersistentHover: true, ie.browserCommandLineSwitches: , ie.ensureCleanSession: false, ie.fileUploadDialogTimeout: 15000, ie.forceCreateProcessApi: false, ignoreProtectedModeSettings: false, ignoreZoomSetting: false, initialBrowserUrl: http://localhost:25911/, nativeEvents: true, requireWindowFocus: false}, setWindowRect: true, timeouts: {implicit: 0, pageLoad: 300000, script: 30000}, unhandledPromptBehavior: accept}
Session ID: dcf4d1b6-208e-46d2-9fe4-9b8dc7f6f2ae
at sun.reflect.NativeConstructorAccessorImpl.newInstance0(Native Method)
at sun.reflect.NativeConstructorAccessorImpl.newInstance(NativeConstructorAccessorImpl.java:62)
at sun.reflect.DelegatingConstructorAccessorImpl.newInstance(DelegatingConstructorAccessorImpl.java:45)
at java.lang.reflect.Constructor.newInstance(Constructor.java:423)
at org.openqa.selenium.remote.http.W3CHttpResponseCodec.createException(W3CHttpResponseCodec.java:187)
at org.openqa.selenium.remote.http.W3CHttpResponseCodec.decode(W3CHttpResponseCodec.java:122)
at org.openqa.selenium.remote.http.W3CHttpResponseCodec.decode(W3CHttpResponseCodec.java:49)
at org.openqa.selenium.remote.HttpCommandExecutor.execute(HttpCommandExecutor.java:158)
at org.openqa.selenium.remote.service.DriverCommandExecutor.execute(DriverCommandExecutor.java:83)
at org.openqa.selenium.remote.RemoteWebDriver.execute(RemoteWebDriver.java:545)
at org.openqa.selenium.remote.RemoteWebElement.execute(RemoteWebElement.java:279)
at org.openqa.selenium.remote.RemoteWebElement.click(RemoteWebElement.java:83)
at com.polarion.selenium.test.cases.documents.create.DocumentDialogTests.createNewDocumentTest(DocumentDialogTests.java:51)
at sun.reflect.NativeMethodAccessorImpl.invoke0(Native Method)
at sun.reflect.NativeMethodAccessorImpl.invoke(NativeMethodAccessorImpl.java:62)
at sun.reflect.DelegatingMethodAccessorImpl.invoke(DelegatingMethodAccessorImpl.java:43)
at java.lang.reflect.Method.invoke(Method.java:498)
at org.junit.runners.model.FrameworkMethod$1.runReflectiveCall(FrameworkMethod.java:50)
at org.junit.internal.runners.model.ReflectiveCallable.run(ReflectiveCallable.java:12)
at org.junit.runners.model.FrameworkMethod.invokeExplosively(FrameworkMethod.java:47)
at org.junit.internal.runners.statements.InvokeMethod.evaluate(InvokeMethod.java:17)
at org.junit.internal.runners.statements.RunAfters.evaluate(RunAfters.java:27)
at org.junit.rules.TestWatcher$1.evaluate(TestWatcher.java:55)
at org.junit.rules.RunRules.evaluate(RunRules.java:20)
at org.junit.runners.ParentRunner.runLeaf(ParentRunner.java:325)
at org.junit.runners.BlockJUnit4ClassRunner.runChild(BlockJUnit4ClassRunner.java:78)
at org.junit.runners.BlockJUnit4ClassRunner.runChild(BlockJUnit4ClassRunner.java:57)
at org.junit.runners.ParentRunner$3.run(ParentRunner.java:290)
at org.junit.runners.ParentRunner$1.schedule(ParentRunner.java:71)
at org.junit.runners.ParentRunner.runChildren(ParentRunner.java:288)
at org.junit.runners.ParentRunner.access$000(ParentRunner.java:58)
at org.junit.runners.ParentRunner$2.evaluate(ParentRunner.java:268)
at org.junit.runners.ParentRunner.run(ParentRunner.java:363)
at org.junit.runners.Suite.runChild(Suite.java:128)
at org.junit.runners.Suite.runChild(Suite.java:27)
at org.junit.runners.ParentRunner$3.run(ParentRunner.java:290)
at java.util.concurrent.Executors$RunnableAdapter.call$$$capture(Executors.java:511)
at java.util.concurrent.Executors$RunnableAdapter.call(Executors.java)
at java.util.concurrent.FutureTask.run$$$capture(FutureTask.java:266)
at java.util.concurrent.FutureTask.run(FutureTask.java)
at java.util.concurrent.ThreadPoolExecutor.runWorker(ThreadPoolExecutor.java:1149)
at java.util.concurrent.ThreadPoolExecutor$Worker.run(ThreadPoolExecutor.java:624)
at java.lang.Thread.run(Thread.java:748)

Steps to reproduce -

HTML code in attachment file
ieWebDriverClickErrorHtmlPage.txt

Selenium code Java:
`InternetExplorerOptions internetExplorerOptions = new InternetExplorerOptions();
internetExplorerOptions.setCapability("applicationCacheEnabled", true);
internetExplorerOptions.waitForUploadDialogUpTo(15, TimeUnit.SECONDS);
internetExplorerOptions.setUnhandledPromptBehaviour(UnexpectedAlertBehaviour.ACCEPT).setPageLoadStrategy(PageLoadStrategy.EAGER);

WebDriver webDriver = new InternetExplorerDriver(internetExplorerOptions );

webDriver.get("file:///path/ieWebDriverClickErrorHtmlPage.html");

WebElement element = webDriver.findElement(By.cssSelector("#gLink"));

element.click();`

[jimevans]

Fixed in f13f3f5. Thank you for the report.

[snowymike]

i'm still seeing this not work in selenium 3.12 and IE driver 3.12.0.0

works fine for me in selenium 3.12 and IE driver 3.10.0.0.

@eugenedani did the fix work for you?

[jimevans]

@snowymike Using the file provided in the issue report, the problem no longer occurs in IE in 3.12. If you can reproduce with another page, please feel free to supply it.

[snowymike]

working on it, thanks. i've also confirmed that IE 3.12 is ok with the attached HTML file, just not with the UI i'm testing against. working to figure out what's unique in my environment and will post back.

[snowymike]

ok, here's my scenario

browser.get("file:///C:/ieWebDriverClickTextInputErrorHtmlPage.html");
WebElement element = browser.findElement(By.cssSelector("#textInput"));
element.click();

html is

<!DOCTYPE html>
<html>
<head>
 <meta http-equiv="X-UA-Compatible" content="IE=edge">
 <meta charset="UTF-8">
 <title>Selenium Test</title>
</head>
<body>
	<div style="z-index: 1000; display: block;">
		<input type="text" id="textInput">
	</div>
	<div>
		<div>
			<div style="top: 0; left: 0; bottom: 0; right: 0; position: absolute; display: block; width: 100%; height: 100%; pointer-events: none; z-index: 100001;">
			</div>
		</div>
	</div>
</body>
</html>

[snowymike]

that example passes in latest chrome driver (2.38) and gecko driver (0.20.1) but not IE driver 3.12, which fails with

org.openqa.selenium.ElementClickInterceptedException: Element not clickable at point (84,18). Other element would receive the click: <div style="left: 0px; top: 0px; width: 100%; height: 100%; right: 0px; bottom: 0px; display: block; position: absolute; z-index: 100001; pointer-events: none;">
			</div>

[jimevans]

@snowymike You've encountered a browser bug. There's nothing the IE driver can do about it if the browser returns incorrect information in a call to the JavaScript elementsFromPoint function. When running the following JavaScript in the browser debugging console, different values are displayed (note: this is the code for discovering whether an element is obscured using the algorithm specified in the W3C WebDriver Specification):

var rect = document.getElementById("textInput").getClientRects()[0]; 
var x = (rect.right-rect.left) / 2;
var y = (rect.bottom-rect.top)/2;
console.log(x + ", " + y);
// Must use document.msElementsFromPoint() for the IE case,
// because the unprefixed version isn't supported in IE
var els = document.elementsFromPoint(x, y);
var el = els[0]; console.log(el.outerHTML);

When run using Firefox, the following outer HTML is displayed:

<input id="textInput" type="text">

When run via IE's console, this is the result:

<div style="left: 0px; top: 0px; width: 100%; height: 100%; right: 0px; bottom: 0px; display: block; position: absolute; z-index: 100001; pointer-events: none;"></div>

One could argue that the algorithm in the spec is incorrect, if it doesn't fit all current implementations. One could argue that the browser is incorrect, since the <input> element shows up exactly nowhere in the list returned by elementsFromPoint. In either case, the driver is doing the "right thing," reporting back what the browser is telling it.

[snowymike]

ok. is there some process by which these bugs are reported to microsoft? i can certainly stay on 3.10.0.0 for a while, but it seems like unless this browser bug is fixed i'll never be able to update the IE driver again, nor could other selenium testers that need to test with IE and that have apps with similar HTML. any suggestions you have would be appreciated. thanks.

[eugenedani]

@snowymike you can try to use
WebElement element = browser.findElement(By.cssSelector("#textInput"));
new Actions(webDriver)).click(element).perform();

or if it does not work you can try JavascriptExecutor

[snowymike]

thanks, i might be able to do that (it did work in this specific scenario).

i've already got wrappers around click() for each browser since direct WebElement.click() hasn't always been consistently reliable over time (due to browser, selenium, and driver changes). for firefox and chrome today i do just do WebElement.click(), though for IE i've been doing more than that and actually sending a return key as that worked more reliably for me than click.

	public void click(WebDriver browser, WebElement element) {
		WebDriverWait wait = new WebDriverWait(browser, 15);
		wait.until(ExpectedConditions.visibilityOfAllElements(Arrays.asList(element)));
		wait.until(ExpectedConditions.elementToBeClickable(element));
		element.sendKeys(Keys.RETURN);
	}

switching that to a click using Actions worked in this specific test case.

	public void click(WebDriver browser, WebElement element) {
		WebDriverWait wait = new WebDriverWait(browser, 15);
		wait.until(ExpectedConditions.visibilityOfAllElements(Arrays.asList(element)));
		wait.until(ExpectedConditions.elementToBeClickable(element));
		new Actions(browser).click(element).perform();
	}

i'd have to run that change through our suite of hundreds of tests, but that's a possible workaround that would let me upgrade above 3.10.0.0 later.

thanks for your help.

[joerg1985]

It looks like elementFromPoint returns the correct value, for the given HTML / JS sample.

Is it be possible to use elementFromPoint instead of msElementsFromPoint to fix bugs like #5935?