CODEWITHSUNDEEP
angularjsjasmineprotractor
Abhyuday
Abhyuday

Reputation: 37

Protractor: by repeater element all returning size 0

I am fairly new to protractor, tried learning automating angular homepage (https://angularjs.org/). I am facing trouble in the JavaScript Projects section.

Steps that worked:

it ('should click on the plus sign', function() {
        $('.icon-plus-sign').click();
            expect(element(by.model('editProject.project.name')).isPresent()).toBe(true);
});

it ('should fill up the form', function() {
            element(by.model('editProject.project.name')).sendKeys('Test Name');
            element(by.model('editProject.project.site')).sendKeys('https://www.testsite.com');
            element(by.model('editProject.project.description')).sendKeys('Test Description');
            expect(element(by.buttonText('Save')).getAttribute('disabled')).toBe(null);
});

Step that is failing:

it ('should click on save button', function() {
            element(by.buttonText('Save')).click();
            // $$('tr[class="ng-scope"]')
            element.all(by.repeater("project in projectList.projects | filter:projectList.search | orderBy:'name'")).then(function(trElements) {
                console.log(trElements.length);
                for (var i = trElements.length - 1; i >= 0; i--) {
                    console.log('outside if' + i);
                    if (trElements[i].all(by.tagName('td')).first().element(by.tagName('a')).getText() == 'Test Name') {
                        console.log('inside if' + i);
                        expect(trElements[i].all(by.tagName('td')).first().element(by.tagName('a')).getAttribute('ng-href')).toContain('www.testsite.com');
                        expect(trElements[i].all(by.tagName('td')).get(1).getText()).toBe('Test Description');
                        break;
                    }
                }
            });


            browser.sleep(5000);
});

The trElements.length is returning 0, but the elements are surely present in DOM and they get highlighted in Elements tab in Chrome DevTools.

Please help me with this.

Thanks in advance!

Upvotes: 1

Views: 279

Answers (2)

Sanja Paskova
Sanja Paskova

Reputation: 1110

After click on Save, maybe you should wait the list to be loaded. It is possible the test to be faster than loading of elements, and in that case we use Expecteded Conditions and wait the list to be visible (you have full documentation of API here https://www.protractortest.org/#/api?view=ProtractorExpectedConditions): 

var EC = protractor.ExpectedConditions;
element(by.buttonText('Save')).click().then(function() {
        // $$('tr[class="ng-scope"]')
   browser.wait(EC.visibilityOf(element(by.repeater("project in projectList.projects | filter:projectList.search | orderBy:'name'"))), 30000, "Project list is not displayed");
        element.all(by.repeater("project in projectList.projects | filter:projectList.search | orderBy:'name'")).then(function(trElements) {
            console.log(trElements.length);
            for (var i = trElements.length - 1; i >= 0; i--) {
                console.log('outside if' + i);
                if (trElements[i].all(by.tagName('td')).first().element(by.tagName('a')).getText() == 'Test Name') {
                    console.log('inside if' + i);
                    expect(trElements[i].all(by.tagName('td')).first().element(by.tagName('a')).getAttribute('ng-href')).toContain('www.testsite.com');
                    expect(trElements[i].all(by.tagName('td')).get(1).getText()).toBe('Test Description');
                    break;
                }
            }
        });
});

Upvotes: 1

Andy Lamb
Andy Lamb

Reputation: 2304

The action initiated by clicking 'save' isn't complete before querying for 'trElements'. Wait on the promise returned when clicking the 'save' button before continuing. I.E. element(By.buttonText("Save")).click() .then(() => { element.all(By.repeater(... });

Upvotes: 0

Related Questions