Question

我正在使用vue.js从数据列表中选择一个选项。

您知道如何使用Selenium从选项列表中进行选择吗？

我可以在输入字段中键入，然后显示选择列表。但是我发送到输入字段的ArrowDown事件不会导致选择。

当在输入中提供精确匹配时，将采用该唯一选项的值，但是如果我使用部分匹配并且尝试选择一个选项，则无法导航至所需的选项。似乎未出现选项列表，并且将ArrowDown enevt发送到输入不会导致选项选择。我试图延迟关键事件，以为选项列表需要时间才能呈现并变得交互式，所以我还真正做到了将多个ArrowDown与Enter事件结合在一起。什么都没用。

这是我的vue.js模板：

<datalist id="allUsers">
    <option v-for="user in $parent.users" :label="user.fullName + ' (' + user.email + ')' " :value="user.email">{{user.fullName}} - {{user.email}}</option>
</datalist>
<input class="form-control" name="UserEmail" type="email" list="allUsers" id="selectedEmail" v-on:change="updateEmail($event.target.value)" :value="selectedEmail">

这是我在浏览器（HTML）中看到的内容：

<datalist id="allUsers">
    <option label="UserA (a@mailinator.com)" value="a@mailinator.com">UserA - a@mailinator.com</option>
    <option label="UserB (b@mailinator.com)" value="b@mailinator.com">UserB - b@mailinator.com</option>
</datalist>
<input name="User" type="text" list="allUsers" id="selectedEmail" class="form-control">

使用硒，我可以成功过滤选项：

IWebElement uiElement = null;
uiElement = driver.FindElement(By.Id("selectedOption"));
uiElement.Clear();
uiElement.SendKeys("UserA");
Thread.Sleep(500);

到目前为止，一切正常。下拉列表仅包含我的选项。但是由于绑定，因此未选择它。我希望这段代码能用，但是它没有给我显示的选项列表。

var optionsElements = uiElement.FindElements(By.TagName("option"));
TestContext.Log(TestContext.LoggingAbstractionType.SeleniumInterface, "Have " + optionsElements.Count + " options!");
if(optionsElements.Count > 0)
{
    optionsElements[0].Click();
}

使用Selenium从HTML DataList控件中选择选项

0 个答案: