UI Protractor Find & Click Select Box Based On Tex

2019-08-02 12:16发布

问题:

I am trying to find a way to search for the row that has the name X in it and then click on the checkbox in that row using UI Protractor.

I have been very unsuccessful so far.

If you see below, I want to search for testproxy and then click the checkbox associated with it.

<div id="general_section">
            <p> The following proxies are available to add to a cluster.</p>
            <div class="table-responsive">
                <table id="proxies_table" class="table table-striped table-bordered">
                    <thead>
                    <tr>
                        <th><input type="checkbox" ng-model="selectAll" ng-click="selectAllServers(selectAll)" class="ng-pristine ng-untouched ng-valid"></th>
                        <th res-key="settings.emailProxy.proxy">Proxy</th>
                    </tr>
                    </thead>
                    <tbody>
                    <!-- ngRepeat: server in model.selectedServers | orderBy:'hostname' --><tr ng-repeat="server in model.selectedServers | orderBy:'hostname'">
                        <td>
                            <input type="checkbox" ng-model="server.selected" class="ng-pristine ng-untouched ng-valid">
                        </td>
                        <td>
                            testproxy
                        </td>
                    </tr><!-- end ngRepeat: server in model.selectedServers | orderBy:'hostname' --><tr ng-repeat="server in model.selectedServers | orderBy:'hostname'">
                        <td>
                            <input type="checkbox" ng-model="server.selected" class="ng-pristine ng-valid ng-touched">
                        </td>
                        <td>
                            testproxy_1
                        </td>
                    </tr><!-- end ngRepeat: server in model.selectedServers | orderBy:'hostname' -->
                    </tbody>
                </table>
                <p class="lead ng-hide" ng-show="model.selectedServers.length === 0 &amp;&amp; isAdd">No available proxies.</p>
                <p class="lead ng-hide" ng-show="model.selectedServers.length === 0 &amp;&amp; !isAdd">There are no proxies to remove.</p>
            </div>
        </div>

回答1:

Try a filter function, I've added some comments to make it a readable:

//filter through each row using the ng-repeat as locator
$$('[ng-repeat="server in model.selectedServers | orderBy:\'hostname\'"]').filter(function(foo){
    //check for the text in the td with index 1, aka the second one
    return foo.$$('td').get(1).getText().then(function(bar){
        //return the row which has your value (textproxy)
        return bar === "testproxy";
    });
//Here you can use the elements in the row with your value
//So you'd want to click the checkbox
}).then(function(values){
    values[0].$('[type="checkbox"]').click();
});