CODEWITHSUNDEEP
angularjsrepeaterprotractor
pioSko
pioSko

Reputation: 551

Protractor find element in repeater by binding?

I am trying to write a simple test that matches a binding in a repeater.

I have it working when I search by a CSS class, however I am "not allowed" to do that in our code. I can't use HTML tags as a locator, either. I can only find by attributes or direct binding.

I have tried many different ways including (but get errors or no result):

var productPageUrl = element.all(by.repeater('product in products').row(0).column('{{product.productPageUrl}}'));

Not sure if it makes a difference, but in the application the HTML template is included by ng-repeat.

This works (but cannot use):

products.then(function(prods) {
    prods[0].findElement(by.className('homepage-panel-link')).getAttribute('href').then(function(href){
        expect(href).toMatch('/products/1');
    });
});

The HTML template being repeated:

<div data-ng-repeat="product in products">
    <div data-property-name="productItem-{{$index}}">
        <a href="{{product.productPageUrl}}" class="homepage-panel-link" data-property-name="productPageUrl"></a>
    </div>
</div>

Is there anyway of simply testing the binding product.productPageUrl??? From the code above that works, it seems a hell of a long way to go around just to get that value.

Upvotes: 4

Views: 4334

Answers (2)

Thuan Luong
Thuan Luong

Reputation: 1

This is my problem too and I can not find any protractor feature to solve that so this is my suggest solution. :) This solution bases on protractor can get element by ng-bind and get value attribute of input. (I have no idea why getText() input not work :D)

element(by.binding('mainImageUrl')).getAttribute('value')
   .then(function(text){
      expect(text.toMatch(/img\/phones\/nexus-s.0.jpg/));
   });

..
  <a href="{{product.productPageUrl}}" 
   class="homepage-panel-link" data-property-name="productPageUrl"></a>
  <input type="hidden" ng-bind="product.productPageUrl"
   value= "{{product.productPageUrl}}" >
..

in javascript:

    element.all(by.repeater('product in products').row(0)
    .column('{{product.productPageUrl}}'))
    .getAttribute('value').then(function(value){
           //matching value
         });

Upvotes: 0

hankduan
hankduan

Reputation: 6034

It seems like you're just looking for the locator by.binding? http://angular.github.io/protractor/#/api?view=ProtractorBy.prototype.binding

i.e. 

var productPageUrl = element(by.binding('product.productPageUrl'));
expect(productPageUrl.getAttribute('href')).toMatch('/products/1');

or if you have many that match:

var productPageUrls = element.all(by.binding('product.productPageUrl'));
expect(productPageUrls.getAttribute('href').get(0)).toMatch('/products/1');
or
expect(productPageUrls.getAttribute('href')).toMatch(['/products/1', '/products/2', ...]);

Upvotes: 1

Related Questions