使用Angular-UI Select2元素进行Angularjs E2E测试

我有一个部分使用Angular UI http://angular-ui.github.io/的select2元素

我遇到的问题是该元素是必需的,虽然我已成功通过以下代码设置字段,但由于外部更改而不确定Angular的模型不能更新,因此不会删除所需的属性,我不知道如何要么提供$scope.apply(),要么使用Angular的另一个函数来继续测试.

首先允许运行直接jQuery函数:(取自How to execute jQuery from Angular e2e test scope?)

angular.scenario.dsl('jQueryFunction',function() {
return function(selector,functionName /*,args */) {
    var args = Array.prototype.slice.call(arguments,2);
    return this.addFutureAction(functionName,function($window,$document,done) {
        var $= $window.$; // jQuery inside the iframe
        var elem = $(selector);
        if (!elem.length) {
            return done('Selector ' + selector + ' did not match any elements.');
        }
        done(null,elem[functionName].apply(elem,args));
    });
};
});

然后更改字段值:

jQueryFunction('#s2id_autogen1','select2','open');
    jQueryFunction('#s2id_autogen1',"val","US");
    jQueryFunction('#s2id_autogen1','data',{id: "US",text: "United States"});
    jQueryFunction('.select2-results li:eq(3)','click');
    jQueryFunction('#s2id_autogen1','trigger','change');
    jQueryFunction('#s2id_autogen1','close');
    input('request._countrySelection').enter('US');

请注意,并不是所有这些函数都需要反映ui的变化,而只是我用来尝试使用的所有功能……

为了让这个工作起作用,我咨询了Brian的答案和sinelaw,但在我的案例中仍然失败了两个原因:

>点击’div#s2id_autogen1’不会为我打开select2输入,我使用的选择器是’div#s2id_autogen1 a’
>获取select2元素我会得到ElementNotVisibleError,可能是因为我的select2在一个bootstrap模式中,所以我明确地等待元素在点击它之前可见(你可以阅读我读过的原始提示使用这个here).

结果代码是:

function select2ClickFirstItem(select2Id) {
        var select2Input;

        // Wait for select2 element to be visible
        browser.driver.wait(function() {
            select2Input =  element(by.css('#s2id_' + select2Id + ' a'));
            return select2Input;
        }).then(function() {
            select2Input.click();

            var items = element.all(by.css('.select2-results-dept-0'));
            browser.driver.wait(function () {
                return items.count().then(function (count) {
                    return 0 < count;
                });
            });
            items.get(0).click();
        });
    }

希望能帮助到你.

相关文章

ANGULAR.JS:NG-SELECTANDNG-OPTIONSPS:其实看英文文档比看中...
AngularJS中使用Chart.js制折线图与饼图实例  Chart.js 是...
IE浏览器兼容性后续前言 继续尝试解决IE浏览器兼容性问题,...
Angular实现下拉菜单多选写这篇文章时,引用文章地址如下:h...
在AngularJS应用中集成科大讯飞语音输入功能前言 根据项目...
Angular数据更新不及时问题探讨前言 在修复控制角标正确变...