量角器 - 如何计算包含指定文本的元素

时间:2015-07-23 08:26:49

标签: angularjs protractor

我试图做一些我认为会很简单的事情,但现在已经让我难过了两天。我只想计算包含特定文本行的特定类的元素数量。

我的代码如下所示:

element.all(by.className('interaction-thumb-titlebar')).map(function(element) {
    return element.getText();
});
console.log("View names:", viewNames);

根据我的阅读,这应该产生如下内容:

View names: ['apple', 'orange', 'apple', 'banana']

我只是搜索这个数组来计算我需要计算的数量。

问题当然是,现在所有的东西都变成了承诺而不是实际的价值,这意味着我实际得到的是:

View names: { closure_uid_209027314: 2004,
  flow_: 
   { events_: {},
     closure_uid_209027314: 1,
     activeFrame_: 
      { events_: {},
        closure_uid_209027314: 1954,
        flow_: [Circular],
        parent_: [Object],
        children_: [Object],
        lastInsertedChild_: [Object],
        pendingTask_: null,
        isLocked_: false,
        isBlocked_: false,
        pendingCallback: false,
        pendingRejection: false,
        cancellationError_: null },
     schedulingFrame_: 
      { events_: {},
        closure_uid_209027314: 1954,
        flow_: [Circular],
        parent_: [Object],
        children_: [Object],
        lastInsertedChild_: [Object],
        pendingTask_: null,
        isLocked_: false,
        isBlocked_: false,
        pendingCallback: false,
        pendingRejection: false,
        cancellationError_: null },
     shutdownTask_: null,
     eventLoopTask_: null,
     hold_: 
      { _idleTimeout: 2147483647,
        _idlePrev: [Object],
        _idleNext: [Object],
        _idleStart: 1437638541678,
        _onTimeout: [Function: wrapper],
        _repeat: true },
     yieldCount_: 3 },
  stack_: null,
  parent_: 
   { closure_uid_209027314: 2002,
     flow_: 
      { events_: {},
        closure_uid_209027314: 1,
        activeFrame_: [Object],
        schedulingFrame_: [Object],
        shutdownTask_: null,
        eventLoopTask_: null,
        hold_: [Object],
        yieldCount_: 3 },
     stack_: null,
     parent_: 
      { closure_uid_209027314: 2000,
        flow_: [Object],
        stack_: null,
        parent_: [Object],
        callbacks_: [Object],
        state_: 'pending',
        handled_: true,
        pendingNotifications_: false,
        value_: undefined },
     callbacks_: [ [Object] ],
     state_: 'pending',
     handled_: true,
     pendingNotifications_: false,
     value_: undefined },
  callbacks_: null,
  state_: 'pending',
  handled_: false,
  pendingNotifications_: false,
  value_: undefined }

我甚至尝试将行return element.getText();更改为return 'turtle',并获得完全相同的输出。

任何人都可以帮助我吗?

安迪

2 个答案:

答案 0 :(得分:3)

有一个定位器by.cssContainingText,它可以更优雅的方式解决您的问题:它应用的第一个参数是CSS选择器,第二个参数是您希望元素拥有的文本。然后,您可以将其与方法count结合使用:

var els = element.all(by.cssContainingText('.interaction-thumb-titlebar', 'apple'));
expect(els.count()).toBe(2);

答案 1 :(得分:1)

正如@gillesc在问题评论中向我指出的那样,我遇到的问题是即使是map函数也会返回一个promise。承诺一路下来!值得庆幸的是,这个承诺将解决map函数中返回的promise,所以我需要的代码是这样的:

element.all(by.className('interaction-thumb-titlebar')).map(function(element) {
    return element.getText();
}).then(function(viewNames){
    console.log("View names:" viewNames);
});
console.log("View names:", viewNames);

现在要完成我需要的计数功能,完整的解决方案如下所示:

function countElements (css, text) {
    //if no text specified, return number of matching elements with css
    if(!text) {
        return element.all(by.css(css)).then(function(elements){
            return elements.length;
        });
    }
    //if text specified, return number of matching elements with css that have the specifed text
    return element.all(by.css(css)).map(function(element) {
        return element.getText();
    }).then(function(textArray) {
        var numElements = 0;
        for(var i in textArray) {
            if(textArray[i] == text) {
                numElements++;
            }
        }
        return numElements;
    });
}

我可以这样使用:

expect(countElements('.interaction-thumb-titlebar').toBe(4);
expect(countElements('.interaction-thumb-titlebar', 'apple').toBe(2);