/*
 * Copyright (C) 2018 Robert Bosch GmbH Copyright (C) 2018 Robert Bosch Manufacturing Solutions GmbH, Germany. All rights reserved.
 */

import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing';
import { MatChipsModule} from '@angular/material/chips';
import { MatIconModule } from '@angular/material/icon';
import { MatTooltip, MatTooltipModule } from '@angular/material/tooltip';
import { By } from "@angular/platform-browser";
import { Component, Input } from "@angular/core";

import { BCI_SHARED_INTL_PROVIDER } from '../shared-intl';
import { BciChipComponent } from './chip.component';

@Component({
  selector: 'bci-chip-wrapper',
  template: `<bci-chip [removable]="removable"><span id="content">Apple</span></bci-chip>`,
})
class BciChipWrapperComponent {
  @Input() removable = true;
}

describe('BciChipComponent ', () => {
  let component: BciChipComponent;
  let componentElement: HTMLElement;
  let wrapperComponent: BciChipWrapperComponent;
  let fixture: ComponentFixture<BciChipWrapperComponent>;

  beforeEach(
    waitForAsync(() => {
      TestBed.configureTestingModule({
        imports: [MatChipsModule, MatIconModule, MatTooltipModule],
        declarations: [BciChipComponent, BciChipWrapperComponent],
        providers: [BCI_SHARED_INTL_PROVIDER],
      }).compileComponents();
    })
  );

  beforeEach(() => {
    fixture = TestBed.createComponent(BciChipWrapperComponent);
    wrapperComponent = fixture.componentInstance;
    const componentDebugElement = fixture.debugElement.query(By.css('bci-chip'));
    componentElement = componentDebugElement.nativeElement;
    component = componentDebugElement.componentInstance;
    fixture.detectChanges();
  });

  it('should be created', () => {
    expect(component).toBeTruthy();
  });

  it(
    'should emit removal',
    waitForAsync(() => {
      let removed = false;
      wrapperComponent.removable = true;
      component.removed.subscribe(() => (removed = true));
      fixture.detectChanges();

      expect(removed).toBe(false);
      fixture.nativeElement.querySelector('.mat-mdc-chip-remove').click();
      expect(removed).toBe(true);
    })
  );

  it(
    'should not show remove-button if not removable',
    waitForAsync(() => {
      wrapperComponent.removable = false;
      fixture.detectChanges();

      expect(fixture.nativeElement.querySelector('.mat-mdc-chip-remove')).toBeNull();
    })
  );

  it(
    'should enable tooltip directive on mouseenter',
    waitForAsync(() => {
      const matChipRowElement = fixture.debugElement.query(By.css('mat-chip-row'));
      const tooltipDirective = matChipRowElement.injector.get(MatTooltip);
      expect(tooltipDirective.disabled).toBe(true);
      expect(tooltipDirective.message).toBe('');

      const contentElement = (<HTMLElement>fixture.debugElement.query(By.css('#content')).nativeElement).parentElement;
      jest.spyOn(contentElement, 'clientWidth', 'get').mockReturnValue(5);
      jest.spyOn(contentElement, 'scrollWidth', 'get').mockReturnValue(10);
      componentElement.dispatchEvent(new Event('mouseenter'));
      fixture.detectChanges();

      expect(tooltipDirective.disabled).toBe(false);
      expect(tooltipDirective.message).toBe('Apple');
    })
  );
});
