Categories
angular-material angularjs javascript protractor selenium

Virtual Repeater and Protractor

The Question:

What is the canonical/preferred way to locate the Virtual Repeaters in Protractor?

The Story:

In the Angular Material design there is a Virtual Repeater that helps to improve the rendering performance with the help of dynamic reuse of rows visible in the viewport area. Sample:

<div class="md-virtual-repeat-offsetter" style="transform: translateY(0px);">
<div md-virtual-repeat="item in ctrl.dynamicItems" md-on-demand="" class="repeated-item ng-binding ng-scope flex" flex="">0</div>
<div md-virtual-repeat="item in ctrl.dynamicItems" md-on-demand="" class="repeated-item ng-binding ng-scope flex" flex="">1</div>
<div md-virtual-repeat="item in ctrl.dynamicItems" md-on-demand="" class="repeated-item ng-binding ng-scope flex" flex="">2</div>
</div>

At the moment, I have to use by.css location technique:

$$('[md-virtual-repeat="item in ctrl.dynamicItems"]');

Bonus Question:

Is there a way to make by.repeater also work with md-virtual-repeat?