import { ComponentFixture, TestBed } from '@angular/core/testing';
import { ArrivalRequestComponent } from '@app/features/popular-requests/components/arrival-request/arrival-request.component';
import { DepartureRequestComponent } from '@app/features/popular-requests/components/departure-request/departure-request.component';
import { FlightNumberRequestComponent } from '@app/features/popular-requests/components/flight-number-request/flight-number-request.component';
import { RequestInfoComponent } from '@app/features/popular-requests/components/request-info/request-info.component';
import { RouteRequestComponent } from '@app/features/popular-requests/components/route-request/route-request.component';
import { IPopularRequest } from '@typings/popular-request';
import { getMockPipe } from '@shared/pipes/pipe.mock';
import { RequestMode } from '@typings/enums';

import { PopularRequestComponent } from './popular-request.component';

describe('PopularRequestComponent', () => {
    let component: PopularRequestComponent;
    let fixture: ComponentFixture<PopularRequestComponent>;

    const emitMock = jasmine.createSpy('emit');

    beforeEach(async () => {
        await TestBed.configureTestingModule({
            declarations: [
                PopularRequestComponent,
                ArrivalRequestComponent,
                DepartureRequestComponent,
                FlightNumberRequestComponent,
                RouteRequestComponent,
                RequestInfoComponent,
                getMockPipe('translate'),
                getMockPipe('cityName'),
            ],
        }).compileComponents();
    });

    beforeEach(() => {
        fixture = TestBed.createComponent(PopularRequestComponent);
        component = fixture.componentInstance;

        emitMock.calls.reset();
        (component.onClick as any) = {
            emit: emitMock,
        };
    });

    function getComponents() {
        return {
            arrival: document.querySelector('arrival-request'),
            departure: document.querySelector('departure-request'),
            flightNumber: document.querySelector('flight-number-request'),
            route: document.querySelector('route-request'),
        };
    }

    function clickOnRequestInfo(component) {
        const requestInfo = component.querySelector('request-info');
        (requestInfo as any).click();
    }

    it('should render arrival-request and add click listener to it', () => {
        const request: IPopularRequest = {
            mode: RequestMode.ARRIVAL,
            arrival: 'MOW',
            type: 'Onlineboard',
        };
        component.request = request;
        fixture.detectChanges();

        const components = getComponents();

        expect(components.arrival).not.toBe(null);
        expect(components.departure).toBe(null);
        expect(components.flightNumber).toBe(null);
        expect(components.route).toBe(null);

        expect(emitMock).not.toHaveBeenCalled();
        clickOnRequestInfo(components.arrival);
        expect(emitMock).toHaveBeenCalledWith(request);
    });

    it('should render departure-request and add click listener to it', () => {
        const request: IPopularRequest = {
            mode: RequestMode.DEPARTURE,
            departure: 'MOW',
            type: 'Onlineboard',
        };
        component.request = request;
        fixture.detectChanges();

        const components = getComponents();

        expect(components.arrival).toBe(null);
        expect(components.departure).not.toBe(null);
        expect(components.flightNumber).toBe(null);
        expect(components.route).toBe(null);

        expect(emitMock).not.toHaveBeenCalled();
        clickOnRequestInfo(components.departure);
        expect(emitMock).toHaveBeenCalledWith(request);
    });

    it('should render flight-number-request and add click listener to it', () => {
        const request: IPopularRequest = {
            mode: RequestMode.FLIGHT_NUMBER,
            flightNumber: '0001',
            carrier: 'SU',
            type: 'Onlineboard',
        };
        component.request = request;
        fixture.detectChanges();

        const components = getComponents();

        expect(components.arrival).toBe(null);
        expect(components.departure).toBe(null);
        expect(components.flightNumber).not.toBe(null);
        expect(components.route).toBe(null);

        expect(emitMock).not.toHaveBeenCalled();
        clickOnRequestInfo(components.flightNumber);
        expect(emitMock).toHaveBeenCalledWith(request);
    });

    it('should render route-request and add click listener to it', () => {
        const request: IPopularRequest = {
            mode: RequestMode.ROUTE,
            departure: 'MOW',
            arrival: 'MRS',
            type: 'Onlineboard',
        };
        component.request = request;
        fixture.detectChanges();

        const components = getComponents();

        expect(components.arrival).toBe(null);
        expect(components.departure).toBe(null);
        expect(components.flightNumber).toBe(null);
        expect(components.route).not.toBe(null);

        expect(emitMock).not.toHaveBeenCalled();
        clickOnRequestInfo(components.route);
        expect(emitMock).toHaveBeenCalledWith(request);
    });
});
