如何使用量角器测试角度多选下拉?

时间:2014-12-17 08:12:05

标签: javascript angularjs testing protractor multi-select

我正在使用来自https://github.com/isteven/angular-multi-select的角度多选下拉列表。现在我想在量角器中编写测试用例。

<div ng-show="!attribute.isMultivalued && page != 'view'" 
     class="select-group" 
     multi-select 
     input-model="typesDataDup"
     output-model="attribute.types"
     button-label="typeName"         
     item-label="typeName" 
     tick-property="ticked" 
     selection-mode="single"
     helper-elements="filter"
     is-disabled = "page == 'view'">
</div>

我无法使用模型发送数据,因为这里我们没有提到ng-model。

有人可以帮我编写测试用例吗?

2 个答案:

答案 0 :(得分:4)

您可以依赖其他属性并使用by.css来查找元素。例如:

element(by.css('div.select-group'))

element(by.css('div[multi-select]'))

据我所知angular-multi-select source code,选择选项用按钮元素表示。使用element.all()查找内部的所有按钮,然后点击所需的按钮,例如Select All

element.all(by.css('div[multi-select] button')).then(function(options) {
    options.forEach(function(option) {
        option.getText().then(function(text) {
            if (text.indexOf("Select All") != -1) {
                option.click();
            } 
        });
    });
});

答案 1 :(得分:1)

为了解决这个问题,我采取了css帮助。我在检查元素中检查了css然后我得到了这个解决方案

element.all(by.buttonText('None selected')).then(function(items) {
   items[1].click();
}); 
element.all(by.model('inputLabel.labelFilter')).then(function(items) {
   items[1].sendKeys(protractor.Key.DOWN+protractor.Key.DOWN);
});
ptor.sleep(200);
element.all(by.css('.multiSelectFocus')).then(function(items) {
   items[0].click();
});

我在这里使用DOWN键选择特定选项