Solved: Protractor Testing Issue


Trying to write some protractor tests for ionic, realized the selector element( by.css(’.selector’)); no longer scrolls to the element. Which when it’s not visible in the browser, automatically fails the test.

Took me awhile to figure it out. Using a ptor.sleep(2000) to delay the page after browser.get(‘domain’); and then If I scroll through the sections where the elements are being tested, they pass (as expected).

I believe this has something to do with ionic taking over scroll events.

Has anyone ran into this before or have some sort of scrollTo implementation for all elements?



Ended up using a global scroll method that takes the element as an argument.

var scrollIntoView = function (element) {

Then just call it/pass in your element.

describe( "Register page", function ()
    browser.get( "#/register" );


    it( "Check SMS Preference", function ()

        var smsLabelConfirm = element( by.css( ".sms-confirm" ) ),
            smsInputConfirm = element ( "sms-confirm" ) ),
            smsInputDeny = element ( "sms-deny" ) );

            browser.executeScript(scrollIntoView, smsLabelConfirm);

            expect( smsInputConfirm.getAttribute( "checked" ) ).toBe( "true" );
            expect( smsInputDeny.getAttribute( "checked" ) ).toBe( null );

    } );



If you pass an element to browser.executeScript() it may be too big. In that case you will get following error:

RangeError: Maximum call stack size exceeded

I recommend to do something like this, instead: