Element not interactable in Selenium Chrome Headless Mode

Question

My code is working all fine when I don't run chrome in headless mode, but in headless mode I get 'Element not interactable'.

I get error at email_box.send_keys('')

And I have set the window size, still it is not working

Code:

from selenium.webdriver import Chrome
from selenium.webdriver.chrome.options import Options
from selenium.webdriver.support.ui import WebDriverWait
from selenium.webdriver.common.by import By
import time

options = Options()
options.add_argument('headless')
options.add_argument('window-size=1366x768')

with Chrome(options=options) as driver:
    driver.get('https://accounts.google.com/login')

    WebDriverWait(driver, 20).until(lambda d: d.find_element(By.TAG_NAME, 'input'))

    time.sleep(2)
    email_box = driver.find_element(By.TAG_NAME, 'input')
    time.sleep(2)
    email_box.send_keys('[email protected]')

Schaab

Answer 1

To send the gmail to the input tag do the following.

from selenium.webdriver.support import expected_conditions as EC

email_box=WebDriverWait(driver, 20).until(EC.presence_of_element_located((By.XPATH, "//input[@type='email']")))
driver.implicitly_wait(2)
email_box.send_keys('[email protected]')

Cockscomb

It works, man! Thanks a lot! Can you please elaborate why an element that I was able to find while running non headless, was not available in headless mode? Sorry if it's a dumb question, I'm new to headless chrome.. Thank you so much tho! – Schaab

The major issue was more about your tag selection than running in headless. – Cockscomb

Answer 2

If anyone wants another solution for this, I found this one as well. For some reason when the window isn't maximized you may have trouble clicking elements:

Add the following parameters to chromedriver in the Python environment

from selenium.webdriver.chrome.options import Options

def get_options():
    chrome_options = Options()
    chrome_options.add_argument("--window-size=1920,1080")
    chrome_options.add_argument("--start-maximized")
    chrome_options.add_argument("--headless")
    return chrome_options

Jaworski

Saved my day, this should be an accepted answer. Because of small window in headless mode my element was out of visible area and hidden. Going to maximized window fixes this. – Variance

Thanks a lot - spend hrs to figure this out ! – Synecdoche

Answer 3

So I tried all the proposed solutions but nothing worked for me. In my case, I was crawling a SPA using AngularJS. The solution that I found was the following option setting for the webdriver:

options.add_argument("--window-size=1920,1080")

And after that just waiting for the element you want to click to be clickable like shown before:

elem = WebDriverWait(driver, 20).until(EC.presence_of_element_located((By.XPATH, 'somexpath')))

I tried maximizing window both ways i.e. from options as well as directly from the driver instance. But both ways did not work for me.

Here is the link to the Github issue page where I found the solution: https://github.com/angular/protractor/issues/5273

Cheers

Woolson

Worked for me but I went a little smaller, 1280x720. Thanks! – Footpoundal

Answer 4

If you try to debug and print outerHTML of "email_box", it's looking for an element that is not interactable which is

Be more specific/unique with your locator. You may use //input[@type="email"] for email field

Bestraddle

Answer 5

I had the same problem. I was able to solve it only putting the code within a try catch. Example:

enter code here

public void crearSiniestro() throws InterruptedException {

try {
WebElement crear=wait.until(ExpectedConditions.visibilityOfElementLocated(By.id("SiniestrosListForm:datalist:crearButton")));
crear.click();
}
catch(Exception e) {
    System.out.println("Options not available");
 }  

}

Krimmer

That's not solving anything - first of all, it's hiding the problem and secondly the click action will still not happen.. – Fucoid