6

我有一个部分使用 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', 'select2', "val", "US");
    jQueryFunction('#s2id_autogen1', 'select2', 'data', {id: "US", text: "United States"});
    jQueryFunction('.select2-results li:eq(3)', 'click');
    jQueryFunction('#s2id_autogen1', 'trigger', 'change');
    jQueryFunction('#s2id_autogen1', 'select2', 'close');
    input('request._countrySelection').enter('US');

请注意，并非所有这些功能都需要反映对 ui 的更改，只是我用来尝试使其正常工作的所有功能......

4

5 回答 5

5

为了使它起作用，我咨询了布赖恩的答案和正弦法，但在我的情况下它仍然失败，原因有两个：

  1. 单击“div#s2id_autogen1”不会为我打开 select2 输入，我使用的选择器是“div#s2id_autogen1 a”
  2. 获取 select2 元素我会得到 ElementNotVisibleError，可能是因为我的 select2 在引导模式中，所以我明确地等待该元素在单击之前可见（您可以阅读我阅读的原始提示以在此处使用它）。

结果代码是：

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();
        });
    }

希望能帮助到你。

于 2014-05-14T13:32:39.403 回答
2

我无法让它在 Karma 测试运行程序中工作，但是在量角器测试套件中这变得非常容易。

为了在量角器测试套件中完成此操作，我使用以下内容选择页面上的第一个 select2 框并选择该框中的第一个选项：

var select2 = element(by.css('div#s2id_autogen1'));
select2.click();
var lis = element.all(by.css('li.select2-results-dept-0'));
lis.then(function(li) {
    li[0].click();
});

页面上的下一个 select2 的 id 为 s2id_autogen3

于 2014-01-31T16:11:29.553 回答
2

如果您使用量角器和对我有用的新业力，我将支持@Brian 所说的话：

function uiSelect(model, hasText) {
    var selector = element(by.model('query.cohort')),
        toggle = selector.element(by.css('.ui-select-toggle'));

    toggle.click();

    browser.driver.wait(function(){
        return selector.all(by.css('.ui-select-choices-row')).count().then(function(count){
            return count > 0;
        });
    }, 2000);

    var choice = selector.element(by.cssContainingText('.ui-select-choices-row',hasText));
    choice.click();
};

像这样使用它：

如果您要选择的项目的值为“Q3 2013”​​，您可以为其提供选择器的型号以及您要选择的项目的完全或部分文本匹配。

uiSelect('query.cohort','Q3 2013');

或者

uiSelect('query.cohort','Q3');

两者都可以

于 2015-08-24T21:41:33.453 回答
0

有时 select2 可能需要一些时间来加载，尤其是在处理 ajax 加载的数据时。因此，当使用量角器并扩展 Brian 的答案时，我发现这是一种可靠的方法：

function select2ClickFirstItem(select2Id) {
    var select2 = element(by.css('div#s2id_' + select2Id));
    select2.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();
}

这使用了 driver.wait作为结果可以接受一个承诺的事实。

于 2014-03-21T16:07:15.193 回答
0

我通过以下更改使其在 Karma 下工作。

将以下 DSL 添加到您的 e2e 测试文件的顶部：

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));
    });
  };
});

然后在您的场景使用中更改 select2 值

it('should narrow down organizations by likeness of name entered', function() {
  jQueryFunction('#s2id_physicianOrganization', 'select2', 'open');
  jQueryFunction('#s2id_physicianOrganization', 'select2', 'search', 'usa');
  expect(element('div.select2-result-label').count()).toBe(2);
});
于 2014-03-14T10:43:22.950 回答