[ADF-1754] - Viewer's displayName property (#2559)

* [ADF-1754] - Viewer's displayName property

Fixed

Added Unit tests for verifying the fix

* resetting file-view component initial properties

* fixing unit test for the case when  fileNodeId is not null
small refactoring

ng2-components/ng2-alfresco-viewer/src/components/viewer.component.html

@@ -17,7 +17,7 @@
                         <mat-icon>arrow_back</mat-icon>
                     </button>
                     <img class="adf-viewer__mimeicon" [src]="mimeType | adfMimeTypeIcon">
-                    <span>{{ displayName }}</span>
+                    <span id="adf-viewer-display-name">{{ displayName }}</span>
                 </adf-toolbar-title>
 
                 <ng-container *ngIf="mnuOpenWith">

ng2-components/ng2-alfresco-viewer/src/components/viewer.component.spec.ts

@@ -20,9 +20,11 @@ import { SpyLocation } from '@angular/common/testing';
 import { Component, DebugElement } from '@angular/core';
 import { async, ComponentFixture, TestBed } from '@angular/core/testing';
 
-import { CoreModule } from 'ng2-alfresco-core';
+import { CoreModule, RenditionsService } from 'ng2-alfresco-core';
 import { MaterialModule } from './../material.module';
 
+import { AlfrescoApiService } from 'ng2-alfresco-core';
+import { Observable } from 'rxjs/Rx';
 import { EventMock } from '../assets/event.mock';
 import { RenderingQueueServices } from '../services/rendering-queue.services';
 import { ImgViewerComponent } from './imgViewer.component';
@@ -113,6 +115,7 @@ describe('ViewerComponent', () => {
     let component: ViewerComponent;
     let fixture: ComponentFixture<ViewerComponent>;
     let debug: DebugElement;
+    let alfrescoApiService: AlfrescoApiService;
     let element: HTMLElement;
 
     beforeEach(async(() => {
@@ -138,6 +141,12 @@ describe('ViewerComponent', () => {
                 ViewerWithCustomMoreActionsComponent
             ],
             providers: [
+                {provide: RenditionsService, useValue: {
+                    getRendition: () => {
+                        return Observable.throw('throwed');
+                    }
+                }},
+                AlfrescoApiService,
                 RenderingQueueServices,
                 { provide: Location, useClass: SpyLocation }
             ]
@@ -153,6 +162,8 @@ describe('ViewerComponent', () => {
 
         jasmine.Ajax.install();
 
+        alfrescoApiService = TestBed.get(AlfrescoApiService);
+
         component.showToolbar = true;
         component.urlFile = 'base/src/assets/fake-test-file.pdf';
         component.mimeType = 'application/pdf';
@@ -582,4 +593,89 @@ describe('ViewerComponent', () => {
             component.ngOnChanges(null);
         });
     });
+
+    describe('display name property override by urlFile', () => {
+        it('should displayName override the default name if is present and urlFile is set' , (done) => {
+            component.urlFile = 'base/src/assets/fake-test-file.pdf';
+            component.displayName = 'test name';
+
+            component.ngOnChanges(null).then(() => {
+                fixture.detectChanges();
+                expect(element.querySelector('#adf-viewer-display-name').textContent).toEqual('test name');
+                done();
+            });
+        });
+
+        it('should use the urlFile name if displayName is NOT set and urlFile is set' , (done) => {
+            component.urlFile = 'base/src/assets/fake-test-file.pdf';
+            component.displayName = null;
+
+            component.ngOnChanges(null).then(() => {
+                fixture.detectChanges();
+                expect(element.querySelector('#adf-viewer-display-name').textContent).toEqual('fake-test-file.pdf');
+                done();
+            });
+        });
+    });
+
+    describe('display name property override by blobFile', () => {
+        it('should displayName override the name if is present and blobFile is set' , (done) => {
+            component.displayName = 'blob file display name';
+            component.blobFile = new Blob(['This is my blob content'], {type : 'text/plain'});
+
+            component.ngOnChanges(null).then(() => {
+                fixture.detectChanges();
+                expect(element.querySelector('#adf-viewer-display-name').textContent).toEqual('blob file display name');
+                done();
+            });
+        });
+
+        it('should show uknownn name if displayName is NOT set and blobFile is set' , (done) => {
+            component.displayName = null;
+            component.blobFile = new Blob(['This is my blob content'], {type : 'text/plain'});
+
+            component.ngOnChanges(null).then(() => {
+                fixture.detectChanges();
+                expect(element.querySelector('#adf-viewer-display-name').textContent).toEqual('Unknown');
+                done();
+            });
+        });
+    });
+
+    describe('display name property override by nodeId', () => {
+        const displayName = 'the-name';
+        const nodeDetails = { name: displayName, id: '12', content: { mimeType: 'txt' }};
+        const contentUrl = '/content/url/path';
+        const alfrescoApiInstanceMock = {
+            nodes: { getNodeInfo: () => Promise.resolve(nodeDetails) },
+            content: { getContentUrl: () => contentUrl }
+        };
+
+        it('should use the displayName if displayName is set and fileNodeId is set' , (done) => {
+            const userDefinedDisplayName = 'user defined display name';
+            component.fileNodeId = '12';
+            component.urlFile = null;
+            component.displayName = userDefinedDisplayName;
+
+            spyOn(alfrescoApiService, 'getInstance').and.returnValue(alfrescoApiInstanceMock);
+            component.ngOnChanges(null).then(() => {
+                fixture.detectChanges();
+                expect(element.querySelector('#adf-viewer-display-name').textContent).toEqual(userDefinedDisplayName);
+                done();
+            });
+        });
+
+        it('should use the node name if displayName is NOT set and fileNodeId is set' , (done) => {
+            component.fileNodeId = '12';
+            component.urlFile = null;
+            component.displayName = null;
+
+            spyOn(alfrescoApiService, 'getInstance').and.returnValue(alfrescoApiInstanceMock);
+            component.ngOnChanges(null).then(() => {
+                fixture.detectChanges();
+                expect(element.querySelector('#adf-viewer-display-name').textContent).toEqual(displayName);
+                done();
+            });
+        });
+    });
 });

ng2-components/ng2-alfresco-viewer/src/components/viewer.component.ts

@@ -68,7 +68,7 @@ export class ViewerComponent implements OnDestroy, OnChanges {
     showToolbar = true;
 
     @Input()
-    displayName = 'Unknown';
+    displayName: string;
 
     @Input()
     allowGoBack = true;
@@ -144,8 +144,8 @@ export class ViewerComponent implements OnDestroy, OnChanges {
 
             return new Promise((resolve, reject) => {
                 if (this.blobFile) {
+                    this.displayName = this.getDisplayName('Unknown');
                     this.isLoading = true;
-
                     this.mimeType = this.blobFile.type;
                     this.viewerType = this.getViewerTypeByMimeType(this.mimeType);
 
@@ -159,7 +159,7 @@ export class ViewerComponent implements OnDestroy, OnChanges {
                 } else if (this.urlFile) {
                     this.isLoading = true;
                     let filenameFromUrl = this.getFilenameFromUrl(this.urlFile);
-                    this.displayName = filenameFromUrl || 'Unknown';
+                    this.displayName = this.getDisplayName(filenameFromUrl);
                     this.extension = this.getFileExtension(filenameFromUrl);
                     this.urlFileContent = this.urlFile;
 
@@ -180,7 +180,7 @@ export class ViewerComponent implements OnDestroy, OnChanges {
                     this.apiService.getInstance().nodes.getNodeInfo(this.fileNodeId).then(
                         (data: MinimalNodeEntryEntity) => {
                             this.mimeType = data.content.mimeType;
-                            this.displayName = data.name;
+                            this.displayName = this.getDisplayName( data.name);
                             this.urlFileContent = this.apiService.getInstance().content.getContentUrl(data.id);
                             this.extension = this.getFileExtension(data.name);
 
@@ -213,6 +213,10 @@ export class ViewerComponent implements OnDestroy, OnChanges {
         }
     }
 
+    private getDisplayName(name) {
+        return this.displayName || name;
+    }
+
     scrollTop() {
         window.scrollTo(0, 1);
     }