inteligr8/alfresco-ng2-components
1
0
Fork 0
mirror of https://github.com/Alfresco/alfresco-ng2-components.git synced 2025-07-24 17:32:15 +00:00
Code Issues Packages Projects Releases Wiki Activity

[ADF-4424] Pdf Viewer - password dialog does not close when pressing Escape (#4622)

Browse Source 
* return to previous page on close

* update e2e

* [ADF-4424] Improve PreviousRouteService to use it in pdfViewer

* change previous Url logic

* remove navigation logic

* remove test

* Update pdfViewer.component.spec.ts

* back button logic for viewer outlet

* unit tests

* remove fdescribe

* remove unused service

* e2e

* return to location

* remove click filter step

* remove unnecessary test steps

* remove un existen export

* unify preview between PS and CS in demo shell

* fix dispalyname property
This commit is contained in:
Cilibiu Bogdan
2019-07-11 19:33:15 +03:00
committed by Eugenio Romano
parent 72b3a75a85
commit ccdcba8778
18 changed files with 149 additions and 317 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
demo-shell/src/app/app.routes.ts
View File

@@ -93,7 +93,7 @@ export const appRoutes: Routes = [
children: [
{
path: '',
loadChildren: 'app/components/blob-preview/blob-preview.module#BlobPreviewModule'
loadChildren: 'app/components/file-view/file-view.module#FileViewModule'
}
]
},

38
demo-shell/src/app/components/blob-preview/blob-preview.component.ts
View File

@@ -1,38 +0,0 @@
/*!
* @license
* Copyright 2019 Alfresco Software, Ltd.
*
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
*/
import { Component } from '@angular/core';
import { PreviewService } from '../../services/preview.service';
import { Router } from '@angular/router';
@Component({
templateUrl: 'bob-preview.component.html'
})
export class BlobPreviewComponent {
content: Blob;
name: string;
constructor(preview: PreviewService, router: Router) {
if (preview.content === null || preview.name === null) {
router.navigate([{ outlets: { overlay: null } }]);
return;
}
this.content = preview.content;
this.name = preview.name;
}
}

49
demo-shell/src/app/components/blob-preview/blob-preview.module.ts
View File

@@ -1,49 +0,0 @@
/*!
* @license
* Copyright 2019 Alfresco Software, Ltd.
*
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
*/
import { NgModule } from '@angular/core';
import { Routes, RouterModule } from '@angular/router';
import { CommonModule } from '@angular/common';
import { CoreModule, InfoDrawerModule } from '@alfresco/adf-core';
import { ContentDirectiveModule, ContentMetadataModule, VersionManagerModule } from '@alfresco/adf-content-services';
import { BlobPreviewComponent } from './blob-preview.component';
const routes: Routes = [
{
path: '',
component: BlobPreviewComponent
}
];
@NgModule({
imports: [
CommonModule,
RouterModule.forChild(routes),
CoreModule.forChild(),
InfoDrawerModule,
ContentDirectiveModule,
ContentMetadataModule,
VersionManagerModule
],
declarations: [
BlobPreviewComponent
],
exports: [
BlobPreviewComponent
]
})
export class BlobPreviewModule {}

5
demo-shell/src/app/components/blob-preview/bob-preview.component.html
View File

@@ -1,5 +0,0 @@
<adf-viewer
[showViewer]="true"
[blobFile]="content"
[displayName]="name">
</adf-viewer>

10
demo-shell/src/app/components/file-view/file-view.component.html
View File

@@ -1,4 +1,4 @@
<ng-container *ngIf="nodeId">
<ng-container *ngIf="nodeId || content">
<ng-template let-node="node" #sidebarRightTemplate>
<adf-info-drawer [title]="'APP.INFO_DRAWER.TITLE' | translate">
@@ -284,13 +284,15 @@
</p>
<p class="toggle">
<button mat-raised-button id="adf-switch-showrightsidebar" (click)="toggleShowRightSidebar()" color="primary">
<button mat-raised-button id="adf-switch-showrightsidebar" (click)="toggleShowRightSidebar()"
color="primary">
Toggle Right Sidebar
</button>
</p>
<p class="toggle">
<button mat-raised-button id="adf-switch-showleftsidebar" (click)="hideLeftSidebar()" color="primary">
<button mat-raised-button id="adf-switch-showleftsidebar" (click)="hideLeftSidebar()"
color="primary">
Hide Left Sidebar
</button>
</p>
@@ -314,6 +316,7 @@
</ng-template>
<adf-viewer
[blobFile]="content"
[nodeId]="nodeId"
[showRightSidebar]="showRightSidebar"
[showLeftSidebar]="showLeftSidebar"
@@ -325,6 +328,7 @@
[allowRightSidebar]="allowRightSidebar"
[allowLeftSidebar]="allowLeftSidebar"
[urlFile]="urlFile"
(showViewerChange)="onViewerVisibilityChanged($event)"
[sidebarLeftTemplate]="sidebarLeftTemplate"
[sidebarRightTemplate]="sidebarRightTemplate">

16
demo-shell/src/app/components/file-view/file-view.component.ts
View File

@@ -16,9 +16,10 @@
*/
import { Component, OnInit, ViewEncapsulation } from '@angular/core';
import { ActivatedRoute, Router } from '@angular/router';
import { ActivatedRoute, Router, PRIMARY_OUTLET } from '@angular/router';
import { ContentService, AllowableOperationsEnum, PermissionsEnum, NodesApiService } from '@alfresco/adf-core';
import { MatSnackBar } from '@angular/material';
import { PreviewService } from '../../services/preview.service';
@Component({
selector: 'app-file-view',
@@ -57,12 +58,15 @@ export class FileViewComponent implements OnInit {
showTabWithIconAndLabel = false;
desiredAspect: string = null;
showAspect: string = null;
content: Blob;
name: string;
constructor(private router: Router,
private route: ActivatedRoute,
private snackBar: MatSnackBar,
private nodeApiService: NodesApiService,
private contentServices: ContentService) {
private contentServices: ContentService,
private preview: PreviewService) {
}
ngOnInit() {
@@ -81,10 +85,18 @@ export class FileViewComponent implements OnInit {
},
() => this.router.navigate(['/files', id])
);
} else if (this.preview.content) {
this.content = this.preview.content;
this.displayName = this.preview.name;
}
});
}
onViewerVisibilityChanged() {
const primaryUrl = this.router.parseUrl(this.router.url).root.children[PRIMARY_OUTLET].toString();
this.router.navigateByUrl(primaryUrl);
}
onUploadError(errorMessage: string) {
this.snackBar.open(errorMessage, '', { duration: 4000 });
}

7
e2e/core/viewer/viewer-content-services-component.e2e.ts
View File

@@ -401,4 +401,11 @@ describe('Content Services Viewer', () => {
viewerPage.clickCloseButton();
});
it('[C307985] Should close the viewer when password dialog is cancelled', () => {
viewerPage.viewFile(protectedFile.name);
viewerPage.checkPasswordDialogIsDisplayed();
viewerPage.clickClosePasswordDialog();
contentServicesPage.checkContentIsDisplayed(protectedFile.name);
});
});

6
e2e/pages/adf/viewerPage.ts
View File

@@ -50,6 +50,7 @@ export class ViewerPage {
lastThumbnailDisplayed = element.all(by.css('adf-pdf-thumb')).last();
passwordDialog = element(by.css('adf-pdf-viewer-password-dialog'));
passwordSubmit = element(by.css('button[data-automation-id="adf-password-dialog-submit"]'));
passwordDialogClose = element(by.css('button[data-automation-id="adf-password-dialog-close"]'));
passwordSubmitDisabled = element(by.css('button[data-automation-id="adf-password-dialog-submit"][disabled]'));
passwordInput = element(by.css('input[data-automation-id="adf-password-dialog-input"]'));
passwordError = element(by.css('mat-error[data-automation-id="adf-password-dialog-error"]'));
@@ -149,6 +150,11 @@ export class ViewerPage {
BrowserVisibility.waitUntilElementIsVisible(this.pdfPageLoaded, 30000, `not loaded ${fileName}`);
}
clickClosePasswordDialog() {
BrowserVisibility.waitUntilElementIsVisible(this.passwordDialogClose);
this.passwordDialogClose.click();
}
checkImgViewerIsDisplayed() {
BrowserVisibility.waitUntilElementIsOnPage(this.imgViewer);
}

7
e2e/process-services/task-attachmentList-actionMenu.e2e.ts
View File

@@ -101,15 +101,11 @@ describe('Attachment list action menu for tasks', () => {
viewerPage.checkFileNameIsDisplayed(pngFile.name);
viewerPage.clickCloseButton();
taskPage.filtersPage().goToFilter(CONSTANTS.TASK_FILTERS.MY_TASKS);
attachmentListPage.doubleClickFile(pngFile.name);
viewerPage.checkFileNameIsDisplayed(pngFile.name);
viewerPage.clickCloseButton();
taskPage.filtersPage().goToFilter(CONSTANTS.TASK_FILTERS.MY_TASKS);
attachmentListPage.downloadFile(pngFile.name);
browser.driver.sleep(1000);
@@ -139,9 +135,6 @@ describe('Attachment list action menu for tasks', () => {
viewerPage.checkFileNameIsDisplayed(pngFile.name);
viewerPage.clickCloseButton();
taskPage.filtersPage().goToFilter(CONSTANTS.TASK_FILTERS.COMPLETED_TASKS);
taskPage.tasksListPage().selectRow(taskName.completed);
attachmentListPage.downloadFile(pngFile.name);
browser.driver.sleep(1000);

61
lib/core/services/previous-route.service.spec.ts
View File

@@ -1,61 +0,0 @@
/*!
* @license
* Copyright 2019 Alfresco Software, Ltd.
*
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
*/
import { TestBed } from '@angular/core/testing';
import { setupTestBed } from '../testing/setupTestBed';
import { PreviousRouteService } from './previous-route.service';
import { Router, NavigationEnd } from '@angular/router';
import { Observable } from 'rxjs';
import { CoreTestingModule } from 'core/testing/core.testing.module';
class MockRouter {
firstUrl = new NavigationEnd(0, '/files', '/files');
secondUrl = new NavigationEnd(0, '/home', '/home');
events = new Observable((observer) => {
observer.next(this.firstUrl);
observer.next(this.secondUrl);
observer.complete();
});
}
describe('Previous route service ', () => {
let previousRouteService: PreviousRouteService;
setupTestBed({
imports: [
CoreTestingModule
],
providers: [
{ provide: Router, useClass: MockRouter },
PreviousRouteService
]
});
beforeEach(() => {
previousRouteService = TestBed.get(PreviousRouteService);
});
it('should be able to create the service', () => {
expect(previousRouteService).not.toBeNull();
expect(previousRouteService).toBeDefined();
});
it('should set curent url when new page loads', () => {
expect(previousRouteService.getPreviousUrl()).toBe('/files');
});
});

42
lib/core/services/previous-route.service.ts
View File

@@ -1,42 +0,0 @@
/*!
* @license
* Copyright 2019 Alfresco Software, Ltd.
*
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
*/
import { Injectable } from '@angular/core';
import { Router, NavigationEnd } from '@angular/router';
@Injectable({
providedIn: 'root'
})
export class PreviousRouteService {
private previousUrl: string;
private currentUrl: string;
constructor(private router: Router) {
this.currentUrl = this.router.url;
this.router.events.subscribe((event) => {
if (event instanceof NavigationEnd) {
this.previousUrl = this.currentUrl;
this.currentUrl = event.url;
}
});
}
public getPreviousUrl(): string {
return this.previousUrl;
}
}

1
lib/core/services/public-api.ts
View File

@@ -55,5 +55,4 @@ export * from './jwt-helper.service';
export * from './download-zip.service';
export * from './lock.service';
export * from './automation.service';
export * from './previous-route.service';
export * from './automation.service';

2
lib/core/viewer/components/pdfViewer-password-dialog.html
View File

@@ -19,7 +19,7 @@
<mat-dialog-actions class="adf-dialog-buttons">
<span class="adf-fill-remaining-space"></span>
<button mat-button mat-dialog-close>{{ 'ADF_VIEWER.PDF_DIALOG.CLOSE' | translate }}</button>
<button mat-button mat-dialog-close data-automation-id='adf-password-dialog-close'>{{ 'ADF_VIEWER.PDF_DIALOG.CLOSE' | translate }}</button>
<button mat-button
data-automation-id='adf-password-dialog-submit'

40
lib/core/viewer/components/pdfViewer.component.spec.ts
View File

@@ -331,6 +331,7 @@ describe('Test PdfViewer component', () => {
let fixtureUrlTestPasswordComponent: ComponentFixture<UrlTestPasswordComponent>;
let componentUrlTestPasswordComponent: UrlTestPasswordComponent;
describe('Open password dialog', () => {
beforeEach((done) => {
fixtureUrlTestPasswordComponent = TestBed.createComponent(UrlTestPasswordComponent);
componentUrlTestPasswordComponent = fixtureUrlTestPasswordComponent.componentInstance;
@@ -393,6 +394,45 @@ describe('Test PdfViewer component', () => {
});
});
describe('Close password dialog ', () => {
beforeEach((done) => {
fixtureUrlTestPasswordComponent = TestBed.createComponent(UrlTestPasswordComponent);
componentUrlTestPasswordComponent = fixtureUrlTestPasswordComponent.componentInstance;
spyOn(dialog, 'open').and.callFake(() => {
return {
afterClosed: () => {
done();
return of('');
}
};
});
spyOn(componentUrlTestPasswordComponent.pdfViewerComponent.close, 'emit');
fixtureUrlTestPasswordComponent.detectChanges();
componentUrlTestPasswordComponent.pdfViewerComponent.rendered.subscribe(() => {
done();
});
});
afterEach(() => {
document.body.removeChild(fixtureUrlTestPasswordComponent.nativeElement);
});
it('should try to access protected pdf', (done) => {
fixture.detectChanges();
fixture.whenStable().then(() => {
fixture.detectChanges();
expect(componentUrlTestPasswordComponent.pdfViewerComponent.close.emit).toHaveBeenCalledWith();
done();
});
});
});
});
describe('User interaction', () => {
let fixtureUrlTestComponent: ComponentFixture<UrlTestComponent>;

10
lib/core/viewer/components/pdfViewer.component.ts
View File

@@ -79,6 +79,9 @@ export class PdfViewerComponent implements OnChanges, OnDestroy {
@Output()
error = new EventEmitter<any>();
@Output()
close = new EventEmitter<any>();
loadingTask: any;
currentPdfDocument: any;
page: number;
@@ -188,11 +191,11 @@ export class PdfViewerComponent implements OnChanges, OnDestroy {
this.currentPdfDocument.getPage(1).then(() => {
this.scalePage('auto');
}, (error) => {
}, () => {
this.error.emit();
});
}, (error) => {
}, () => {
this.error.emit();
});
}
@@ -461,12 +464,13 @@ export class PdfViewerComponent implements OnChanges, OnDestroy {
this.dialog
.open(PdfPasswordDialogComponent, {
width: '400px',
disableClose: true,
data: { reason }
})
.afterClosed().subscribe((password) => {
if (password) {
callback(password);
} else {
this.close.emit();
}
});
}

2
lib/core/viewer/components/viewer.component.html
View File

@@ -171,7 +171,7 @@
<div class="adf-viewer-content-container" [ngSwitch]="viewerType">
<ng-container *ngSwitchCase="'pdf'">
<adf-pdf-viewer [thumbnailsTemplate]="thumbnailsTemplate" [allowThumbnails]="allowThumbnails" [blobFile]="blobFile" [urlFile]="urlFileContent" [nameFile]="displayName"></adf-pdf-viewer>
<adf-pdf-viewer (close)="onBackButtonClick()" [thumbnailsTemplate]="thumbnailsTemplate" [allowThumbnails]="allowThumbnails" [blobFile]="blobFile" [urlFile]="urlFileContent" [nameFile]="displayName"></adf-pdf-viewer>
</ng-container>
<ng-container *ngSwitchCase="'image'">

27
lib/core/viewer/components/viewer.component.spec.ts
View File

@@ -23,16 +23,14 @@ import { AlfrescoApiService, RenditionsService } from '../../services';
import { CoreModule } from '../../core.module';
import { throwError, Observable } from 'rxjs';
import { throwError } from 'rxjs';
import { EventMock } from '../../mock/event.mock';
import { RenderingQueueServices } from '../services/rendering-queue.services';
import { ViewerComponent } from './viewer.component';
import { setupTestBed } from '../../testing/setupTestBed';
import { AlfrescoApiServiceMock } from '../../mock/alfresco-api.service.mock';
import { NodeEntry } from '@alfresco/js-api';
import { PreviousRouteService } from 'core/services/previous-route.service';
import { RouterTestingModule } from '@angular/router/testing';
import { Router, NavigationEnd } from '@angular/router';
@Component({
selector: 'adf-viewer-container-toolbar',
@@ -123,22 +121,11 @@ class ViewerWithCustomOpenWithComponent {
class ViewerWithCustomMoreActionsComponent {
}
class MockRouter {
navigate = jasmine.createSpy('navigate');
firstUrl = new NavigationEnd(0, '/files', '/files');
events = new Observable((observer) => {
observer.next(this.firstUrl);
observer.complete();
});
}
describe('ViewerComponent', () => {
let component: ViewerComponent;
let fixture: ComponentFixture<ViewerComponent>;
let alfrescoApiService: AlfrescoApiService;
let previousRouteService: PreviousRouteService;
let router: Router;
let element: HTMLElement;
setupTestBed({
@@ -162,9 +149,7 @@ describe('ViewerComponent', () => {
}
}
},
{ provide: Router, useClass: MockRouter },
RenderingQueueServices,
PreviousRouteService,
{ provide: Location, useClass: SpyLocation }
]
});
@@ -175,8 +160,6 @@ describe('ViewerComponent', () => {
component = fixture.componentInstance;
alfrescoApiService = TestBed.get(AlfrescoApiService);
previousRouteService = TestBed.get(PreviousRouteService);
router = TestBed.get(Router);
});
describe('Extension Type Test', () => {
@@ -661,9 +644,9 @@ describe('ViewerComponent', () => {
});
});
it('should go back when back button is clicked', async(() => {
it('should emit `showViewerChange` event on close', async(() => {
spyOn(previousRouteService, 'getPreviousUrl').and.returnValue('home');
spyOn(component.showViewerChange, 'emit');
const button: HTMLButtonElement = element.querySelector('[data-automation-id="adf-toolbar-back"]') as HTMLButtonElement;
button.click();
@@ -671,11 +654,11 @@ describe('ViewerComponent', () => {
fixture.detectChanges();
fixture.whenStable().then(() => {
fixture.detectChanges();
expect(router.navigate).toHaveBeenCalled();
expect(component.showViewerChange.emit).toHaveBeenCalled();
});
}));
it('should render close viewer button if it is a shared link', (done) => {
it('should not render close viewer button if it is a shared link', (done) => {
spyOn(alfrescoApiService.getInstance().core.sharedlinksApi, 'getSharedLink')
.and.returnValue(Promise.reject({}));

25
lib/core/viewer/components/viewer.component.ts
View File

@@ -15,7 +15,6 @@
* limitations under the License.
*/
import { Location } from '@angular/common';
import {
Component, ContentChild, EventEmitter, HostListener, ElementRef,
Input, OnChanges, Output, SimpleChanges, TemplateRef,
@@ -25,7 +24,6 @@ import { RenditionPaging, SharedLinkEntry, Node, RenditionEntry, NodeEntry } fro
import { BaseEvent } from '../../events';
import { AlfrescoApiService } from '../../services/alfresco-api.service';
import { LogService } from '../../services/log.service';
import { PreviousRouteService } from '../../services/previous-route.service';
import { ViewerMoreActionsComponent } from './viewer-more-actions.component';
import { ViewerOpenWithComponent } from './viewer-open-with.component';
import { ViewerSidebarComponent } from './viewer-sidebar.component';
@@ -33,7 +31,6 @@ import { ViewerToolbarComponent } from './viewer-toolbar.component';
import { Subscription } from 'rxjs';
import { ViewUtilService } from '../services/view-util.service';
import { AppExtensionService, ViewerExtensionRef } from '@alfresco/adf-extensions';
import { Router } from '@angular/router';
@Component({
selector: 'adf-viewer',
@@ -98,6 +95,7 @@ export class ViewerComponent implements OnChanges, OnInit, OnDestroy {
@Input()
displayName: string;
/** @deprecated 3.2.0 */
/** Allows `back` navigation */
@Input()
allowGoBack = true;
@@ -239,11 +237,8 @@ export class ViewerComponent implements OnChanges, OnInit, OnDestroy {
constructor(private apiService: AlfrescoApiService,
private viewUtils: ViewUtilService,
private logService: LogService,
private location: Location,
private extensionService: AppExtensionService,
private el: ElementRef,
private router: Router,
private previousRouteService: PreviousRouteService) {
private el: ElementRef) {
}
isSourceDefined(): boolean {
@@ -477,23 +472,7 @@ export class ViewerComponent implements OnChanges, OnInit, OnDestroy {
}
onBackButtonClick() {
if (this.overlayMode) {
this.close();
} else {
const event = new BaseEvent<any>();
this.goBack.next(event);
if (!event.defaultPrevented) {
const previousUrl = this.previousRouteService.getPreviousUrl();
if (previousUrl && previousUrl.includes('login') || window.history.length <= 2) {
this.router.navigate([{outlets: {overlay: null, primary: ['home']}}]);
} else {
this.location.back();
}
}
}
}
onNavigateBeforeClick() {