How to locate this element?

Question

I want to locate the "NEXT" button. Locating by class name is not working because there is other element with the same class name. This button has no ID.

I tried locating by xpath>>contains text etc and it works. But it's not the perfect way, due to possible future translation of the site and the "NEXT" text may seem quite another... It is about 2 last lines.

https://i.stack.imgur.com/7YbPK.jpg

from time import sleep

import self as self
from selenium import webdriver
from selenium.common.exceptions import ElementClickInterceptedException, StaleElementReferenceException
from selenium.webdriver.common.by import By
from selenium.webdriver.support.ui import WebDriverWait
from selenium.webdriver.support import expected_conditions as EC
from selenium.webdriver.common.keys import Keys

driver = webdriver.Chrome(executable_path="C:\Chromedriver\chromedriver.exe")
driver.implicitly_wait(1)
driver.get("https://cct-103.firebaseapp.com/")

try:
    checkin = WebDriverWait(driver, 1).until(EC.element_to_be_clickable((By.CLASS_NAME, "MuiButton-label")))
    checkin.click()
except StaleElementReferenceException:
    checkin = WebDriverWait(driver, 1).until(EC.element_to_be_clickable((By.CLASS_NAME, "MuiButton-label")))
    checkin.click()

locator = (By.ID, "guestName")
guest_input = driver.find_element(*locator)
guest_input.send_keys("xyz")

 next_button = driver.find_element_by_xpath("//*[contains(text(), 'NEXT')]")     
 next_button.click()

https://imgur.com/a/N6RK4Hh – Virtual107 Sep 13 '19 at 11:48 — Virtual107, Sep 13 '19 at 11:48

KunduK · Accepted Answer · 2019-09-13T12:53:47.537

1

Use WebDriverWait and element_to_be_clickable and the following locator option.

next_button =  WebDriverWait(driver, 10).until(EC.element_to_be_clickable((By.XPATH,"//button[contains(., 'NEXT')]")))
next_button.click()

Sometimes you might get intercepted exception.

 next_button =  WebDriverWait(driver, 10).until(EC.element_to_be_clickable((By.XPATH,"//button[contains(., 'NEXT')]")))
 driver.execute_script("arguments[0].click();", next_button)

Updated the code with Css selector.

next_button =  WebDriverWait(driver, 10).until(EC.element_to_be_clickable((By.CSS_SELECTOR,"button.MuiButtonBase-root")))
next_button.click()

Or

next_button =  WebDriverWait(driver, 10).until(EC.element_to_be_clickable((By.CSS_SELECTOR,"button.MuiButtonBase-root")))
driver.execute_script("arguments[0].click();", next_button)

edited Sep 13 '19 at 12:53

answered Sep 13 '19 at 12:24

KunduK

32,888
5
17
41

Checkin and guest_input works properly. The problem is with "NEXT" button. I don't want to locate it by text which this button contains because this site can be translated in future. And the "next" text will change to German (or other language) version of this word. How to locate this "NEXT" button? – Virtual107 Sep 13 '19 at 12:30
@Virtual107 : try now the updated css selector and let me know. – KunduK Sep 13 '19 at 12:34
You are right, I could locate it using CSS Selector. May I use simple "Next_button.click()" instead of "driver.execute.....". What is actually the difference? – Virtual107 Sep 13 '19 at 12:39
Yes you can do simple click that was I have mentioned.However sometimes you might get intercepted exception if you get then you can use driver.execute option. – KunduK Sep 13 '19 at 12:43

score 1 · Answer 2 · answered Sep 13 '19 at 12:27

To locate and click() on the element with text as NEXT you have to induce WebDriverWait for the element_to_be_clickable() and you can use either of the following Locator Strategies:

Using CSS_SELECTOR:

driver.get("https://cct-103.firebaseapp.com/")
WebDriverWait(driver, 20).until(EC.element_to_be_clickable((By.CSS_SELECTOR, "span.MuiButton-label"))).click()
WebDriverWait(driver, 20).until(EC.element_to_be_clickable((By.CSS_SELECTOR, "input#guestName[name='guestName']"))).send_keys("Virtual107")
WebDriverWait(driver, 20).until(EC.element_to_be_clickable((By.CSS_SELECTOR, "button.MuiButtonBase-root.MuiButton-root.MuiButton-contained>span.MuiButton-label"))).click()

Using XPATH:

driver.get("https://cct-103.firebaseapp.com/")
WebDriverWait(driver, 20).until(EC.element_to_be_clickable((By.XPATH, "//span[@class='MuiButton-label']"))).click()
WebDriverWait(driver, 20).until(EC.element_to_be_clickable((By.XPATH, "//span[@class='MuiButton-label']"))).send_keys("Virtual107")
WebDriverWait(driver, 20).until(EC.element_to_be_clickable((By.XPATH, "//span[@class='MuiButton-label' and text()='NEXT']"))).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

How to locate this element?

2 Answers2