CODEWITHSUNDEEP
angularjsprotractorangularjs-e2e
Subtubes
Subtubes

Reputation: 16913

Protractor find element inside a repeater

Below is my markup

<tr ng-repeat="post in posts">
  <td ng-click="activePost(post)" class="title">{{post.title}}</td>
  <td><button class="btn btn-danger" ng-click="delete(post)">Delete</button>
  </td>
</tr>

I'm trying to get the element with the title class.

The code I use to access the repeater is:

postsList = element.all(by.repeater('post in posts'));

Is there a way to get the element by doing something like the following in jQuery:

var titleText = $("tr:first").find(".title").text();

Is there a way of doing something similar to this with protractor?

Upvotes: 22

Views: 40761

Answers (6)

Sergey Pleshakov
Sergey Pleshakov

Reputation: 8978

More readable way doing the same these days would be

it('test case', async () => {
  let repeaters = element.all(by.repeater('post in posts'));
  let titleElement = repeaters.get(0).element(by.className('title'));
  expect(await titleElement.getText()).toEqual('YourEnteredTitle');
});

Upvotes: 0

pansay
pansay

Reputation: 687

From the docs: https://github.com/angular/protractor/blob/master/docs/locators.md

var clickable = element.all(by.repeater('post in posts')).first().all(by.tagName('td')).first();

Upvotes: 4

nilsK
nilsK

Reputation: 4351

this should work for your example:

element.all(by.repeater('post in posts')).then(function(posts) {
   var titleElement = posts[0].element(by.className('title'));
   expect(titleElement.getText()).toEqual('YourEnteredTitle');
});

Upvotes: 31

Silvio Troia
Silvio Troia

Reputation: 1459

you have to find a element inside a array as explained here https://github.com/angular/protractor/issues/877

var items = element.all(by.repeater('userGroup in userGroups')).filter(function(item) {
     return item.element(by.binding('userGroup.name')).getText().then(function(label) {
           return label === 'MyGroupName';
     });
  });
items.get(0).element(by.css('.buttongochose')).click();

Upvotes: 6

Marcin Wolniewicz
Marcin Wolniewicz

Reputation: 213

An even better solution:

expect( $$(by.repeater('post in posts')).get(0).$('.title').getText() ).toBe('Your title');

Upvotes: 2

ndequeker
ndequeker

Reputation: 8010

The answer from nilsK helped me, but didn't work completely. The code below did the trick:

element.all(by.repeater('post in posts')).then(function(posts) {
   var titleElement = posts[0].element(by.className('title'));
   expect(titleElement.getText()).toEqual('YourEnteredTitle');
});

Upvotes: 21

Related Questions