在条件求值为true时获取元素（扩展ElementArrayFinder）

问题描述

我们有一个菜单，表示为 ul-> li 列表（简化）：

We have a menu represented as a ul->li list (simplified):

<ul class="dropdown-menu" role="menu">
    <li ng-repeat="filterItem in filterCtrl.filterPanelCfg track by filterItem.name"
        ng-class="{'divider': filterItem.isDivider}" class="ng-scope">
        <a href="" class="ng-binding"> Menu Item 1</a>
    </li>
    ...
    <li ng-repeat="filterItem in filterCtrl.filterPanelCfg track by filterItem.name"
        ng-class="{'divider': filterItem.isDivider}" class="ng-scope">
        <a href="" class="ng-binding"> Menu Item 2</a>
    </li>
</ul>

在位置N的某处，有一个分隔线，可通过评估 filterItem.isDivider 或通过检查 a 链接的文本（如果是分隔符，则为空）。

Where somewhere at position N, there is a divider, which can be identified by evaluating filterItem.isDivider or by checking the text of the a link (in case of a divider, it's empty).

现在，目标是获取位于分隔符之前的所有菜单项。你会如何处理这个问题？

Now, the goal is to get all of the menu items that are located before the divider. How would you approach the problem?

我目前的方法相当通用 - 扩展 ElementArrayFinder 并添加 takewhile（）函数（受Python的）。以下是我实现它的方法（基于）：

My current approach is rather generic - to extend ElementArrayFinder and add takewhile() function (inspired by Python's itertools.takewhile()). Here is how I've implemented it (based on filter()):

protractor.ElementArrayFinder.prototype.takewhile = function(whileFn) {
    var self = this;
    var getWebElements = function() {
        return self.getWebElements().then(function(parentWebElements) {
            var list = [];
            parentWebElements.forEach(function(parentWebElement, index) {
                var elementFinder =
                    protractor.ElementFinder.fromWebElement_(self.ptor_, parentWebElement, self.locator_);

                list.push(whileFn(elementFinder, index));
            });
            return protractor.promise.all(list).then(function(resolvedList) {
                var filteredElementList = [];
                for (var index = 0; index < resolvedList.length; index++) {
                    if (!resolvedList[index]) {
                        break;
                    }
                    filteredElementList.push(parentWebElements[index])
                }
                return filteredElementList;
            });
        });
    };
    return new protractor.ElementArrayFinder(this.ptor_, getWebElements, this.locator_);
};

以下是我使用它的方式：

And, here is how I'm using it:

this.getInclusionFilters = function () {
    return element.all(by.css("ul.dropdown-menu li")).takewhile(function (inclusionFilter) {
        return inclusionFilter.evaluate("!filterItem.isDivider");
    });
};

但是，测试只是挂起，直到 jasmine.DEFAULT_TIMEOUT_INTERVAL takewhile（）调用达到$ c>。

But, the test is just hanging until jasmine.DEFAULT_TIMEOUT_INTERVAL is reached on the takewhile() call.

如果我将 console.log s放入循环中，之后，我可以看到它正确推送元素在分隔线之前，当它到达它时停止。我可能在这里遗漏了一些东西。

If I put console.logs into the loop and after, I can see that it correctly pushes the elements before the divider and stops when it reaches it. I might be missing something here.

使用量角器2.2.0。

Using protractor 2.2.0.

另外，如果我的问题过于复杂，请告诉我。

Also, let me know if I'm overcomplicating the problem.

推荐答案

也许我错过了什么，但是难道你不能通过 ul li a 元素，而他们从getText（）给你一些东西，并将它们存储到某个数组，或者直接在那个循环中做些什么？

Maybe I'm missing something, but couldn't you just go through ul li a elements while they gave you something from getText(), and store them to some array, or do something with them directly in that loop?

var i = 0;
var el = element.all(by.css('ul li a'));
var tableItems = [];
(function loop() {
    el.get(i).getText().then(function(text){
        if(text){
            tableItems.push(el.get(i));
            i+=1;
            loop();
        }
    });
}());

这篇关于在条件求值为true时获取元素（扩展ElementArrayFinder）的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！