Debugging “Element is not clickable at point” erro

Question

I see this only in Chrome.

The full error message reads:

"org.openqa.selenium.WebDriverException: Element is not clickable at point (411, 675). Other element would receive the click: ..."

The element that 'would receive the click' is to the side of the element in question, not on top of it and not overlapping it, not moving around the page.

I have tried adding an offset, but that does not work either. The item is on the displayed window without any need for scrolling.

Answer 1

This is caused by following 3 types:

1.The element is not visible to click.

Use Actions or JavascriptExecutor for making it to click.

By Actions:

WebElement element = driver.findElement(By("element_path"));

Actions actions = new Actions(driver);

actions.moveToElement(element).click().perform();

By JavascriptExecutor:

JavascriptExecutor jse = (JavascriptExecutor)driver;

jse.executeScript("scroll(250, 0)"); // if the element is on top.

jse.executeScript("scroll(0, 250)"); // if the element is on bottom.

or

JavascriptExecutor jse = (JavascriptExecutor)driver;

jse.executeScript("arguments[0].scrollIntoView()", Webelement); 

Then click on the element.

2.The page is getting refreshed before it is clicking the element.

For this, make the page to wait for few seconds.

3. The element is clickable but there is a spinner/overlay on top of it

The below code will wait until the overlay disppears

By loadingImage = By.id("loading image ID");

WebDriverWait wait = new WebDriverWait(driver, timeOutInSeconds);

wait.until(ExpectedConditions.invisibilityOfElementLocated(loadingImage));

Then click on the element.

Answer 2

First, try to get the latest Chrome driver and check if it solves the issue.

In my case, it didn't fix the issue. But, the following solution worked for me so far. The following is C# code but you can follow same logic in your specific language. What we do here is,

Step 1: Focus on the element using the Selenium Actions object,

Step 2: Then do a click on the element

Step 3: If there's an exception, then we trigger a javascript "Click" event on the element by executing the javascript script through the Selenium browser driver's "ExecuteScript" method.

You can also skip step 1 and 2 and try only step 3 too. Step 3 would work on it's own but I noticed some strange behavior in one scenario in which step 3, even though it successfully clicked the element, caused unexpected behavior in other parts of my code after clicking the element.

            try
            {
                //Setup the driver and navigate to the web page...
                var driver = new ChromeDriver("folder path to the Chrome driver");
                driver.Navigate().GoToUrl("UrlToThePage");

                //Find the element...
                var element = driver.FindElement(By.Id("elementHtmlId")); 

                //Step 1
                new Actions(driver).MoveToElement(element).Perform();  

                //Step 2
                element.Click();
            }
            catch (Exception)
            {
                //Step 3
                driver.ExecuteScript("document.getElementById('elementHtmlId').click();");

            }

Answer 3

It's funny, all the time I spent looking at the various responses, no one had tried the obvious, which of course, I hadn't either. If your page has the same id used multiple times, as mine did, ("newButton",) and the one you want is not the first one found, then you will in all likelihood get this error. The easiest thing to do (C#):

var testIt = driver.FindElements(By.Id("newButton"));

Note it's FindElements, not FindElement.

And then test to see how many results came back from the retrieval. If it's the second one, you can then use:

testit[1].Click();

Or get whomever reused ids to fix them.

Answer 4

You can also use JavaScript click and scrolling would be not required then.

IJavaScriptExecutor ex = (IJavaScriptExecutor)Driver;
ex.ExecuteScript("arguments[0].click();", elementToClick);

Answer 5

Was getting this error when running tests headless with xvfb-run. They were working flawlessly locally. Using chrome, versions of webdriver / chromedriver / chrome / java etc all identical.

The ‘won’t fix’ bug in chromedriver - GitHub Link pointed out by Tony Lâmpada suggested this may be related to what is / isn't visible on the screen.

Help message for xvfb-run shows the following:

-s ARGS   --server-args=ARGS    arguments (other than server number and
                                "-nolisten tcp") to pass to the Xvfb server
                                (default: "-screen 0 640x480x8")

Changing the resolution for xvfb made the error go away:

xvfb-run -s "-screen 0 1280x1024x16" ...

Answer 6

I made this method based on a comment from Tony Lâmpada's answer. It works very well.

def scroll_to(element)
  page.execute_script("window.scrollTo(#{element.native.location.x}, #{element.native.location.y})")
end