AAE-34641 form hangs on loading, fix unit tests

This commit is contained in:
Tomasz Nastaly 2025-05-12 13:48:54 +02:00
parent c2a152a974
commit 80f1bc063e
No known key found for this signature in database
GPG Key ID: 173905A29EEF5CFD
3 changed files with 19 additions and 11 deletions

View File

@ -15,7 +15,7 @@
</div> </div>
<div <div
*ngIf="viewerType === 'media' || viewerType === 'pdf' || viewerType === 'image' ? (!isLoading && isContentReady) : !isLoading" [hidden]="viewerType === 'media' || viewerType === 'pdf' || viewerType === 'image' ? (isLoading || !isContentReady) : isLoading"
class="adf-viewer-render-main" class="adf-viewer-render-main"
> >
<div class="adf-viewer-render-layout-content adf-viewer__fullscreen-container"> <div class="adf-viewer-render-layout-content adf-viewer__fullscreen-container">

View File

@ -24,7 +24,7 @@ import { MatDialog, MatDialogModule } from '@angular/material/dialog';
import { NoopTranslateModule, UnitTestingUtils } from '../../../testing'; import { NoopTranslateModule, UnitTestingUtils } from '../../../testing';
import { RenderingQueueServices } from '../../services/rendering-queue.services'; import { RenderingQueueServices } from '../../services/rendering-queue.services';
import { ViewerRenderComponent } from './viewer-render.component'; import { ViewerRenderComponent } from './viewer-render.component';
import { ImgViewerComponent, MediaPlayerComponent, ViewerExtensionDirective } from '@alfresco/adf-core'; import { ImgViewerComponent, MediaPlayerComponent, PdfViewerComponent, ViewerExtensionDirective } from '@alfresco/adf-core';
import { NoopAnimationsModule } from '@angular/platform-browser/animations'; import { NoopAnimationsModule } from '@angular/platform-browser/animations';
@Component({ @Component({
@ -504,22 +504,23 @@ describe('ViewerComponent', () => {
expect(getMainLoader()).toBeNull(); expect(getMainLoader()).toBeNull();
expect(component.viewerType).toBe('media'); expect(component.viewerType).toBe('media');
expect(component.isContentReady).toBeTrue();
}); });
// eslint-disable-next-line ban/ban it('should show spinner until content is ready when viewerType is pdf', () => {
xit('should show spinner until content is ready when viewerType is pdf', () => {
component.isLoading = false; component.isLoading = false;
component.urlFile = 'some-url.pdf'; component.urlFile = 'some-url.pdf';
expect(getMainLoader()).toBeNull();
component.ngOnChanges(); component.ngOnChanges();
fixture.detectChanges(); fixture.detectChanges();
expect(getMainLoader()).not.toBeNull(); const imgViewer = testingUtils.getByDirective(PdfViewerComponent);
imgViewer.triggerEventHandler('pagesLoaded', null);
fixture.detectChanges(); fixture.detectChanges();
expect(getMainLoader()).toBeNull();
expect(component.viewerType).toBe('pdf'); expect(component.viewerType).toBe('pdf');
expect(component.isContentReady).toBeTrue();
}); });
it('should show spinner until content is ready when viewerType is image', () => { it('should show spinner until content is ready when viewerType is image', () => {
@ -536,9 +537,10 @@ describe('ViewerComponent', () => {
expect(getMainLoader()).toBeNull(); expect(getMainLoader()).toBeNull();
expect(component.viewerType).toBe('image'); expect(component.viewerType).toBe('image');
expect(component.isContentReady).toBeTrue();
}); });
it('should not show spinner when isLoading = false and isContentReady = false for other viewer types', () => { it('should not show spinner and set isContentReady = true for other viewer types different than media/pdf/image', () => {
component.isLoading = false; component.isLoading = false;
component.urlFile = 'some-url.txt'; component.urlFile = 'some-url.txt';
@ -546,7 +548,7 @@ describe('ViewerComponent', () => {
fixture.detectChanges(); fixture.detectChanges();
expect(getMainLoader()).toBeNull(); expect(getMainLoader()).toBeNull();
expect(component.isContentReady).toBeFalse(); expect(component.isContentReady).toBeTrue();
}); });
}); });
}); });

View File

@ -185,16 +185,22 @@ export class ViewerRenderComponent implements OnChanges, OnInit {
} }
ngOnChanges() { ngOnChanges() {
this.isContentReady = !(this.viewerType === 'media' || this.viewerType === 'pdf' || this.viewerType === 'image'); this.checkIsLoaded();
this.isLoading = !this.blobFile && !this.urlFile;
if (this.blobFile) { if (this.blobFile) {
this.setUpBlobData(); this.setUpBlobData();
this.checkIsLoaded();
} else if (this.urlFile) { } else if (this.urlFile) {
this.setUpUrlFile(); this.setUpUrlFile();
this.checkIsLoaded();
} }
} }
private checkIsLoaded() {
this.isContentReady = !(this.viewerType === 'media' || this.viewerType === 'pdf' || this.viewerType === 'image');
this.isLoading = !this.blobFile && !this.urlFile;
}
private setUpBlobData() { private setUpBlobData() {
this.internalFileName = this.fileName; this.internalFileName = this.fileName;
this.viewerType = this.viewUtilService.getViewerTypeByMimeType(this.blobFile.type); this.viewerType = this.viewUtilService.getViewerTypeByMimeType(this.blobFile.type);