Timing errors with Angular Protractor e2e testing

I had this nasty error in my Protractor tests:

Error while waiting for Protractor to sync with the page: {}

My tests were kicked off too early and didn’t seem to wait for the angular library to load.

I added the following solution to my specs, but was far from confident, because other timing issues arised:

// Don't do this!
browser.ignoreSynchronization = true;

With help of Angular-contributor Shyam Seshadri I found out that the issue had it’s origin in my protractor config file!

By default Protractor assumes that the ng-app declaration sits on the BODY-element. However, in my case it was defined on a DIV lower in the DOM. I had to assign the selector of that element to the rootElement property:

  // rootElement: 'body', // default, but does not work in my case
  rootElement: '.my-app', // or whatever selector the ng-app element has

Corresponding HTML:

<div ng-app="myApp" class="my-app">

Happy testing!

6 replies on “Timing errors with Angular Protractor e2e testing”

  1. Hi,

    Even i’m facing same issue “Error while waiting for Protractor to sync with the page: “root element (body) has no injector.” and i’ve looked at my code for ‘ng-app’ directive, which was correctly placed in . in that case i don’t need to use ‘rootElement’ in config file.

    I don’t know the reason why i’m getting same issue(spent much time to resolve it, i couldn’t ).

    FYI: My app implemented in such a way that (1)login and (2) reset of application as two different angular apps.

    Thanks a lot if anyone can help me to solve it..

    1. Hi suresh,

      rootElement defaults to body. If you don’t have your ng-app in the body, you will get that error. It can be set manually like this.

      You need to change the rootElement. You can do it directly from the interactive view by running:

      browser.rootEl = ‘div#ng-app-located-here’;

Comments are closed.