complete and refactorin test

This commit is contained in:
Eugenio Romano
2016-08-15 12:46:32 +01:00
parent b9b474259a
commit 2498af1daf
3 changed files with 188 additions and 337 deletions

View File

@@ -13,7 +13,7 @@
<!-- Pagination toolbar start --> <!-- Pagination toolbar start -->
<div *ngIf="showToolbar]" id="viewer-toolbar-pagination" class="viewer-toolbar-pagination mdl-cell--hide-tablet mdl-cell--hide-phone"> <div *ngIf="showToolbar" id="viewer-toolbar-pagination" class="viewer-toolbar-pagination mdl-cell--hide-tablet mdl-cell--hide-phone">
<div id="viewer-previous-page-button" class="button-page left" (click)="previousPage()"> <div id="viewer-previous-page-button" class="button-page left" (click)="previousPage()">
<i class="icon material-icons">keyboard_arrow_left</i> <i class="icon material-icons">keyboard_arrow_left</i>
</div> </div>

View File

@@ -15,20 +15,23 @@
* limitations under the License. * limitations under the License.
*/ */
import { describe, expect, it, inject, beforeEachProviders } from '@angular/core/testing'; import {describe, expect, it, inject, beforeEachProviders, beforeEach} from '@angular/core/testing';
import { TestComponentBuilder } from '@angular/compiler/testing'; import {TestComponentBuilder} from '@angular/compiler/testing';
import { PdfViewerComponent } from './pdfViewer.component'; import {PdfViewerComponent} from './pdfViewer.component';
import { PDFJSmock } from './assets/PDFJS.mock'; import {PDFJSmock} from './assets/PDFJS.mock';
import { PDFViewermock } from './assets/PDFViewer.mock'; import {PDFViewermock} from './assets/PDFViewer.mock';
import { EventMock } from './assets/event.mock'; import {EventMock} from './assets/event.mock';
import { HTTP_PROVIDERS } from '@angular/http'; import {HTTP_PROVIDERS} from '@angular/http';
import { AlfrescoSettingsServiceMock } from '../src/assets/AlfrescoSettingsService.service.mock'; import {AlfrescoSettingsServiceMock} from '../src/assets/AlfrescoSettingsService.service.mock';
import { AlfrescoAuthenticationService, AlfrescoSettingsService } from 'ng2-alfresco-core'; import {AlfrescoAuthenticationService, AlfrescoSettingsService} from 'ng2-alfresco-core';
describe('PdfViewer', () => { describe('PdfViewer', () => {
let pdfComponentFixture, element, component;
beforeEachProviders(() => { beforeEachProviders(() => {
return [ return [
HTTP_PROVIDERS, HTTP_PROVIDERS,
@@ -37,377 +40,226 @@ describe('PdfViewer', () => {
]; ];
}); });
beforeEach(inject([TestComponentBuilder], (tcb: TestComponentBuilder) => {
return tcb
.createAsync(PdfViewerComponent)
.then(fixture => {
pdfComponentFixture = fixture;
element = fixture.nativeElement;
component = fixture.componentInstance;
spyOn(component, 'getPDFJS').and.returnValue(new PDFJSmock());
spyOn(component, 'initPDFViewer').and.callFake(() => {
component.pdfViewer = new PDFViewermock();
});
component.showToolbar = true;
component.urlFile = 'fake-url-file';
pdfComponentFixture.detectChanges();
});
}));
describe('View', () => { describe('View', () => {
it('Canvas should be present', inject([TestComponentBuilder], (tcb: TestComponentBuilder) => { it('Canvas should be present', () => {
return tcb expect(element.querySelector('#viewer-viewerPdf')).not.toBeNull();
.createAsync(PdfViewerComponent) expect(element.querySelector('#viewer-pdf-container')).not.toBeNull();
.then((fixture) => { });
let element = fixture.nativeElement;
fixture.detectChanges(); it('Loader should be present', () => {
pdfComponentFixture.detectChanges();
expect(element.querySelector('#viewer-viewerPdf')).not.toBeNull(); expect(element.querySelector('#loader-container')).not.toBeNull();
expect(element.querySelector('#viewer-pdf-container')).not.toBeNull();
});
}));
it('Loader should be present', inject([TestComponentBuilder], (tcb: TestComponentBuilder) => { });
return tcb
.createAsync(PdfViewerComponent)
.then((fixture) => {
let element = fixture.nativeElement;
fixture.detectChanges(); it('Next an Previous Buttons should be present', () => {
pdfComponentFixture.detectChanges();
expect(element.querySelector('#loader-container')).not.toBeNull(); expect(element.querySelector('#viewer-previous-page-button')).not.toBeNull();
}); expect(element.querySelector('#viewer-next-page-button')).not.toBeNull();
})); });
it('Next an Previous Buttons should be present', inject([TestComponentBuilder], (tcb: TestComponentBuilder) => {
return tcb
.createAsync(PdfViewerComponent)
.then((fixture) => {
let element = fixture.nativeElement;
fixture.detectChanges(); it('Input Page elements should be present', () => {
pdfComponentFixture.detectChanges();
expect(element.querySelector('#viewer-previous-page-button')).not.toBeNull(); expect(element.querySelector('#viewer-pagenumber-input')).toBeDefined();
expect(element.querySelector('#viewer-next-page-button')).not.toBeNull(); expect(element.querySelector('#viewer-total-pages')).toBeDefined();
});
}));
it('Input Page elements should be present', inject([TestComponentBuilder], (tcb: TestComponentBuilder) => { expect(element.querySelector('#viewer-previous-page-button')).not.toBeNull();
return tcb expect(element.querySelector('#viewer-next-page-button')).not.toBeNull();
.createAsync(PdfViewerComponent) });
.then((fixture) => {
let element = fixture.nativeElement;
fixture.detectChanges(); it('Toolbar should be hide if showToolbar is false', () => {
component.showToolbar = false;
expect(element.querySelector('#viewer-pagenumber-input')).toBeDefined(); pdfComponentFixture.detectChanges();
expect(element.querySelector('#viewer-total-pages')).toBeDefined();
expect(element.querySelector('#viewer-previous-page-button')).not.toBeNull(); expect(element.querySelector('#viewer-toolbar-command')).toBeNull();
expect(element.querySelector('#viewer-next-page-button')).not.toBeNull(); expect(element.querySelector('#viewer-toolbar-pagination')).toBeNull();
}); });
}));
}); });
describe('User interaction', () => { describe('User interaction', () => {
it('Total number of pages should be loaded', inject([TestComponentBuilder], (tcb: TestComponentBuilder) => {
return tcb
.createAsync(PdfViewerComponent)
.then((fixture) => {
let component = fixture.componentInstance;
component.urlFile = 'fake-url-file';
spyOn(component, 'getPDFJS').and.returnValue(new PDFJSmock());
spyOn(component, 'initPDFViewer').and.callFake(() => {
component.pdfViewer = new PDFViewermock();
});
component.ngOnChanges().then(() => { beforeEach(() => {
expect(component.totalPages).toEqual('10'); component.inputPage(1);
}); });
});
}));
it('Total number of pages should be loaded', () => {
component.ngOnChanges().then(() => {
expect(component.totalPages).toEqual('10');
});
});
it('right arrow should move to the next page', inject([TestComponentBuilder], (tcb: TestComponentBuilder) => { it('right arrow should move to the next page', (done) => {
return tcb component.ngOnChanges().then(() => {
.createAsync(PdfViewerComponent) pdfComponentFixture.detectChanges();
.then((fixture) => { expect(component.displayPage).toBe(1);
let component = fixture.componentInstance; EventMock.keyDown(39);
spyOn(component, 'getPDFJS').and.returnValue(new PDFJSmock()); pdfComponentFixture.detectChanges();
spyOn(component, 'initPDFViewer').and.callFake(() => { expect(component.displayPage).toBe(2);
component.pdfViewer = new PDFViewermock(); done();
}); });
});
component.urlFile = 'fake-url-file'; it('nextPage should move to the next page', (done) => {
let nextPageButton = element.querySelector('#viewer-next-page-button');
component.ngOnChanges().then(() => { component.ngOnChanges().then(() => {
fixture.detectChanges(); pdfComponentFixture.detectChanges();
expect(component.displayPage).toBe(1); expect(component.displayPage).toBe(1);
EventMock.keyDown(39); nextPageButton.click();
fixture.detectChanges(); pdfComponentFixture.detectChanges();
expect(component.displayPage).toBe(2); expect(component.displayPage).toBe(2);
}).catch((error) => { done();
expect(error).toBeUndefined(); });
}); });
});
}));
it('nextPage should move to the next page', inject([TestComponentBuilder], (tcb: TestComponentBuilder) => { it('left arrow should move to the previous page', (done) => {
return tcb component.ngOnChanges().then(() => {
.createAsync(PdfViewerComponent) pdfComponentFixture.detectChanges();
.then((fixture) => { expect(component.displayPage).toBe(1);
let component = fixture.componentInstance; EventMock.keyDown(39);
let element = fixture.nativeElement; EventMock.keyDown(39);
EventMock.keyDown(37);
pdfComponentFixture.detectChanges();
expect(component.displayPage).toBe(2);
done();
});
});
spyOn(component, 'getPDFJS').and.returnValue(new PDFJSmock()); it('previous page should move to the previous page', (done) => {
spyOn(component, 'initPDFViewer').and.callFake(() => { let previousPageButton = element.querySelector('#viewer-previous-page-button');
component.pdfViewer = new PDFViewermock(); let nextPageButton = element.querySelector('#viewer-next-page-button');
});
component.urlFile = 'fake-url-file'; component.ngOnChanges().then(() => {
pdfComponentFixture.detectChanges();
let nextPageButton = element.querySelector('#viewer-next-page-button'); expect(component.displayPage).toBe(1);
nextPageButton.click();
component.ngOnChanges().then(() => { nextPageButton.click();
fixture.detectChanges(); previousPageButton.click();
expect(component.displayPage).toBe(1); pdfComponentFixture.detectChanges();
nextPageButton.click(); expect(component.displayPage).toBe(2);
fixture.detectChanges(); done();
expect(component.displayPage).toBe(2); });
}).catch((error) => { });
expect(error).toBeUndefined();
});
});
}));
it('left arrow should move to the previous page', inject([TestComponentBuilder], (tcb: TestComponentBuilder) => {
return tcb
.createAsync(PdfViewerComponent)
.then((fixture) => {
let component = fixture.componentInstance;
spyOn(component, 'getPDFJS').and.returnValue(new PDFJSmock());
spyOn(component, 'initPDFViewer').and.callFake(() => {
component.pdfViewer = new PDFViewermock();
});
component.urlFile = 'fake-url-file';
component.ngOnChanges().then(() => {
fixture.detectChanges();
expect(component.displayPage).toBe(1);
EventMock.keyDown(39);
EventMock.keyDown(39);
EventMock.keyDown(37);
fixture.detectChanges();
expect(component.displayPage).toBe(2);
}).catch((error) => {
expect(error).toBeUndefined();
});
});
}));
it('previous page should move to the previous page', inject([TestComponentBuilder], (tcb: TestComponentBuilder) => {
return tcb
.createAsync(PdfViewerComponent)
.then((fixture) => {
let component = fixture.componentInstance;
let element = fixture.nativeElement;
spyOn(component, 'getPDFJS').and.returnValue(new PDFJSmock());
spyOn(component, 'initPDFViewer').and.callFake(() => {
component.pdfViewer = new PDFViewermock();
});
component.urlFile = 'fake-url-file';
let previousPageButton = element.querySelector('#viewer-previous-page-button');
let nextPageButton = element.querySelector('#viewer-next-page-button');
component.ngOnChanges().then(() => {
fixture.detectChanges();
expect(component.displayPage).toBe(1);
nextPageButton.click();
nextPageButton.click();
previousPageButton.click();
fixture.detectChanges();
expect(component.displayPage).toBe(2);
}).catch((error) => {
expect(error).toBeUndefined();
});
});
}));
/* tslint:disable:max-line-length */ /* tslint:disable:max-line-length */
it('previous page should not move to the previous page if is page 1', inject([TestComponentBuilder], (tcb: TestComponentBuilder) => { it('previous page should not move to the previous page if is page 1', (done) => {
return tcb component.ngOnChanges().then(() => {
.createAsync(PdfViewerComponent) pdfComponentFixture.detectChanges();
.then((fixture) => { expect(component.displayPage).toBe(1);
let component = fixture.componentInstance; component.previousPage();
spyOn(component, 'getPDFJS').and.returnValue(new PDFJSmock()); pdfComponentFixture.detectChanges();
spyOn(component, 'initPDFViewer').and.callFake(() => { expect(component.displayPage).toBe(1);
component.pdfViewer = new PDFViewermock(); done();
}); });
});
component.urlFile = 'fake-url-file'; it('Input page should move to the inserted page', (done) => {
component.ngOnChanges().then(() => {
component.ngOnChanges().then(() => { pdfComponentFixture.detectChanges();
fixture.detectChanges(); expect(component.displayPage).toBe(1);
expect(component.displayPage).toBe(1); component.inputPage('4');
component.previousPage(); pdfComponentFixture.detectChanges();
fixture.detectChanges(); expect(component.displayPage).toBe(4);
expect(component.displayPage).toBe(1); done();
}).catch((error) => { });
expect(error).toBeUndefined(); });
});
});
}));
it('Input page should move to the inserted page', inject([TestComponentBuilder], (tcb: TestComponentBuilder) => {
return tcb
.createAsync(PdfViewerComponent)
.then((fixture) => {
let component = fixture.componentInstance;
spyOn(component, 'getPDFJS').and.returnValue(new PDFJSmock());
spyOn(component, 'initPDFViewer').and.callFake(() => {
component.pdfViewer = new PDFViewermock();
});
component.urlFile = 'fake-url-file';
component.ngOnChanges().then(() => {
fixture.detectChanges();
expect(component.displayPage).toBe(1);
component.inputPage('4');
fixture.detectChanges();
expect(component.displayPage).toBe(4);
}).catch((error) => {
expect(error).toBeUndefined();
});
});
}));
/* tslint:disable:max-line-length */ /* tslint:disable:max-line-length */
it('zoomIn should increment the scale value', inject([TestComponentBuilder], (tcb: TestComponentBuilder) => { it('zoomIn should increment the scale value', (done) => {
return tcb component.currentScale = 1;
.createAsync(PdfViewerComponent)
.then((fixture) => {
let component = fixture.componentInstance;
let element = fixture.nativeElement;
spyOn(component, 'getPDFJS').and.returnValue(new PDFJSmock()); let zoomInButton = element.querySelector('#viewer-zoom-in-button');
spyOn(component, 'initPDFViewer').and.callFake(() => {
component.pdfViewer = new PDFViewermock();
});
component.urlFile = 'fake-url-file'; component.ngOnChanges().then(() => {
component.currentScale = 1; pdfComponentFixture.detectChanges();
zoomInButton.click();
expect(component.currentScaleMode).toBe('auto');
expect(component.currentScale).toBe(1.1);
done();
});
});
let zoomInButton = element.querySelector('#viewer-zoom-in-button'); it('zoomOut should decrement the scale value', (done) => {
component.currentScale = 1;
component.ngOnChanges().then(() => { let zoomOutButton = element.querySelector('#viewer-zoom-out-button');
fixture.detectChanges();
zoomInButton.click();
expect(component.currentScaleMode).toBe('auto');
expect(component.currentScale).toBe(1.1);
}).catch((error) => {
expect(error).toBeUndefined();
});
});
}));
it('zoomOut should decrement the scale value', inject([TestComponentBuilder], (tcb: TestComponentBuilder) => { component.ngOnChanges().then(() => {
return tcb pdfComponentFixture.detectChanges();
.createAsync(PdfViewerComponent) zoomOutButton.click();
.then((fixture) => { expect(component.currentScaleMode).toBe('auto');
let component = fixture.componentInstance; expect(component.currentScale).toBe(0.9);
let element = fixture.nativeElement; done();
});
});
spyOn(component, 'getPDFJS').and.returnValue(new PDFJSmock()); it('fit in button should toggle page-fit and auto scale mode', (done) => {
spyOn(component, 'initPDFViewer').and.callFake(() => { component.currentScale = 1;
component.pdfViewer = new PDFViewermock();
});
component.urlFile = 'fake-url-file'; let fitPage = element.querySelector('#viewer-scale-page-button');
component.currentScale = 1;
let zoomOutButton = element.querySelector('#viewer-zoom-out-button'); component.ngOnChanges().then(() => {
pdfComponentFixture.detectChanges();
component.ngOnChanges().then(() => { expect(component.currentScaleMode).toBe('auto');
fixture.detectChanges(); fitPage.click();
zoomOutButton.click(); expect(component.currentScaleMode).toBe('page-fit');
expect(component.currentScaleMode).toBe('auto'); fitPage.click();
expect(component.currentScale).toBe(0.9); expect(component.currentScaleMode).toBe('auto');
}).catch((error) => { done();
expect(error).toBeUndefined(); });
}); });
});
}));
it('fit in button should toggle page-fit and auto scale mode', inject([TestComponentBuilder], (tcb: TestComponentBuilder) => {
return tcb
.createAsync(PdfViewerComponent)
.then((fixture) => {
let component = fixture.componentInstance;
let element = fixture.nativeElement;
spyOn(component, 'getPDFJS').and.returnValue(new PDFJSmock());
spyOn(component, 'initPDFViewer').and.callFake(() => {
component.pdfViewer = new PDFViewermock();
});
component.urlFile = 'fake-url-file';
component.currentScale = 1;
let fitPage = element.querySelector('#viewer-scale-page-button');
component.ngOnChanges().then(() => {
fixture.detectChanges();
expect(component.currentScaleMode).toBe('auto');
fitPage.click();
expect(component.currentScaleMode).toBe('page-fit');
fitPage.click();
expect(component.currentScaleMode).toBe('auto');
}).catch((error) => {
expect(error).toBeUndefined();
});
});
}));
}); });
describe('Resize interaction', () => { describe('Resize interaction', () => {
it('resize event should trigger setScaleUpdatePages', inject([TestComponentBuilder], (tcb: TestComponentBuilder) => { it('resize event should trigger setScaleUpdatePages', () => {
return tcb spyOn(component, 'setScaleUpdatePages');
.createAsync(PdfViewerComponent)
.then((fixture) => {
let component = fixture.componentInstance;
let element = fixture.nativeElement;
spyOn(component, 'getPDFJS').and.returnValue(new PDFJSmock()); component.documentContainer = element.querySelector('#viewer-pdf-container');
spyOn(component, 'initPDFViewer'); component.pdfViewer = new PDFViewermock();
spyOn(component, 'setScaleUpdatePages'); component.urlFile = 'fake-url-file';
component.documentContainer = element.querySelector('#viewer-pdf-container'); EventMock.resizeMobileView();
component.pdfViewer = new PDFViewermock();
component.urlFile = 'fake-url-file';
EventMock.resizeMobileView(); expect(component.setScaleUpdatePages).toHaveBeenCalled();
});
expect(component.setScaleUpdatePages).toHaveBeenCalled();
});
}));
}); });
describe('scroll interaction', () => { describe('scroll interaction', () => {
it('scroll page should return the current page', inject([TestComponentBuilder], (tcb: TestComponentBuilder) => { it('scroll page should return the current page', (done) => {
return tcb component.ngOnChanges().then(() => {
.createAsync(PdfViewerComponent) pdfComponentFixture.detectChanges();
.then((fixture) => { expect(component.displayPage).toBe(1);
let component = fixture.componentInstance; component.inputPage('4');
pdfComponentFixture.detectChanges();
spyOn(component, 'getPDFJS').and.returnValue(new PDFJSmock()); expect(component.displayPage).toBe(4);
spyOn(component, 'initPDFViewer').and.callFake(() => { component.watchScroll({scrollTop: 10000});
component.pdfViewer = new PDFViewermock(); expect(component.displayPage).toBe(4);
}); done();
});
component.urlFile = 'fake-url-file'; });
component.ngOnChanges().then(() => {
fixture.detectChanges();
expect(component.displayPage).toBe(1);
component.inputPage('4');
fixture.detectChanges();
expect(component.displayPage).toBe(4);
component.watchScroll({scrollTop: 10000});
expect(component.displayPage).toBe(4);
}).catch((error) => {
expect(error).toBeUndefined();
});
});
}));
}); });
}); });

View File

@@ -19,7 +19,6 @@ import { describe, expect, it, inject, beforeEachProviders } from '@angular/core
import { TestComponentBuilder } from '@angular/compiler/testing'; import { TestComponentBuilder } from '@angular/compiler/testing';
import { ViewerComponent } from './viewer.component'; import { ViewerComponent } from './viewer.component';
import { EventMock } from './assets/event.mock'; import { EventMock } from './assets/event.mock';
import { HTTP_PROVIDERS } from '@angular/http'; import { HTTP_PROVIDERS } from '@angular/http';
import { AlfrescoSettingsServiceMock } from '../src/assets/AlfrescoSettingsService.service.mock'; import { AlfrescoSettingsServiceMock } from '../src/assets/AlfrescoSettingsService.service.mock';
import { AlfrescoAuthenticationService, AlfrescoSettingsService } from 'ng2-alfresco-core'; import { AlfrescoAuthenticationService, AlfrescoSettingsService } from 'ng2-alfresco-core';