"Element is not clickable at point (x,y)". Invisible element covers the button

Question

I’m stuck trying to get Selenium with Chrome Webdriver to click a buttom, but there is an element <div class="modal-overlay" style="display: block;"></div> that covers the entire page and is invisble, that is blocking my clicks. How can I work around this?

I tried using this:

element = driver.find_element_by_xpath("//input[@type='submit']")
driver.execute_script("arguments[0].click();", element)

but it didn’t work. What can I do in this situation? EDIT: I used luke_aus answer and got this from the page: (third last image)

https://i.stack.imgur.com/loagC.jpg

Could you tell me when this model overlay visible and when invisible?? — Saurabh Gaur, Aug 17 '16 at 03:26
And what do you mean didn't work using `execute_script`??? Is there any exception or anything else?? — Saurabh Gaur, Aug 17 '16 at 03:28
No exception, the code continues and the next line fails because its looking at an element that doesnt exist yet (because the buttom wasnt clicked). I'll will upload a couple of screenshots to show the overlay, but basically the only moment when its "visible" is when Im about to click the buttom I want — Silver, Aug 17 '16 at 03:38
You mean the overlay visible when you goes to click on submit button by mouse over otherwise invisible??? — Saurabh Gaur, Aug 17 '16 at 03:42
The overlay is always invisible, until I click the delete ad buttom, which causes the form in the screenshot to pop up. In order to delete a post, I must confirm it in the form. Only when the form is up, is when the overlay is visible. — Silver, Aug 17 '16 at 03:47
So before clicking on submit button you should wait for invisibility of overlay — Saurabh Gaur, Aug 17 '16 at 03:49
But overlay was coded for it to be intentionally visible when the form is up. I can't wait untill its invisible again, for it will be visible as long as I dont click the form (while at the same time preventing me from clicking the form) — Silver, Aug 17 '16 at 03:53
So do you want to forcefully invisible this overlay before click on submit button?? — Saurabh Gaur, Aug 17 '16 at 03:56
that would be a nice solution, since submitting the form via injected javascript (luke_aus's answer) didn't worked. — Silver, Aug 17 '16 at 03:58
Ok I have provided it as an answer try it and let me know...:) — Saurabh Gaur, Aug 17 '16 at 04:04

Saurabh Gaur · Accepted Answer · 2016-08-17T05:01:54.727

2

In your case you need to make overlay element invisible forcefully before going to click on submit button as below :-

#first make overlay element invisible 
overlay = driver.find_element_by_css_selector("div.modal-overlay")
driver.execute_script("arguments[0].style.display = 'none'", overlay)

#now find submit button and click 
driver.find_element_by_id("DeleteSurveyO‌K").click()

Edited1 :- If still it throws exception that submit button is invisible, you should try using WebDriverWait to wait until submit button visible after overlay element invisible as below :

from selenium import webdriver
from selenium.webdriver.common.by import By
from selenium.webdriver.support.ui import WebDriverWait
from selenium.webdriver.support import expected_conditions as EC

#first make overlay element invisible 
overlay = driver.find_element_by_css_selector("div.modal-overlay")
driver.execute_script("arguments[0].style.display = 'none'", overlay)

#now find submit button and click 
button = WebDriverWait(driver, 10).until(
EC.visibility_of_element_located((By.ID, "DeleteSurveyO‌K")))
button.click()

Edited2 :- If unfortunately submit button is not getting visible try to submit form instead of clicking submit button as below :-

#first make overlay element invisible 
overlay = driver.find_element_by_css_selector("div.modal-overlay")
driver.execute_script("arguments[0].style.display = 'none'", overlay)

#now submit the form 
driver.find_element‌_by_id("ModelSurveyFo‌rm").submit()

edited Aug 17 '16 at 05:01

answered Aug 17 '16 at 04:03

Saurabh Gaur

23,507
10
54
73

The overlay truly becomes invisible again, so that part worked wonderfully. But im getting the following errors: when using: " driver.find_element_by_id("DeleteSurvey")" I get this error: driver.find_element_by_id("DeleteSurveyO\u200c\u200bK").click() and when using: "driver.find_element_by_xpath("//*[@id='DeleteSurveyOK']").click()" I get: " Failed to execute 'evaluate' on 'Document': The string '//*[@id='DeleteSurveyOK']\u200b' is not a valid XPath expression." Any idea of why its adding the extra '\u200b' that causes the error? – Silver Aug 17 '16 at 04:16
Why are you going to find element using xpath if could be simply find by I'd as answer provided...use `find_element_by_id` instead and let me know... – Saurabh Gaur Aug 17 '16 at 04:20
I did. In my first run I used: driver.find_element_‌by_id("DeleteSurvey")‌ and it returned the folllowing error: " File "KijijiAutoPosting.py", line 119, in reposting driver.find_element_by_id("DeleteSurveyO\u200c\u200bK").click() ... ... raise exception_class(message, screen, stacktrace) selenium.common.exceptions.NoSuchElementException: Message: no such element" – Silver Aug 17 '16 at 04:22
for reasons that go beyond me, it decided to add some zero witdh space that makes selenium unable to find the element – Silver Aug 17 '16 at 04:22
Why append extra char in between I'd as `DeleteSurveyO\‌u200c\u200bK`??? Please copy the correct I'd from page and pass it... – Saurabh Gaur Aug 17 '16 at 04:22
You are just providing partial id as `DeleteSurvey‌` which is wrong..`find_element_by_id` find element by exact matching of provided Id so you need to provide exact correct I'd.. – Saurabh Gaur Aug 17 '16 at 04:26
I did NOT append any extra characters. I think it was some weird formatting going in my text editor. I fixed it by writting it by hand, instead of pasting your version, and I get this exeption: "selenium.common.exceptions.ElementNotVisibleException: Message: element not visible" – Silver Aug 17 '16 at 04:28
Hmm now this is the right exception...now you should implement `WebdriverWait` to wait until it's visible after overlay invisible before click... – Saurabh Gaur Aug 17 '16 at 04:30
Ya I have edited my answer..try with it and let me know...:) – Saurabh Gaur Aug 17 '16 at 04:36
I got this: "raise TimeoutException(message, screen, stacktrace) selenium.common.exceptions.TimeoutException: Message: " – Silver Aug 17 '16 at 04:44
Ok try once `driver.find_element_by_id("ModelSurveyForm").submit()` and let me know... – Saurabh Gaur Aug 17 '16 at 04:55
@Silver try to submit form instead of clicking submit button...try second edited answer and let me know..:) – Saurabh Gaur Aug 17 '16 at 05:02

lukeaus · Answer 2 · 2016-08-17T02:52:33.833

1

Just use execute_script to submit the form

driver.execute_script("document.getElementById('myForm').submit()");

edited Aug 17 '16 at 02:52

answered Aug 17 '16 at 02:39

lukeaus

11,465
7
50
60

I got this error: selenium.common.exceptions.WebDriverException: Message: unknown error: document.getElementById(...).submit is not a function – Silver Aug 17 '16 at 02:48
@Silver You did use the _actual_ selector for the form, right? – Sebastian Simon Aug 17 '16 at 02:51
oops - just use single quotes...fixed – lukeaus Aug 17 '16 at 02:52
this is what I used: driver.execute_script("document.getElementById('DeleteSurveyOK').click()") – Silver Aug 17 '16 at 02:56
use .submit() not .click() – lukeaus Aug 17 '16 at 02:58
using submit() I get the: "selenium.common.exceptions.WebDriverException: Message: unknown error: document.getElementById(...).submit is not a function" error – Silver Aug 17 '16 at 03:03
that should work. This could be the problem http://stackoverflow.com/a/834197/3003438 – lukeaus Aug 17 '16 at 03:10
So, I used your code, but the page showed me a "oops, something happened error" and they did not tell me the error. Clicking the element normally shows no problem. Im starting to think that the buttom is intentionally hard to click – Silver Aug 17 '16 at 03:45
@Silver the actual error says "oops, something happened"? - where are you seeing this? – lukeaus Aug 17 '16 at 05:11
see the pictures in the link under the edit of my post. Also, I was able to do it already =) thanks for the help anyway – Silver Aug 17 '16 at 05:35

"Element is not clickable at point (x,y)". Invisible element covers the button

2 Answers2