git.apps.os.sepia.ceph.com Git - ceph.git/blob

   1 import { Component, ViewChild } from '@angular/core';
   2 import { async, ComponentFixture, fakeAsync, TestBed, tick } from '@angular/core/testing';
   3 import { FormGroupDirective, ReactiveFormsModule } from '@angular/forms';
   4
   5 import { ModalModule } from 'ngx-bootstrap';
   6 import { Observable } from 'rxjs/Observable';
   7 import { Subscriber } from 'rxjs/Subscriber';
   8
   9 import { ModalComponent } from '../modal/modal.component';
  10 import { SubmitButtonComponent } from '../submit-button/submit-button.component';
  11 import { DeletionLinkComponent } from './deletion-link.component';
  12
  13 @Component({
  14   template: `
  15     <cd-deletion-link #ctrlDeleteButton
  16                       metaType="Controller delete handling"
  17                       pattern="ctrl-test"
  18                       (toggleDeletion)="fakeDeleteController()">
  19       The spinner is handled by the controller if you have use the modal as ViewChild in order to
  20       use it's functions to stop the spinner or close the dialog.
  21     </cd-deletion-link>
  22     <cd-deletion-link #modalDeleteButton
  23                       metaType="Modal delete handling"
  24                       [deletionObserver]="fakeDelete()"
  25                       pattern="modal-test">
  26       The spinner is handled by the modal if your given deletion function returns a Observable.
  27     </cd-deletion-link>
  28   `
  29 })
  30 class MockComponent {
  31   @ViewChild('ctrlDeleteButton') ctrlDeleteButton: DeletionLinkComponent;
  32   @ViewChild('modalDeleteButton') modalDeleteButton: DeletionLinkComponent;
  33   someData = [1, 2, 3, 4, 5];
  34   finished: number[];
  35
  36   finish() {
  37     this.finished = [6, 7, 8, 9];
  38   }
  39
  40   fakeDelete() {
  41     return (): Observable<any> => {
  42       return new Observable((observer: Subscriber<any>) => {
  43         Observable.timer(100).subscribe(() => {
  44           observer.next(this.finish());
  45           observer.complete();
  46         });
  47       });
  48     };
  49   }
  50
  51   fakeDeleteController() {
  52     Observable.timer(100).subscribe(() => {
  53       this.finish();
  54       this.ctrlDeleteButton.hideModal();
  55     });
  56   }
  57 }
  58
  59 describe('DeletionLinkComponent', () => {
  60   let mockComponent: MockComponent;
  61   let component: DeletionLinkComponent;
  62   let fixture: ComponentFixture<MockComponent>;
  63
  64   beforeEach(async(() => {
  65     TestBed.configureTestingModule({
  66       declarations: [ MockComponent, DeletionLinkComponent, ModalComponent,
  67         SubmitButtonComponent],
  68       imports: [ModalModule.forRoot(), ReactiveFormsModule],
  69     })
  70     .compileComponents();
  71   }));
  72
  73   beforeEach(() => {
  74     fixture = TestBed.createComponent(MockComponent);
  75     mockComponent = fixture.componentInstance;
  76     component = mockComponent.ctrlDeleteButton;
  77     fixture.detectChanges();
  78   });
  79
  80   it('should create', () => {
  81     expect(component).toBeTruthy();
  82   });
  83
  84   describe('component functions', () => {
  85
  86     const mockShowModal = () => {
  87       component.showModal(null);
  88     };
  89
  90     const changeValue = (value) => {
  91       component.confirmation.setValue(value);
  92       component.confirmation.markAsDirty();
  93       component.confirmation.updateValueAndValidity();
  94     };
  95
  96     beforeEach(() => {
  97       spyOn(component.modalService, 'show').and.returnValue({
  98         hide: () => true
  99       });
 100     });
 101
 102     it('should test showModal', () => {
 103       changeValue('something');
 104       expect(mockShowModal).toBeTruthy();
 105       expect(component.confirmation.value).toBe('something');
 106       expect(component.modalService.show).not.toHaveBeenCalled();
 107       mockShowModal();
 108       expect(component.modalService.show).toHaveBeenCalled();
 109       expect(component.confirmation.value).toBe(null);
 110       expect(component.confirmation.pristine).toBe(true);
 111     });
 112
 113     it('should test hideModal', () => {
 114       expect(component.bsModalRef).not.toBeTruthy();
 115       mockShowModal();
 116       expect(component.bsModalRef).toBeTruthy();
 117       expect(component.hideModal).toBeTruthy();
 118       spyOn(component.bsModalRef, 'hide').and.stub();
 119       expect(component.bsModalRef.hide).not.toHaveBeenCalled();
 120       component.hideModal();
 121       expect(component.bsModalRef.hide).toHaveBeenCalled();
 122     });
 123
 124     describe('invalid control', () => {
 125
 126       const testInvalidControl = (submitted: boolean, error: string, expected: boolean) => {
 127         expect(component.invalidControl(submitted, error)).toBe(expected);
 128       };
 129
 130       beforeEach(() => {
 131         component.deletionForm.reset();
 132       });
 133
 134       it('should test empty values', () => {
 135         expect(component.invalidControl).toBeTruthy();
 136         component.deletionForm.reset();
 137         testInvalidControl(false, undefined, false);
 138         testInvalidControl(true, 'required', true);
 139         component.deletionForm.reset();
 140         changeValue('let-me-pass');
 141         changeValue('');
 142         testInvalidControl(true, 'required', true);
 143       });
 144
 145       it('should test pattern', () => {
 146         changeValue('let-me-pass');
 147         testInvalidControl(false, 'pattern', true);
 148         changeValue('ctrl-test');
 149         testInvalidControl(false, undefined, false);
 150         testInvalidControl(true, undefined, false);
 151       });
 152     });
 153
 154     describe('deletion call', () => {
 155       beforeEach(() => {
 156         spyOn(component.toggleDeletion, 'emit');
 157         spyOn(component, 'stopLoadingSpinner');
 158         spyOn(component, 'hideModal').and.stub();
 159       });
 160
 161       describe('Controller driven', () => {
 162         beforeEach(() => {
 163           mockShowModal();
 164           expect(component.toggleDeletion.emit).not.toHaveBeenCalled();
 165           expect(component.stopLoadingSpinner).not.toHaveBeenCalled();
 166           expect(component.hideModal).not.toHaveBeenCalled();
 167         });
 168
 169         it('should delete without doing anything but call emit', () => {
 170           component.deletionCall();
 171           expect(component.stopLoadingSpinner).not.toHaveBeenCalled();
 172           expect(component.hideModal).not.toHaveBeenCalled();
 173           expect(component.toggleDeletion.emit).toHaveBeenCalled();
 174         });
 175
 176         it('should test fake deletion that closes modal', <any>fakeAsync(() => {
 177           mockComponent.fakeDeleteController();
 178           expect(component.hideModal).not.toHaveBeenCalled();
 179           expect(mockComponent.finished).toBe(undefined);
 180           tick(2000);
 181           expect(component.hideModal).toHaveBeenCalled();
 182           expect(mockComponent.finished).toEqual([6, 7, 8, 9]);
 183         }));
 184       });
 185
 186       describe('Modal driven', () => {
 187         it('should delete and close modal', <any>fakeAsync(() => {
 188           component = mockComponent.modalDeleteButton;
 189           mockShowModal();
 190           spyOn(component.toggleDeletion, 'emit');
 191           spyOn(component, 'stopLoadingSpinner');
 192           spyOn(component, 'hideModal').and.stub();
 193           spyOn(mockComponent, 'fakeDelete');
 194
 195           component.deletionCall();
 196           expect(mockComponent.finished).toBe(undefined);
 197           expect(component.toggleDeletion.emit).not.toHaveBeenCalled();
 198           expect(component.hideModal).not.toHaveBeenCalled();
 199
 200           tick(2000);
 201           expect(component.toggleDeletion.emit).not.toHaveBeenCalled();
 202           expect(component.stopLoadingSpinner).not.toHaveBeenCalled();
 203           expect(component.hideModal).toHaveBeenCalled();
 204           expect(mockComponent.finished).toEqual([6, 7, 8, 9]);
 205         }));
 206       });
 207     });
 208   });
 209
 210 });