src/app/features/forms/statement-editor/components/arrangement-form-group/arrangement-form-group.component.spec.ts

/********************************************************************************
 * Copyright (c) 2020 Contributors to the Eclipse Foundation
 *
 * See the NOTICE file(s) distributed with this work for additional
 * information regarding copyright ownership.
 *
 * This program and the accompanying materials are made available under the
 * terms of the Eclipse Public License 2.0 which is available at
 * http://www.eclipse.org/legal/epl-2.0
 *
 * SPDX-License-Identifier: EPL-2.0
 ********************************************************************************/

import {CdkDragDrop} from "@angular/cdk/drag-drop";
import {async, ComponentFixture, TestBed} from "@angular/core/testing";
import {FormArray} from "@angular/forms";
import {BrowserAnimationsModule} from "@angular/platform-browser/animations";
import {provideMockStore} from "@ngrx/store/testing";
import {IAPITextArrangementItemModel} from "../../../../../core/api/text";
import {I18nModule} from "../../../../../core/i18n";
import {IExtendedTextBlockModel} from "../../../../../shared/text-block/model";
import {StatementEditorModule} from "../../statement-editor.module";
import {ArrangementFormGroupComponent} from "./arrangement-form-group.component";

describe("ArrangementFormGroupComponent", () => {
    let component: ArrangementFormGroupComponent;
    let fixture: ComponentFixture<ArrangementFormGroupComponent>;

    beforeEach(async(() => {
        TestBed.configureTestingModule({
            imports: [
                StatementEditorModule,
                BrowserAnimationsModule,
                I18nModule
            ],
            providers: [
                provideMockStore()
            ]
        }).compileComponents();
    }));

    beforeEach(() => {
        fixture = TestBed.createComponent(ArrangementFormGroupComponent);
        component = fixture.componentInstance;
        fixture.detectChanges();
    });

    const arrangement: IAPITextArrangementItemModel = {
        type: "newline",
        placeholderValues: {}
    };
    const anotherArrangement: IAPITextArrangementItemModel = {
        type: "pagebreak",
        placeholderValues: {}
    };

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

    it("should add the itemmodel to the control", () => {
        const control: FormArray = component.getArrangementControl();
        expect(control.length).toEqual(0);

        component.add(arrangement);
        expect(control.length).toEqual(1);

        component.add(arrangement);
        expect(control.length).toEqual(2);

        component.add(anotherArrangement, 1);
        expect(control.length).toEqual(3);
        expect(control.value[1]).toBe(anotherArrangement);
    });

    it("should get the formcontrol at the given index", () => {
        component.add(arrangement);

        const control = component.getControl(0);
        expect(control.value).toEqual(arrangement);
    });

    it("should remove the element at the given index", () => {
        component.add(arrangement);
        component.add(arrangement);
        component.remove(1);
        component.remove(0);
        const control: FormArray = component.getArrangementControl();
        expect(control.length).toEqual(0);
    });

    it("should move the element from index to target index", () => {
        component.add(arrangement);
        component.add(anotherArrangement);
        const firstControl = component.getControl(0);
        expect(firstControl.value).toEqual(arrangement);
        const secondControl = component.getControl(1);
        expect(secondControl.value).toEqual(anotherArrangement);

        component.move(1, 0);
        const controlAfterMove = component.getControl(1);
        expect(controlAfterMove.value).toEqual(arrangement);
    });

    it("should add a text arrangement model from a blockmodel", () => {
        const textBlock: IExtendedTextBlockModel = {
            id: "id",
            text: "text",
            excludes: [],
            requires: []
        };
        const control: FormArray = component.getArrangementControl();
        expect(control.length).toEqual(0);

        component.addTextBlock(textBlock);
        expect(control.length).toEqual(1);
        const firstControl = component.getControl(0);
        expect(firstControl.value.textblockId).toEqual(textBlock.id);

        component.addTextBlock(undefined);
        expect(control.length).toEqual(1);

        component.addTextBlock({...textBlock, type: "newline"});
        const secondControl = component.getControl(1);
        expect(secondControl.value.textblockId).toEqual(undefined);
    });

    it("should call move when dropped inside same container, otherwise add", () => {
        spyOn(component, "move");
        const container = {};
        const event: CdkDragDrop<any> = {
            previousContainer: container,
            container,
            currentIndex: 0,
            previousIndex: 1,
            item: {
                data: {}
            }
        } as CdkDragDrop<any>;
        component.drop(event);
        expect(component.move).toHaveBeenCalledWith(1, 0);

        spyOn(component, "addTextBlock");
        const eventDifferentContainers: CdkDragDrop<any> = {...event, container: {}} as CdkDragDrop<any>;
        component.drop(eventDifferentContainers);
        expect(component.addTextBlock).toHaveBeenCalledWith(eventDifferentContainers.item.data, 0);
    });
});