Question

我有一个像这样定义的语义UI：

<div class="ui selection dropdown" id="my_dropdown">
    <input name="gender" type="hidden">
    <i class="dropdown icon"></i>
    <div class="default text">Gender</div>
    <div class="menu">
        <div class="item" data-value="1">Male</div>
        <div class="item" data-value="0">Female</div>
    </div>
</div>

我正在使用$('.ui.dropdown').dropdown();初始化它。

现在，当我想测试我使用Protractor运行的端到端测试的下拉列表时，它不允许我选择它，我这样做：

element(by.id('my_dropdown')).click().then(function() {
    element.all(by.css('#my_dropdown option')).then(function(options) {
        options[1].click();
    });
});

它失败了：Failed: element not visible。

如何选择下拉值？

Answer 1

语义用户界面隐藏<select>以及其中包含的<option>，并用更好看的<div>替换它们。因此，Protractor和底层webdriver正确发现元素是隐藏的。带有承诺的干净方式在这里不起作用，我们必须通过语义UI选择它们，即我们必须在我们的Protractor规范中执行一些JS，如下所示：

browser.executeScript('$("#my_dropwdown").dropdown("set selected", "1")');

这会选择带有<option> 1的data-value。

使用量角器

1 个答案: