量角器：同一页上的两个下拉菜单，只能从一个下拉框中成功选择元素

Question

我正在使用Protractor运行一个自动脚本，其中一个页面上有两个下拉菜单，它们位于彼此的下方/上方。这两个似乎完全相同，只是它们有不同的ng模型名称等。我可以从一个下拉菜单中成功地选择一个元素，但我不能为另一个选择。这有点让我头疼，为什么一个有效，另一个无效。下面是我可以选择元素的下拉菜单的代码

<select class="form-control ng-pristine ng-invalid ng-invalid-required" ng-model="user.sourceOfFunds" required="" ng-class="{submitted:invalid}">
                <option value="">Select</option>
                <option value="Savings">Deposit</option>
                <option value="Inherited">Current</option>
                <option value="Other">Savings</option>
                        </select>

element(by.model('user.sourceOfFunds')).sendKeys('Savings');

我的另一个下拉菜单如下：

<select class="form-control ng-pristine ng-invalid ng-invalid-required" ng-model="user.investFigure" required="" ng-class="{submitted:invalid}">
                         <option value="">Select</option>
                         <option value="<20">Less than 20K</option>
                         <option value="20-50">20K-50K</option>
                         <option value="50-100">50K-100K</option>
                         </select>

element(by.model('user.investFigure')).sendKeys('Less than 20K');
or
element(by.model('user.investFigure')).sendKeys('20');

当我试图从第二个下拉菜单中选择一个项目时，我得到了“element not found”。我对为什么会发生这种事有点困惑

Answer 1

使用sendKeys选择下拉选项对我来说似乎很奇怪，即使它有效。鉴于@alecxe的好建议，也许问题在于可见性，但尝试另一种方法，看看sendKeys是否是您的问题。

我每天都在具有多个选择的测试中使用此代码，没有问题。也许它对你有用……

var selectOptionByText = function(text) {
    return element(by.cssContainingText('option', text)).click();
};

如此呼唤...

selectOptionByText('Less than 20');
selectOptionByText('20');