EC.element_to_be_clickable condition executes successfully, however in the following line same element's click fails

Question

Query: As mentioned in the title, if below line has successfully executed:

element = wait.until(EC.element_to_be_clickable((By.XPATH, "//a[text()='See all teams']")))

Why the below line throws Element is not clickable at point exception?

element.click()

Code:

driver = webdriver.Chrome()
driver.get("https://useinsider.com/careers/")
driver.maximize_window()
wait = WebDriverWait(driver, 20)

# Accept cookies
wait.until(EC.element_to_be_clickable((By.CSS_SELECTOR, '#wt-cli-accept-all-btn'))).click()

# Desired element is captured and printed successfully
element = wait.until(EC.element_to_be_clickable((By.XPATH, "//a[text()='See all teams']")))
print("The desired element's text:" + element.text)

# below line throws Element not clickable exception
element.click()

Console output/Error trace:

The desired element's text:See all teams
Traceback (most recent call last):
  File "C:\Users\username\PycharmProjects\pythonProject3\test1.py", line 19, in <module>
    element.click()
  File "C:\Users\username\PycharmProjects\pythonProject3\venv\Lib\site-packages\selenium\webdriver\remote\webelement.py", line 93, in click
    self._execute(Command.CLICK_ELEMENT)
  File "C:\Users\username\PycharmProjects\pythonProject3\venv\Lib\site-packages\selenium\webdriver\remote\webelement.py", line 403, in _execute
    return self._parent.execute(command, params)
           ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
  File "C:\Users\username\PycharmProjects\pythonProject3\venv\Lib\site-packages\selenium\webdriver\remote\webdriver.py", line 440, in execute
    self.error_handler.check_response(response)
  File "C:\Users\username\PycharmProjects\pythonProject3\venv\Lib\site-packages\selenium\webdriver\remote\errorhandler.py", line 245, in check_response
    raise exception_class(message, screen, stacktrace)
selenium.common.exceptions.ElementClickInterceptedException: Message: element click intercepted: Element is not clickable at point (759, 3145)
  (Session info: chrome=112.0.5615.138)

Note: Clicking desired element using JavaScript or Keyboard events both work.

# Below both ways manage to click successfully
driver.execute_script("arguments[0].click();", element)
element.send_keys(Keys.ENTER)

Why element.click() doesn't work? Hasn't element_to_be_clickable condition already checked that the desired element is clickable or not, and hence element.click() should work?

Answer 1

This is a common misunderstanding. EC.element_to_be_clickable() just waits for the element to be visible and not disabled (think INPUT). It doesn't actually check to see if another element is covering the element you are trying to click, which is the case you are running into.

Usually the error message will include the HTML of the element that intercepted the click but I'm not seeing it in your case. Just run the script and look to see where the element you're attempting to click is and what's covering it. Commonly it's one of a few things: a popup dialog, some transitional dialog that comes up and then disappears after a few seconds, some part of the UI of the website like a floating header/footer, etc. Once you figure out what's blocking the element, you can dismiss it or maybe scroll the page so that it's no longer covering the element.

Another option is to use a JS click to click the covered element but only do this if you aren't writing UI tests because no user can click an element *under* another element.

e = driver.find_element(locator)
driver.execute_script("arguments[0].click();", e)