keithwf
keithwf

Reputation: 21

protractor - how to enforce protractor to wait for REST call to return information to complete building page elements

New to testing with protractor, actually new to test automation in general so hopefully this is posted in the right place. Apologies if not, please advise.

I am trying to test elements on a pages which are only displayed after a response to REST call. The page in question has two TABS, I click on the non-active TAB, it goes active, loads the TAB framework, then a few seconds (depending on the information returned) later a Graphical timeline is built in the TAB based upon the information from the REST call. My problem is how to make protractor wait for the REST call to be completed and the Timeline built before continuing to test the elements in the Timeline.

From various searches I am using the following code. I am just picking a single element on the Timeline to check for isPresent. I have also tried using browser.wait as opposed to ptor.getInstance however have the same problem that the wait is not waiting for the timeline to load fully. Any guidance would be much appreciated.

    it('XXXXXX', function() {
        var ptor = protractor.getInstance();

        // Define element to wait for in the Timeline Graphic
        var waitForElement = by.css('.timeline-time');  

        // Load the page    
        jobManagerPage.go();    

        // Click the inactive TAB to make active
        jobManagerPage.eleDataVisTabLiTag.click();

        // This is where I am expecting to wait for the element in the Timeline
        // to be present before continuing
        browser.wait(function() { return ptor.isElementPresent(waitForElement);
            }, 8000);       

        // Test for the Timeline element to be present - this keeps failing !!!!!
        expect(ptor.isElementPresent(waitForElement)).toBeTruthy();
    }); 

Upvotes: 2

Views: 544

Answers (1)

Jon Onstott
Jon Onstott

Reputation: 13727

One solution (though far from ideal) is to add an element to the DOM when you're loading, and remove it when done (or add/remove a CSS class, etc...). You may or may not have the opportunity to do that, depending on how your AJAX calls are being made.

I found this approach in an answer to this SO question: AngularJS + Protractor wait for all ajax calls to end / full page load, before running the tests

Upvotes: 0

Related Questions