Unable to locate the element on an angular website

Question

I have tried the below code and it is always timing out. But when I look it up with the browser inspector, I can see the Username input element.

I have also tried to find it by ID but not able to.

Tried almost all of the existing questions/solutions on this forum but was unable to figure it out.

        driver.get("https://www.dat.com/login")
        time.sleep(5)

        driver.find_element_by_css_selector("a[href*='https://power.dat.com/']").click()
        time.sleep(5)

        # explicitly waiting until input element load
        try:
            WebDriverWait(driver, 10).until(
                EC.presence_of_element_located((By.NAME, "username"))
            )
        except TimeoutException:
            print(
                "Waited 10 seconds for the username input to load but did not happen..."
            )
        except Exception as e:
            print(f"Exception while waiting for username input to appear: \n {e}")
            sys.exit(1)

Answer 1

2 issues here:

1. After clicking on "DAT Power" on the first page a new tab is opened. To continue working there you need to switch the driver to the second tab.
2. You will probably want to enter a text into the username there. If so you need to wait for element clickability, not presence only.
   Also, the current Selenium version (4.x) no more supports find_element_by_* methods, the new style should be used, as following presented.
   The following code works:

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

options = Options()
options.add_argument("start-maximized")

webdriver_service = Service('C:\webdrivers\chromedriver.exe')
driver = webdriver.Chrome(options=options, service=webdriver_service)
wait = WebDriverWait(driver, 10)

url = "https://www.dat.com/login"
driver.get(url)

wait.until(EC.element_to_be_clickable((By.CSS_SELECTOR, "a[href*='https://power.dat.com/']"))).click()
new_tab = driver.window_handles[1]
driver.switch_to.window(new_tab)
wait.until(EC.element_to_be_clickable((By.NAME, "username"))).send_keys("name@gmail.com")

The result is