import 'reflect-metadata';

import { requiredMocks } from './../../../../test-mocks';
requiredMocks(jest);

import {
    ComponentFactory,
    ComponentFactoryResolver,
    ComponentRef,
    Type,
    ViewContainerRef,
} from '@angular/core';

import {
    DynamicComponentHostDirective,
} from './dynamic-component-host.directive';

const initDynamicComponentHostDirective = (
    componentFactoryResolver?: ComponentFactoryResolver,
    viewContainerRef?: ViewContainerRef,
) => {
    return new DynamicComponentHostDirective(
        componentFactoryResolver,
        viewContainerRef,
    );
};

describe('renderComponent', () => {
    const initViewContainerRef = () => {
        const viewContainerRef = {
            element: {
                nativeElement: {},
            },
        } as ViewContainerRef;
        viewContainerRef.clear = jest.fn();
        viewContainerRef.element.nativeElement.appendChild = jest.fn();
        viewContainerRef.createComponent = jest.fn()
            .mockReturnValue({
                location: {},
            } as ComponentRef<any>);
        return viewContainerRef;
    };
    const initComponentFactoryResolver = () => {
        const componentFactoryResolver = {} as ComponentFactoryResolver;
        componentFactoryResolver.resolveComponentFactory = jest.fn();
        return componentFactoryResolver;
    };

    test('Calls componentFactoryResolver.resolveComponentFactory', () => {
        const componentFactoryResolver = initComponentFactoryResolver();
        const dynamicComponentHostDirective = initDynamicComponentHostDirective(
            componentFactoryResolver,
            initViewContainerRef(),
        );
        const componentType = {} as Type<any>;

        dynamicComponentHostDirective.renderComponent(componentType);

        expect(componentFactoryResolver.resolveComponentFactory)
            .toHaveBeenCalledWith(componentType);
    });

    test('Calls viewContainerRef.clear', () => {
        const viewContainerRef = initViewContainerRef();
        const dynamicComponentHostDirective = initDynamicComponentHostDirective(
            initComponentFactoryResolver(),
            viewContainerRef,
        );

        dynamicComponentHostDirective.renderComponent({} as Type<any>);

        expect(viewContainerRef.clear).toHaveBeenCalled();
    });

    // tslint:disable-next-line
    test('Calls viewContainerRef.createComponent with the result of resolveComponentFactory', () => {
        const mockComponentFactory = {} as ComponentFactory<any>;
        const componentFactoryResolver = initComponentFactoryResolver();
        componentFactoryResolver.resolveComponentFactory = jest.fn()
            .mockReturnValue(mockComponentFactory);
        const viewContainerRef = initViewContainerRef();
        const dynamicComponentHostDirective = initDynamicComponentHostDirective(
            componentFactoryResolver,
            viewContainerRef,
        );

        dynamicComponentHostDirective.renderComponent({} as Type<any>);

        expect(viewContainerRef.createComponent).toHaveBeenCalledWith(
            mockComponentFactory,
        );
    });

    test('Clears the innerHtml of the view container', () => {
        const viewContainerRef = initViewContainerRef();
        const dynamicComponentHostDirective = initDynamicComponentHostDirective(
            initComponentFactoryResolver(),
            viewContainerRef,
        );
        viewContainerRef.element.nativeElement.innerHTML = 'test';

        dynamicComponentHostDirective.renderComponent({} as Type<any>);

        expect(viewContainerRef.element.nativeElement.innerHTML).toBe('');
    });

    test('Adds the new component to the view container', () => {
        const viewContainerRef = initViewContainerRef();
        const mockComponentRef = {
            location: {
                nativeElement: {},
            },
        } as ComponentRef<any>;
        viewContainerRef.createComponent = jest.fn()
            .mockReturnValue(mockComponentRef);
        const dynamicComponentHostDirective = initDynamicComponentHostDirective(
            initComponentFactoryResolver(),
            viewContainerRef,
        );

        dynamicComponentHostDirective.renderComponent({} as Type<any>);

        expect(viewContainerRef.element.nativeElement.appendChild)
            .toHaveBeenCalledWith(
                mockComponentRef.location.nativeElement,
            );
    });

    test('Returns the component reference', () => {
        const viewContainerRef = initViewContainerRef();
        const mockComponentRef = {
            location: {},
        } as ComponentRef<any>;
        viewContainerRef.createComponent = jest.fn()
            .mockReturnValue(mockComponentRef);
        const dynamicComponentHostDirective = initDynamicComponentHostDirective(
            initComponentFactoryResolver(),
            viewContainerRef,
        );

        const result =
            dynamicComponentHostDirective.renderComponent({} as Type<any>);

        expect(result).toBe(mockComponentRef);
    });
});