Angular2/ionic2 testing: expected spy push to have been called

I am currently testing an ionic application. The problem is that the test fails, the error log is: "Expected spy push to have been called.". I really do not know why it does not work since I can get the element and I can click it. The console log does display that the size is. This means that it does contain that one button.

HTML :

<ion-header>
  <ion-navbar>
    <ion-title>Login</ion-title>
  </ion-navbar>
</ion-header>


<ion-content class="master">
    <div class="loginWindow">
      <ion-item>
        <ion-label fixed>Sign in</ion-label>
      </ion-item>
      <ion-item>
        <ion-label fixed>Email</ion-label>
        <ion-input type="email" name="email"></ion-input>
      </ion-item>

      <ion-item>
        <ion-label fixed>Password</ion-label>
        <ion-input type="password" name="password"></ion-input>
      </ion-item>
      <ion-item>
        <div padding>
          <button ion-button (click)="doLogin()" id="loginButton" class="loginButtons" color="avioBlue" block>Sign in</button> <-- this is the button 
        </div>
      </ion-item>
    </div>
</ion-content>

And as for the test file:

it('should be able to navigate to home page', () => {

    let navCtrl = fixture.debugElement.injector.get(NavController);
    spyOn(navCtrl, 'push');

    const buttons = fixture.debugElement.queryAll(By.css("button"));
    console.log(buttons);
    de = buttons[0];
    de.triggerEventHandler('click', null);

    expect(navCtrl.push).toHaveBeenCalled();
  });