使用硒输入后如何从数据列表中选择选项答案

【问题标题】：How to select option from datalist after typing using selenium使用硒输入后如何从数据列表中选择选项
【发布时间】：2021-02-16 16:36:07
【问题描述】：

我正在尝试使用 selenium 从数据列表中选择一个选项。首先，从键发送选项名称，然后发送向下箭头以选择它。一切顺利，直到发送 ENTER 键，它不采取任何行动。我必须按下并输入键才能使提交按钮可点击并且无法修改 HTML 代码

我试过了

将全名发送到输入
同时发送 DOWN 和 ENTER 键
发送返回键

这是数据列表 HTML 代码

...
<input _ngcontent-njw-c0="" list="salesmans" placeholder="Selecciona Cliente o Vendedor" style="width: 100%;border: none;">
<datalist _ngcontent-njw-c0="" id="salesmans">
<option _ngcontent-njw-c0="" value="Vendedor Venta" ng-reflect-value="Vendedor Venta"></option>
<option _ngcontent-njw-c0="" value="juan peña hjvgvghghc" ng-reflect-value="juan peña hjvgvghghc"></option>
...

我的python代码

...
user_selector = WebDriverWait(self.loader.chrome_driver, con.TIME_LIMIT).until(
                ec.presence_of_element_located((By.XPATH, '//input[@placeholder="Selecciona Cliente o Vendedor"]')))

user_selector.send_keys(user_auth_data[2])
user_selector.send_keys(Keys.ARROW_DOWN)
...

元素图片：

【问题讨论】：

标签： python selenium-webdriver xpath css-selectors webdriverwait

【解决方案1】：

要从数据列表中选择文本为 Vendor Venta 的选项，使用 Selenium 而不是一起发送 DOWN 和 ENTER 键，因为所需元素是 Angular 元素，单击在您需要为element_to_be_clickable() 诱导WebDriverWait 的元素上，您可以使用以下任一Locator Strategies：

使用CSS_SELECTOR：

WebDriverWait(driver, 20).until(EC.element_to_be_clickable((By.CSS_SELECTOR, "input[placeholder="Selecciona Cliente o Vendedor"]"))).send_keys(user_auth_data[2])
WebDriverWait(driver, 20).until(EC.element_to_be_clickable((By.CSS_SELECTOR, "option[value='Vendedor Venta'][ng-reflect-value='Vendedor Venta']"))).click()

使用XPATH：

WebDriverWait(driver, 20).until(EC.element_to_be_clickable((By.XPATH, "//input[@placeholder="Selecciona Cliente o Vendedor"]"))).send_keys(user_auth_data[2])
WebDriverWait(driver, 20).until(EC.element_to_be_clickable((By.XPATH, "//option[@value='Vendedor Venta' and @ng-reflect-value='Vendedor Venta']"))).click()

注意：您必须添加以下导入：

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

【讨论】：

我尝试实现该解决方案，但收到错误消息：javascript error: option element is not in a select。为什么会这样？

【解决方案2】：

您可以尝试以下选项。

尝试将整个名称发送到输入并尝试首先手动按下“ENTER”或“TAB”按钮。（如果其中任何一个有效，那么您可以在输入全名后将该密钥发送到您的代码中）
尝试将整个名称发送到输入，然后找到您要选择的选项的 XPath。另请注意，一旦您发送了整个名称，一个选项（您要选择的）的 XPath 可能与原来的不同。所以请考虑一下。

我遇到了类似的问题，第二个选项对我有用，但是，我是在 C# 而不是 Python 中做到的。

谢谢，

John

【讨论】：