Unable to locate elements present under flex in selenium

Question

I was trying to automate a Demo Website link. But was not able to locate the Shop Now button using my relative path //a[contains(text(),'Shop Now')]. I noticed flex was written in the DOM does that affect it?

Can someone tell me what am I missing here?

Shop Now Button Image

Answer 1

The element Shop Now 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 LINK_TEXT:

    driver.get("https://demo.competethemes.com/")
    WebDriverWait(driver, 20).until(EC.frame_to_be_available_and_switch_to_it((By.CSS_SELECTOR,"iframe#iframe")))
    WebDriverWait(driver, 20).until(EC.element_to_be_clickable((By.LINK_TEXT, "Shop Now"))).click()
    

  • Using XPATH:

    driver.get("https://demo.competethemes.com/")
    WebDriverWait(driver, 20).until(EC.frame_to_be_available_and_switch_to_it((By.XPATH,"//iframe[@id='iframe']")))
    WebDriverWait(driver, 20).until(EC.element_to_be_clickable((By.XPATH, "//a[text()='Shop Now']"))).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