How to click on an autocomplete after filling partial text?

问题

I am testing a form, it has a categories field, it's an input-based drop-down menu. After add some text with .send_keys('text') it shows a list of categories. Take a look at its HTML:

<input type="text" aria-required="true" id="categories" maxlength="64" value="" autocomplete="off" class="input__69f5f__1POmY" placeholder="Pizza (Be specific)">

I am doing this to find and submit input text:

categories = browser.find_element_by_id('categories').send_keys('Software Development')

after that, it shows a list like:

Please someone can help me, how can I click on an option in the drop-down menu?

I am using the Firefox webdriver.

Thanks.

回答1:

this is not an elegant solution but I'd go about coding something like below to select the item from the dropdown.

import time
from selenium.webdriver import Chrome

driver = Chrome()
driver.get('https://biz.yelp.com/signup_business/new')
categories_input = driver.find_element_by_id('categories')
categories_input.send_keys('Professional')

time.sleep(5) # replace with webdrive wait
categories_container = categories_input.find_element_by_xpath('..')
categories = categories_container.find_elements_by_css_selector('li[class*="suggestion-list-item"]')

for category in categories:
    if category.text == 'Professional Services':
        category.click()
        break

回答2:

To click on the option with text as Professional Services > Software Development you have to induce WebDriverWait for the element_to_be_clickable() and you can use either of the following Locator Strategies:

• Code Block:

  from selenium import webdriver
  from selenium.webdriver.common.by import By
  from selenium.webdriver.support.ui import WebDriverWait
  from selenium.webdriver.support import expected_conditions as EC
  
  driver.get("https://biz.yelp.com/signup_business/new")
  WebDriverWait(driver, 20).until(EC.element_to_be_clickable((By.XPATH, "//input[@id='categories']"))).send_keys("Software Development")
  WebDriverWait(driver, 20).until(EC.element_to_be_clickable((By.XPATH, "//input[@id='categories']//following::div[1]/ul/li"))).click()
  

• Browser Snapshot:

来源：https://stackoverflow.com/questions/60073607/how-to-click-on-an-autocomplete-after-filling-partial-text