Add tests for select-multiple component

src/app/search/components/criteria/criteria-by-family.component.html

@@ -40,8 +40,8 @@
                 [label]="attribute.form_label" 
                 [options]="getOptions(attribute.id)"
                 [criterion]="getCriterion(attribute.id)" 
-                (add)="add($event)" 
-                (delete)="delete($event)">
+                (addCriterion)="add($event)" 
+                (deleteCriterion)="delete($event)">
             </app-select-multiple>
         </div>
         <div *ngSwitchCase="'datalist'">

src/app/search/components/criteria/search-type/checkbox.component.spec.ts

@@ -48,16 +48,15 @@ describe('[Search][Criteria][SearchType] Component: CheckboxComponent', () => {
     // });
 
     // it('#getDefault() should fill and disable form if criterion is defined', () => {
-    //     const min = '10';
-    //     const max = '20';
-    //     const criterion = new BetweenCriterion(1, min, max);
-    //     const expectedFieldMinValue = min;
-    //     const expectedFieldMaxValue = max;
+    //     const options = [
+    //         { label: 'One', value: 'one', display: 1 },
+    //         { label: 'Two', value: 'two', display: 2 },
+    //         { label: 'Three', value: 'three', display: 3 }
+    //     ];
+    //     const criterion = new SelectMultipleCriterion(1, options);
     //     component.getDefault(criterion);
-    //     expect(component.fieldMin.value).toEqual(expectedFieldMinValue);
-    //     expect(component.fieldMin.disabled).toBeTruthy();
-    //     expect(component.fieldMax.value).toEqual(expectedFieldMaxValue);
-    //     expect(component.fieldMax.disabled).toBeTruthy();
+    //     expect(component.c.value).toEqual(['one', 'two', 'three']);
+    //     expect(component.checkboxes.disabled).toBeTruthy();
     // });
 
     // it('raises the add criterion event when clicked', () => {

src/app/search/components/criteria/search-type/datetime.component.spec.ts

 import { async, ComponentFixture, TestBed } from '@angular/core/testing';
 
-import { BsDatepickerModule, isDateValid } from 'ngx-bootstrap';
+import { BsDatepickerModule } from 'ngx-bootstrap';
 import { NgSelectModule } from '@ng-select/ng-select';
 import { FormsModule, ReactiveFormsModule, FormControl } from '@angular/forms';
 

src/app/search/components/criteria/search-type/select-multiple.component.html

@@ -6,10 +6,10 @@
         </ng-select>
     </div>
     <div class="col-2 text-center">
-        <button class="btn btn-outline-success" *ngIf="!ms.disabled" [hidden]="!ms.value" (click)="addCriterion()">
+        <button class="btn btn-outline-success" *ngIf="!ms.disabled" [hidden]="!ms.value" (click)="emitAdd()">
             <span class="fas fa-plus fa-fw"></span>
         </button>
-        <button class="btn btn-outline-danger" *ngIf="ms.disabled" (click)="deleteCriterion()">
+        <button class="btn btn-outline-danger" *ngIf="ms.disabled" (click)="emitDelete()">
             <span class="fa fa-times fa-fw"></span>
         </button>
     </div>

src/app/search/components/criteria/search-type/select-multiple.component.spec.ts

+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { NgSelectModule } from '@ng-select/ng-select';
+import { FormsModule, ReactiveFormsModule, FormControl } from '@angular/forms';
+
+import { SelectMultipleComponent } from './select-multiple.component';
+import { SelectMultipleCriterion } from '../../../store/model';
+
+describe('[Search][Criteria][SearchType] Component: SelectMultipleComponent', () => {
+    let component: SelectMultipleComponent;
+    let fixture: ComponentFixture<SelectMultipleComponent>;
+
+    beforeEach(() => {
+        TestBed.configureTestingModule({
+            declarations: [SelectMultipleComponent],
+            imports: [NgSelectModule, FormsModule, ReactiveFormsModule]
+        });
+        fixture = TestBed.createComponent(SelectMultipleComponent);
+        component = fixture.componentInstance;
+    });
+
+    it('should create the component', () => {
+        expect(component).toBeTruthy();
+    });
+
+    it('#getDefault() should enable and not fill form if criterion not defined', () => {
+        component.getDefault(undefined);
+        expect(component.ms.value).toBeNull();
+        expect(component.ms.enabled).toBeTruthy();
+    });
+
+    it('#getDefault() should fill and disable form if criterion is defined', () => {
+        const options = [
+            { label: 'One', value: 'one', display: 1 },
+            { label: 'Two', value: 'two', display: 2 },
+            { label: 'Three', value: 'three', display: 3 }
+        ];
+        const criterion = new SelectMultipleCriterion(1, options);
+        component.getDefault(criterion);
+        expect(component.ms.value).toEqual(['one', 'two', 'three']);
+        expect(component.ms.disabled).toBeTruthy();
+    });
+
+    it('raises the add criterion event when clicked', () => {
+        component.id = 1;
+        component.options = [
+            { label: 'One', value: 'one', display: 1 },
+            { label: 'Two', value: 'two', display: 2 },
+            { label: 'Three', value: 'three', display: 3 }
+        ];
+        const value = ['three'];
+        component.ms = new FormControl(value);
+        const expectedValue = [
+            { label: 'Three', value: 'three', display: 3 }
+        ];
+        const expectedCriterion = new SelectMultipleCriterion(component.id, expectedValue);
+        component.addCriterion.subscribe((event: SelectMultipleCriterion) => expect(event).toEqual(expectedCriterion));
+        component.emitAdd();
+    });
+
+    it('raises the delete criterion event when clicked', () => {
+        component.id = 1;
+        component.deleteCriterion.subscribe((event: number) => expect(event).toEqual(1));
+        component.emitDelete();
+    });
+});

src/app/search/components/criteria/search-type/select-multiple.component.ts

@@ -17,19 +17,19 @@ export class SelectMultipleComponent {
     set criterion(criterion: Criterion) {
         this.getDefault(criterion);
     }
-    @Output() add: EventEmitter<SelectMultipleCriterion> = new EventEmitter();
-    @Output() delete: EventEmitter<number> = new EventEmitter();
+    @Output() addCriterion: EventEmitter<SelectMultipleCriterion> = new EventEmitter();
+    @Output() deleteCriterion: EventEmitter<number> = new EventEmitter();
 
     ms = new FormControl();
 
-    addCriterion() {
+    emitAdd() {
         const options = this.ms.value.map(optionValue => this.options.find(o => o.value === optionValue));
         const ms = new SelectMultipleCriterion(this.id, options);
-        this.add.emit(ms);
+        this.addCriterion.emit(ms);
     }
 
-    deleteCriterion() {
-        this.delete.emit(this.id);
+    emitDelete() {
+        this.deleteCriterion.emit(this.id);
     }
 
     getDefault(criterion: Criterion): void {