Delete an entry in the NG-repeat transporter

So, I am doing an e2e test with protractor and angular,
My first test was adding an item to the list,
Now I am trying to remove it, and I am having problems with this.

So here is what I need to do:

  • Find the name of the record I want to delete
  • click on the trash can icon of the same line and delete it
  • click ok in the popup that appears
  • Try to avoid using By.css as much as possible and prefer everything related to angular (byBinding, model, etc.). This is due to the fact that this part of the application changes over time, so I will have to redo all these cases.

HTML:

...

<div class="list-group-item ng-scope" ng-repeat="item in teamList">
    <span class="glyphicon glyphicon-user"></span>
    <span ng-bind="item.name" class="memberName ng-binding">nuevo Team</span>
    <a ng-click="editTeam(item._id)" class="hand-cursor">
        <span class="glyphicon glyphicon-edit memberRemoveBotton"></span>
    </a>
    <a ng-confirm-click="Would you like to delete this item?" confirmed-click="deleteTeam(item._id)" class="hand-cursor">
        <span class="glyphicon glyphicon-trash memberRemoveBotton"></span>
    </a>
</div>  

JS:

describe('Testing delete Item',function() {
        it('Should delete the Item that just got Inserted',function() {
            element(by.css('a[href="#!/item-create"]')).click(); //Opens up the Item dashBoard
            element.all(by.repeater('item in itemList')).then(function(table) {
                table.element(by.binding('item.name')).each(function(names) {
                    console.log('the names',names.getText());//I'm trying to find the name of the item that just got inserted
                    // is there like a nested chaining of elements in here ??
                });         
            });
        });
});

Any tips on how to solve this are appreciated.

+4
2

Andres, , .

, , popUp window,

it('Should delete the Team that just got Inserted',function() {
    element(by.css('a[href="#!/team-create"]')).click(); //Opens up the Team dashBoard
    element.all(by.repeater('item in teamList')).filter(function(row) {
        return row.element(by.css('.memberName')).getText().then(function(name) {
            return name === teamName;
        });
    }).first().element(by.css('.glyphicon-trash')).click();
    testHelper.popUpHandler(ptor);
    element.all(by.css('.list-group-item .memberName')).each(function(list) {
        expect(list.getText()).not.toContain(teamName);
    });
});
+1
describe('Testing delete Item',function() {
  it('Should delete the Item that just got Inserted',function() {
    // Assume you know the name of the item you want to delete.
    var nameToDelete = 'some name';

    // Get the row that has the name by using filter.
    element.all(by.repeater('item in itemList')).filter(function(row){
      return row.element(by.css('.memberName')).getText().then(function(name){
        return name === nameToDelete; 
      });
    })
    // Now you should have one row.
    .get(0)
    // Get the row and click find the remove button.
    .element(by.css('.memberRemoveBotton'))
    .click();

    // Make sure it was deleted.
    var names = $$('.list-group-item .memberName').getText();
    expect(names).not.toContain(nameToDelete);
  });
});

, .

+4

All Articles