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; 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(); }); });