import { ComponentFixture, async } from '@angular/core/testing';
import { TestUtils }               from '../../test-utils';
import { ClickerButton }           from './clickerButton';
import { ClickerMock }             from '../../models/clicker.mock';

let fixture: ComponentFixture<ClickerButton> = null;
let instance: any = null;

describe('ClickerButton', () => {

  beforeEach(async(() => TestUtils.beforeEachCompiler([ClickerButton]).then(compiled => {
    fixture = compiled.fixture;
    instance = compiled.instance;
    instance.clicker = new ClickerMock();
    fixture.detectChanges();
  })));

  afterEach(() => {
    fixture.destroy();
  });

  it('initialises', () => {
    expect(instance).not.toBeNull();
  });

  it('displays the clicker name and count', () => {
    fixture.detectChanges();
    expect(fixture.nativeElement.querySelectorAll('.button-inner')[0].innerHTML).toEqual('TEST CLICKER (10)');
  });

  it('does a click', async(() => {
    spyOn(instance['clickerService'], 'doClick');
    let button: any = fixture.debugElement.nativeElement.querySelector('button');
    button.click();

    fixture.whenStable().then(() => {
      expect(instance['clickerService'].doClick).toHaveBeenCalled();
    });
  }));
});

import { ComponentFixture, async } from '@angular/core/testing';
import { TestUtils }               from '../../test-utils';
import { ClickerButton }           from './clickerButton';
import { ClickerMock }             from '../../models/clicker.mock';

let fixture: ComponentFixture<ClickerButton> = null;
let instance: any = null;

describe('ClickerButton', () => {

  beforeEach(async(() => TestUtils.beforeEachCompiler([ClickerButton]).then(compiled => {
    fixture = compiled.fixture;
    instance = compiled.instance;
    instance.clicker = new ClickerMock();
    fixture.detectChanges();
  })));

  afterEach(() => {
    fixture.destroy();
  });

  it('initialises', () => {
    expect(instance).not.toBeNull();
  });

  it('displays the clicker name and count', () => {
    fixture.detectChanges();
    expect(fixture.nativeElement.querySelectorAll('.button-inner')[0].innerHTML).toEqual('TEST CLICKER (10)');
  });

  it('does a click', () => {
    fixture.detectChanges();
    spyOn(instance['clickerService'], 'doClick');
    TestUtils.eventFire(fixture.nativeElement.querySelectorAll('button')[0], 'click');
    expect(instance['clickerService'].doClick).toHaveBeenCalled();
  });
});

--- 
+++ 
@@ -28,10 +28,13 @@
     expect(fixture.nativeElement.querySelectorAll('.button-inner')[0].innerHTML).toEqual('TEST CLICKER (10)');
   });
 
-  it('does a click', () => {
-    fixture.detectChanges();
+  it('does a click', async(() => {
     spyOn(instance['clickerService'], 'doClick');
-    TestUtils.eventFire(fixture.nativeElement.querySelectorAll('button')[0], 'click');
-    expect(instance['clickerService'].doClick).toHaveBeenCalled();
-  });
+    let button: any = fixture.debugElement.nativeElement.querySelector('button');
+    button.click();
+
+    fixture.whenStable().then(() => {
+      expect(instance['clickerService'].doClick).toHaveBeenCalled();
+    });
+  }));
 });
Revert "reverting to old style, using async didn't achieve anything"

This reverts commit 094bc82f0ba5cdbc590372190bf6ddd1746fa9f6.
