Question

我正在尝试在下拉列表中选择第三个选项。以下是关于元素的一些细节：

外部HTML：

<md-option _ngcontent-c6="" role="option" ng-reflect-value="last90Days" tabindex="0" id="md-option-2" aria-selected="false" aria-disabled="false" class="mat-option"><!--bindings={
  "ng-reflect-ng-if": "false"
}--> Last 90 Days <!--bindings={
  "ng-reflect-ng-if": "true"
}--><div class="mat-option-ripple mat-ripple" md-ripple="" ng-reflect-trigger="[object HTMLElement]"> </div> </md-option>

CSS选择器：

#md-option-37 > div:nth-child(1)

抱歉可怕的格式化。如果有人对如何选择“过去90天”下拉项目有任何建议，那么我将非常感激。

Answer 1

根据我从您的信息中了解到的AngularJS md-select您需要执行以下操作

// Open the md-select, use the correct selector, this is a demo
$('md-select').click();

// There is an animation, I don't know how long, you need to wait for the animation to be finished. 
// Quick and dirty is a browser.sleep(), but it's better to find a more stable way because if the animation will take longer in the future your test will break
browser.sleep(500);

// Click on you option, this can be done in several ways

// By index
$$('md-option').get(1).click();
// By text
element(by.cssContainingText('md-option', 'your text')).click();

// Wait for the menu to close, this is also an animation
browser.sleep(500);

对于element(by.css('selector'));我总是使用shorthand notation，其他选择器请参阅docs of Protractor。

我建议使用更好的方法来等待动画完成。在这里，我使用了browser.sleep()，但这不是未来的证明。你不希望你的脚本依赖睡眠。

希望它有所帮助。

无法为Protractor UI Nav测试定位Angular元素

1 个答案: