import {async, ComponentFixture, TestBed} from '@angular/core/testing';

import {ErrorMessageComponent} from './error-message.component';
import {Component, ViewChild} from '@angular/core';
import {Step} from '../step';

@Component({
  template: '<app-error-message [step]="step"></app-error-message>'
})
class TestHostComponent {
  public step: Step = new Step(42);
  @ViewChild(ErrorMessageComponent)
  public sutComponent: ErrorMessageComponent;
}

describe('ErrorMessageComponent', () => {
  let testHostComponent: TestHostComponent;
  let testHostFixture: ComponentFixture<TestHostComponent>;

  beforeEach(async(() => {
    TestBed.configureTestingModule({
      declarations: [
        ErrorMessageComponent,
        TestHostComponent
      ]
    })
      .compileComponents();
  }));

  beforeEach(() => {
    testHostFixture = TestBed.createComponent(TestHostComponent);
    testHostComponent = testHostFixture.componentInstance;
    testHostFixture.detectChanges();
  });

  it('should create', () => {
    expect(testHostComponent.sutComponent).toBeTruthy();
  });

  it('should display an error message', () => {
    // arrange
    testHostComponent.step.error = true;
    testHostComponent.step.message = 'This is an error message';

    // act
    testHostFixture.detectChanges();

    // assert
    expect(testHostComponent.sutComponent.step.error).toBeTruthy();
    expect(testHostComponent.sutComponent.step.message).toEqual('This is an error message');
  });
});