Timeout error while testing an angular2 app with firebase

[danturu]

Protractor fails with the "Timed out waiting for Protractor to synchronize..." error if any firebase instance has been created inside the main component. In example below I don't subscribe to any firebase event, I just create a new firebase ref and it fails.

@Component({
  selector: 'app'
})

export class App {
  firebaseRef: Firebase;

  constructor() {
    let firebaseRef = new Firebase('...'); 
  }
}

I've tested it with angularjs and it passes.

[juliemr]

Hm, I wonder if firebase is using a recurring $timeout or $http for polling? @rosendi are you using the firebase angular adapter (AngularFire)? Could you share the versions you're using?

[danturu]

Nope, I don't use any adapter such as angularfire since it's useless in the angular2 apps. This simple example (https://github.com/rosendi/protractor-2750) reproduces the issue.

If we comment this line (https://github.com/rosendi/protractor-2750/blob/master/src/todo.ts#L19) then the tests will pass, otherwise it fails with the "Timed out....".

[juliemr]

Probably has to do with how we calculate stability for angular2 apps by using zones. cc @hankduan - this is probably a case we should have some solution for.

Thanks for providing an example!! We'll take a look.

[heathkit]

The example app is outdated, but I recreated a similar case starting from the current Angular 5 minute quickstart. We can no longer reproduce this issue, it was likely solved in the past 15 months or so.

[heathkit]

I take that back, I can reproduce after all. The problem also goes away if you set browser.ignoreSynchronization=true in the test, which I think points pretty clearly as an issue with the Firebase client and the way we wait on stability for Angular 2 apps.

[heathkit]

So I've taken the Angular quickstart repo and added a Firebase client to it. As per the given example, all I do is create a new client in the constructor.

export class AppComponent {
  constructor() {
    this.client = new Firebase('https://publicdata-weather.firebaseio.com');
  }
}

As reported, this makes the protractor tests time out. I can make the tests pass like so:

  it('should display: ' + expectedMsg, function (done) {
    browser.ignoreSynchronization = true;
    expect(element(by.css('h1')).getText()).toEqual(expectedMsg);
    done();
  });

without both calling done() and setting ignoreSynchronization, the test will time out. Tests seem to be hanging after the test function returns, and not in the expect() call.

[heathkit]

That old client I used is deprecated and AngularFire2 is out now and should be used instead. I can't reproduce the problem with the latest Firebase client, so I'm going to close this issue.

[huan]

Hello, I ran into this issue with the latest Angular 6 with @angular/fire@5.0.2.

Reproduce

1. Travis CI: https://travis-ci.com/BUPT/cad-screen/jobs/151635569
2. Use the source code from v0.0.11 at https://github.com/BUPT/cad-screen/tree/993047bc960fa07ed983351465a879feade82278