import {ComponentFixture, fakeAsync, TestBed, tick, waitForAsync} from '@angular/core/testing';

import {LoadingComponent} from './loading.component';
import {ActiveRequests} from '../services/active-requests.service';
import {AngularMaterialModule} from '../modules/angular-material.module';

describe('LoadingComponent', () => {
  let component: LoadingComponent;
  let fixture: ComponentFixture<LoadingComponent>;
  let currentRequests: any = {};

  beforeEach(async () => {
    await TestBed.configureTestingModule({
      declarations: [ LoadingComponent ],
      imports: [AngularMaterialModule],
      providers: [
        {provide: ActiveRequests, useValue: {get hasBlockingRequests(): boolean { return currentRequests.count > 0; }}},
      ]
    })
    .compileComponents();
  });

  beforeEach(() => {
    currentRequests = {count: 0};
    fixture = TestBed.createComponent(LoadingComponent);
    component = fixture.componentInstance;
    fixture.detectChanges();
  });

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

  it('shows spinner when requests are pending', () => {
    currentRequests.count = 1;
    fixture.detectChanges();
    expect(document.getElementsByClassName('mask').length).toBe(1);
  });

  it('hides spinner when no requests are active', () => {
    currentRequests.count = 3;
    fixture.detectChanges();
    expect(document.getElementsByClassName('mask').length).toBe(1);
    currentRequests.count = 0;
    fixture.detectChanges();
    expect(document.getElementsByClassName('mask').length).toBe(0);
  });

  it('disables keyboard input when loading mask is displayed', () => {
    currentRequests.count = 3;
    fixture.detectChanges();
    const event = new KeyboardEvent('keyDown');
    const preventDefault = spyOn(event, 'preventDefault').and.callThrough();
    component.disableKeys(event);
    expect(preventDefault).toHaveBeenCalled();
  });
});