Python - How to find an element from a disappearing drop down using selenium

Question

I'm trying to find an element from a disappearing drop down on the steam homepage with selenium. When you type something in the search bar, results will drop down, and if you click outside of it the drop-down results will disappear. You would need to click it again if you want the results to appear again.

Anyway, my code enters an input into the search bar, and the drop-downs do show when input_elem.send_keys(game) runs (I used "terraria" as the input), and every first result has the same css selector. I also tried to find the element with the xpath, it doesn't work either:

from selenium import webdriver

game = input('Type the game you want to find here: ')

# configure browser
browser = webdriver.Firefox()
browser.get('https://store.steampowered.com/')

# input game
input_elem = browser.find_element_by_css_selector('#store_nav_search_term')
input_elem.send_keys(game)

# click the first result
first_match = browser.find_element_by_css_selector('a.match:nth-child(1)')
first_match.click()

Here's the full error:

Traceback (most recent call last):
  File "/home/fanjin/Documents/Python Projects/web_projects/steam/game_finder.py", line 14, in <module>
    first_match = browser.find_element_by_css_selector('a.match:nth-child(1)')
  File "/home/fanjin/.local/lib/python3.8/site-packages/selenium/webdriver/remote/webdriver.py", line 598, in find_element_by_css_selector
    return self.find_element(by=By.CSS_SELECTOR, value=css_selector)
  File "/home/fanjin/.local/lib/python3.8/site-packages/selenium/webdriver/remote/webdriver.py", line 976, in find_element
    return self.execute(Command.FIND_ELEMENT, {
  File "/home/fanjin/.local/lib/python3.8/site-packages/selenium/webdriver/remote/webdriver.py", line 321, in execute
    self.error_handler.check_response(response)
  File "/home/fanjin/.local/lib/python3.8/site-packages/selenium/webdriver/remote/errorhandler.py", line 242, in check_response
    raise exception_class(message, screen, stacktrace)
selenium.common.exceptions.NoSuchElementException: Message: Unable to locate element: a.match:nth-child(1)

score 1 · Accepted Answer · answered Aug 04 '20 at 19:40

To click on the first auto suggestions 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://store.steampowered.com/")
WebDriverWait(driver, 20).until(EC.element_to_be_clickable((By.CSS_SELECTOR, "input#store_nav_search_term"))).send_keys("terraria")
WebDriverWait(driver, 20).until(EC.element_to_be_clickable((By.CSS_SELECTOR, "div#search_suggestion_contents>a"))).click()

Using XPATH:

driver.get("https://store.steampowered.com/")
WebDriverWait(driver, 20).until(EC.element_to_be_clickable((By.XPATH, "//input[@id='store_nav_search_term']"))).send_keys("terraria")
WebDriverWait(driver, 20).until(EC.element_to_be_clickable((By.XPATH, "//div[@id='search_suggestion_contents']/a"))).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:

References

You can find a couple of relevant discussions on NoSuchElementException in:

Wow, thank you so much! I thought it was a loading issue too and used time.sleep, but that didn't seem to work. Thank you so much for your descriptive answer! — F.M, Aug 04 '20 at 20:35

Python - How to find an element from a disappearing drop down using selenium

1 Answers1

References