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

import {AppComponent} from './app.component';
import {AuFaInputComponent} from "./lib/au-fa-input/au-fa-input.component";
import {InputRefDirectiveDirective} from "./lib/common/input-ref-directive.directive";
import {DebugElement} from "@angular/core";
import {By} from "@angular/platform-browser";

describe('AppComponent', () => {
  let component: AppComponent;
  let fixture: ComponentFixture<AppComponent>;
  let el: DebugElement;
  let emailField: DebugElement;


  beforeEach(async(() => {
        TestBed.configureTestingModule({
            declarations: [
                AppComponent,
              AuFaInputComponent,
              InputRefDirectiveDirective
            ],
        }).compileComponents();
    }));

  beforeEach(() =>{
    fixture = TestBed.createComponent(AppComponent);
    component = fixture.debugElement.componentInstance;
    el = fixture.debugElement;
    emailField = el.query(By.css('#email-field'));

    fixture.detectChanges();
  });

    it('should create the app', async(() => {
        expect(component).toBeTruthy();
    }));

  it('should create a font awesome email input', async(() => {

    expect(emailField).toBeTruthy();
  }));

  it('should contain the appropriate icon', async(() => {


    expect(emailField.query(By.css('i.icon.fa.fa-envelope'))).toBeTruthy();
  }));

  it('should contain an input', async(() => {


    expect(emailField.query(By.css('input.test-class'))).toBeTruthy();
  }));







});