Selenium python - find element by data-value

Viewed 2206

this element is a multiple-choice region selector but I do not know how to interact with it.

HTML element

<div class="Input_select__uImQR Region_select__1h_yh"><span>NA</span><ul><li 
data-value="na">NA</li><li data-value="sa">SA</li><li data-value="eu">EU</li><li data- 
value="ap">AP</li><li data-value="kr">KR</li></ul></div>

When you manually click on the list the Class name changes to

<div class="Input_select__uImQR Region_select__1h_yh Input_open__3e__v">

code

driver.get("https://www.valorant.store/")
  time.sleep(1)
  clickshop = driver.find_element_by_class_name("SkinsBundle_loggedOut__3kG35").click()
  time.sleep(2)
  usernameshop = driver.find_element_by_name("username")
  usernameshop.send_keys(name)
  passwordshop = driver.find_element_by_name("password")
  passwordshop.send_keys("notmypassword")
  driver.find_element_by_xpath("//option[@value='eu']").click()
  time.sleep(10)
  usernameshop.send_keys(Keys.RETURN)

Here is all the code(the account is for testing and you are free to use it)

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

from selenium.webdriver.common.action_chains import ActionChains
import sys, os

driver = webdriver.Firefox()
skinfound  = bool(False)
while skinfound == False:

  driver.maximize_window()
  driver.get("https://www.valorant.store/")
  time.sleep(1)
  clickshop =driver.find_element_by_class_name("SkinsBundle_loggedOut__3kG35").click()
  time.sleep(2)
  usernameshop = driver.find_element_by_name("username")
  usernameshop.send_keys("sy9e0w6uimpc6fek")
  passwordshop = driver.find_element_by_name("password")
  passwordshop.send_keys("2ejly4ocpwifjbhj")
  driver.find_element_by_xpath("//li[@data-value='eu']").click()

  time.sleep(10)
  usernameshop.send_keys(Keys.RETURN)
  time.sleep(10)
  WebDriverWait(driver, 10).until(EC.element_to_be_clickable((By.XPATH,"//img[@src='/images/bonuscard.png' and @alt='Card Icon']"))).click()
  time.sleep(2)
  skins = driver.find_element_by_class_name("NightMarket_itemsGrid__9e2S-").text
  print(skins)
  if "Prime" in skins:
    print("A Prime skin was found")
    skinfound = True
  else:
    print("skinwasnotfound")
3 Answers

I do not see this xpath

//option[@value='eu']

in the shared HTML.

if this is the HTML

<li data-value="eu">EU</li>

you could write xpath as :

//li[@data-value='eu']

or

//li[text()='EU']

In code, you could use it like :

driver.find_element_by_xpath("//li[@data-value='eu']").click()

or

wait = WebDriverWait(driver, 20)
wait.until(EC.element_to_be_clickable((By.XPATH, "//li[text()='EU']"))).click()

Imports :

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

Update 1:

driver = webdriver.Firefox()
driver.maximize_window()
driver.implicitly_wait(30)
driver.get("https://www.valorant.store/")
wait = WebDriverWait(driver, 20)
wait.until(EC.element_to_be_clickable((By.XPATH, "//span[text()='LOGIN']/.."))).click()
wait.until(EC.visibility_of_element_located((By.NAME, "username"))).send_keys('user name here')
wait.until(EC.visibility_of_element_located((By.NAME, "password"))).send_keys('password here')
wait.until(EC.element_to_be_clickable((By.CSS_SELECTOR, "div[class^='Input_select'] span"))).click()
time.sleep(2)
wait.until(EC.visibility_of_element_located((By.XPATH, "//li[@data-value='eu']"))).click()

this should work for you.

in case you need to handle pop up that appears sometime before login , you can use the below code :

driver = webdriver.Firefox()
driver.maximize_window()
driver.implicitly_wait(30)
driver.get("https://www.valorant.store/")
wait = WebDriverWait(driver, 20)

try:
    if(len(driver.find_elements(By.XPATH, "(//i[@class='fas fa-times']/..)[2]"))) > 0:
      print("Alert is present")
      wait.until(EC.element_to_be_clickable((By.XPATH, "(//i[@class='fas fa-times']/..)[2]"))).click()
    else:
        print("Alert is not present")
except:
    print("Something went wrong related to alert, may be it was not visible, but code will work")
    pass


wait.until(EC.element_to_be_clickable((By.XPATH, "//span[text()='LOGIN']/.."))).click()
wait.until(EC.visibility_of_element_located((By.NAME, "username"))).send_keys('user name here')
wait.until(EC.visibility_of_element_located((By.NAME, "password"))).send_keys('password here')
wait.until(EC.element_to_be_clickable((By.CSS_SELECTOR, "div[class^='Input_select'] span"))).click()
time.sleep(2)
wait.until(EC.visibility_of_element_located((By.XPATH, "//li[@data-value='eu']"))).click()

To select a region you first have to click on a drop-down menu.
Also it's recommended to use explicit waits instead of hardcoded sleeps.
With this two your code will be something like this:

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

wait = WebDriverWait(driver, 20)

driver.maximize_window()
driver.get("https://www.valorant.store/")

wait.until(EC.visibility_of_element_located((By.CSS_SELECTOR, "div.SkinsBundle_loggedOut__3kG35"))).click()

wait.until(EC.visibility_of_element_located((By.CSS_SELECTOR, "input[name='username']"))).send_keys("username")

wait.until(EC.visibility_of_element_located((By.CSS_SELECTOR, "input[name='password']"))).send_keys("password")

wait.until(EC.visibility_of_element_located((By.XPATH, "//div[contains(@class,'Region_select')]"))).click()

wait.until(EC.visibility_of_element_located((By.CSS_SELECTOR, "li[data-value='eu']"))).click()

I can see the class name of the dropdown is changing when we are clicking on it, So by using explicitWait we clicked on dropdown, and further uses the static part of the class name which is not changing after clicking on the dropdown

driver.get("https://www.valorant.store/")
clickshop = driver.find_element_by_class_name("SkinsBundle_loggedOut__3kG35").click()
usernameshop = driver.find_element_by_name("username")
usernameshop.send_keys("Name")
passwordshop = driver.find_element_by_name("password")
passwordshop.send_keys("notmypassword")

Here we click on the Region dropdown

WebDriverWait(driver,10).until(EC.element_to_be_clickable((By.XPATH,"//div[contains(@class,'Input_select__uImQR')]"))).click()

Action class is used to move to the element and click on the based on the XPath index, You can select any value just by changing the XPath index

action = ActionChains(driver)
action.move_to_element(driver.find_element_by_xpath("((//div[contains(@class,'Input_select__uImQR')]//li)[4])")).click().perform()
Related