Selenium fails to detect password field

Question

If you visit: http://212.238.166.253:8080/

You will notice the following html element:

<input type="password" autocapitalization="off" autocomplete="off" value="" name="login_passwd" tabindex="2" class="form_input" maxlength="16" onkeyup="" onpaste="return false;" onblur="" placeholder="Password">

In python I wrote:

import time

import selenium.common.exceptions as SE
from selenium import webdriver
from selenium.webdriver.chrome.service import Service
from selenium.webdriver.common.by import By
from selenium.webdriver.support import expected_conditions as EC
from selenium.webdriver.support.ui import WebDriverWait

PASSWORD_XPATH = "//input[(@type='password') or (@type='Password') or (@type='PASSWORD')]"

if __name__ == '__main__':
    driver = webdriver.Chrome(service=Service(
        '/Users/algo/.wdm/drivers/chromedriver/mac64/100.0.4896.60/chromedriver'))
    driver.get('http://212.238.166.253:8080/')
    time.sleep(5)
    try:
        password_input = WebDriverWait(driver, timeout=5).until(
            EC.element_to_be_clickable((By.XPATH, PASSWORD_XPATH)))
    except SE.TimeoutException:
        print('Nothing was Found!')

But all I get is:

Nothing was Found!

Why is that? I double checked and the page got directly fully uploaded, increasing timeout and sleep time didn't work either. Why the element wasn't found even though it's there?

Answer 1

As @Arundeep Chohan mentioned the locator strategy you have used identifies multiple elements within the HTML DOM.

where the first matching element is having style="display: none; and ofcoarse isn't your desired element.

<input name="foilautofill" style="display: none;" type="password">

Hence, Nothing was Found! gets printed.

---

The second matching node is your desired element

<input type="password" autocapitalization="off" autocomplete="off" value="" name="login_passwd" tabindex="2" class="form_input" maxlength="16" onkeyup="" onpaste="return false;" onblur="" placeholder="Password">

You need to construct canonical locator strategies which identifies the desired element uniquely within the DOM Tree.

---

Solution

To locate the element ideally you need to induce WebDriverWait for the element_to_be_clickable() you can use either of the following locator strategies:

• Using CSS_SELECTOR:

  password_input = WebDriverWait(driver, 20).until(EC.element_to_be_clickable((By.CSS_SELECTOR, "input[type='password'][name='login_passwd']")))
  

• Using XPATH:

  password_input = WebDriverWait(driver, 20).until(EC.element_to_be_clickable((By.XPATH, "//input[@type='password' and @name='login_passwd']")))