Selenium: How to find and element by ID

Question

I started learning Selenium to automatize some tests and I got stuck right in the beginning of the tutorial. I want to be able to locate an html element by ID and click on it. So far, this is the coed I have:

import os
from selenium import webdriver

os.environ['PATH'] += r"C:\\Users\\joaop\\Documents\\Selenium\\SeleniumDrivers"
driver = webdriver.Firefox()
driver.get("https://www.globalsqa.com/demo-site/progress-bar/")
driver.implicitly_wait(10)
my_element = driver.find_element("id", 'downloadButton')
my_element.click()

The id of the button is really downloadButton.

Can you guys help me?

Answer 1

The Start Download element is within an <iframe> so you have to:

• Induce WebDriverWait for the desired frame to be available and switch to it.

• Induce WebDriverWait for the desired element to be clickable.

• You can use either of the following locator strategies:

  • Using CSS_SELECTOR:

    driver.get("https://www.globalsqa.com/demo-site/progress-bar/")
    WebDriverWait(driver, 20).until(EC.frame_to_be_available_and_switch_to_it((By.CSS_SELECTOR,"iframe.demo-frame.lazyloaded")))
    WebDriverWait(driver, 20).until(EC.element_to_be_clickable((By.CSS_SELECTOR, "button#downloadButton"))).click()
    

  • Using XPATH:

    driver.get("https://www.globalsqa.com/demo-site/progress-bar/")
    WebDriverWait(driver, 20).until(EC.frame_to_be_available_and_switch_to_it((By.XPATH,"//iframe[@class='demo-frame lazyloaded']")))
    WebDriverWait(driver, 5).until(EC.element_to_be_clickable((By.XPATH, "//button[@id='downloadButton']"))).click()
    

• Note : You have to add the following imports :

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

• Browser Snapshot:

---

Reference

You can find a couple of relevant discussions in:

• Switch to an iframe through Selenium and python
• selenium.common.exceptions.NoSuchElementException: Message: no such element: Unable to locate element while trying to click Next button with selenium
• selenium in python : NoSuchElementException: Message: no such element: Unable to locate element

Answer 2

You need to open the website or a program that you're trying to automate using a standard internet browse like Chrome or Safari. Once you open the browser, you will need to open the developer tools. Each browser has a different path to a developer tools. Once you open the developer tools, you will need to find the element that you're trying to automate. Some elements will have IDs. It will say something like id='myid123' for example. That's what you will need to put into your program. However, this is not all. You will also need to indicate the path of the element. To find the path, you will need to select the element with the mouse, do right click, and select Inspect. This will show your selected element in HTML tree. Then, the next part will be to find path to the selected element which could be very complex depending on how your program or website is coded. In some case, it will be easy. In other cases, it will be very complex. I suggest to use SelectorsHub browser extension - available for all browsers. Once you install it, then you can select the element, do right mouse click and select SelectorsHub menu and pick like copy relative CSS Selector option, for example. This will give you the path. Once you have ID and the path, then you can include these parameters in your code. Some elements will not have IDs, but there are other parameters that you can use. You can also combine multiple parameters in your code.