Debugging “Element is not clickable at point” error

Question

I see this only in Chrome.

The full error message reads:

\"org.openqa.selenium.WebDriverException: Element is not clickable at point (411, 675

Answer 1

The reason for this error is that the element that you are trying to click is not in the viewport (region seen by the user) of the browser. So the way to overcome this is by scrolling to the desired element first and then performing the click.

Javascript:

async scrollTo (webElement) {
    await this.driver.executeScript('arguments[0].scrollIntoView(true)', webElement)
    await this.driver.executeScript('window.scrollBy(0,-150)')
}

Java:

public void scrollTo (WebElement e) {
    JavascriptExecutor js = (JavascriptExecutor) driver; 
    js.executeAsyncScript('arguments[0].scrollIntoView(true)', e)
    js.executeAsyncScript('window.scrollBy(0,-150)')
}

Answer 2

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

Answer 3

I was facing the same problem with clj-webdriver (clojure port of Selenium). I just translated the previous solution to clojure for convenience. You can call this function before doing click or whatever to avoid that problem.

(defn scrollTo
  "Scrolls to the position of the given css selector if found"
  [q]
  (if (exists? q) 
    (let [ loc (location-once-visible q) jscript (str "window.scrollTo(" (:x loc) "," (:y loc) ")") ] 
      (execute-script jscript))))

Answer 4

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 5

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 6

Explanation of error message:

The error message simply says, that the element you want to click on is present, but it is not visible. It could be covered by something or temporary not visible.

There could be many reasons why the element is not visible in the moment of the test. Please re-analyse your page and find proper solution for your case.

Solution for particular case:

In my case, this error occures, when a tooltip of the screen element i just clicked on, was poping over the element I wanted to click next. Defocus was a solution I needed.

• Quick solution how to defocus would be to click to some other element in another part of the screen which does "nothing" resp. nothing happens after a click action.
• Proper solution would be to call element.blur() on the element poping the tooltip, which would make the tooltip disapear.