AAE-35649 Fix missing spinner when loading in ViewerRenderComponent

This commit is contained in:
Wojciech Duda
2025-06-09 18:23:56 +02:00
parent ac14541c2e
commit 9f68dc3f39
4 changed files with 39 additions and 9 deletions

View File

@@ -257,7 +257,10 @@ export class PdfViewerComponent implements OnChanges, OnDestroy {
.then(() => { .then(() => {
setTimeout(() => this.scalePage('init')); setTimeout(() => this.scalePage('init'));
}) })
.catch(() => this.error.emit()); .catch((e) => {
console.error(e);
this.error.emit();
});
}); });
} }

View File

@@ -1,15 +1,17 @@
<div *ngIf="isLoading" class="adf-viewer-render-main-loader"> @if (isLoading || isFileLoading) {
<div class="adf-viewer-render-layout-content adf-viewer__fullscreen-container"> <div class="adf-viewer-render-main-loader">
<div class="adf-viewer-render-content-container"> <div class="adf-viewer-render-layout-content adf-viewer__fullscreen-container">
<div class="adf-viewer-render__loading-screen"> <div class="adf-viewer-render-content-container">
<h2>{{ 'ADF_VIEWER.LOADING' | translate }}</h2> <div class="adf-viewer-render__loading-screen">
<div> <h2>{{ 'ADF_VIEWER.LOADING' | translate }}</h2>
<mat-spinner class="adf-viewer-render__loading-screen__spinner" /> <div>
<mat-spinner class="adf-viewer-render__loading-screen__spinner" />
</div>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
</div> }
@if (urlFile || blobFile) { @if (urlFile || blobFile) {
<div [hidden]="isLoading" class="adf-viewer-render-main"> <div [hidden]="isLoading" class="adf-viewer-render-main">

View File

@@ -489,6 +489,12 @@ describe('ViewerComponent', () => {
expect(getMainLoader()).not.toBeNull(); expect(getMainLoader()).not.toBeNull();
}); });
it('should show spinner when isFileLoading is true', () => {
component.isFileLoading = true;
fixture.detectChanges();
expect(getMainLoader()).not.toBeNull();
});
it('should show spinner until content is ready when viewerType is media', () => { it('should show spinner until content is ready when viewerType is media', () => {
component.isLoading = false; component.isLoading = false;
component.urlFile = 'some-file.mp4'; component.urlFile = 'some-file.mp4';
@@ -545,5 +551,21 @@ describe('ViewerComponent', () => {
expect(getMainLoader()).toBeNull(); expect(getMainLoader()).toBeNull();
}); });
it('should not show spinner after url file is set', () => {
component.urlFile = 'some-url.txt';
component.ngOnChanges();
fixture.detectChanges();
expect(getMainLoader()).toBeNull();
});
it('should not show spinner after blob file is set', () => {
component.blobFile = new Blob(['This is my blob content'], { type: 'text/plain' });
component.ngOnChanges();
fixture.detectChanges();
expect(getMainLoader()).toBeNull();
});
}); });
}); });

View File

@@ -139,6 +139,7 @@ export class ViewerRenderComponent implements OnChanges, OnInit {
internalFileName: string; internalFileName: string;
viewerType: string = 'unknown'; viewerType: string = 'unknown';
isLoading = false; isLoading = false;
isFileLoading = false;
/** /**
* Returns a list of the active Viewer content extensions. * Returns a list of the active Viewer content extensions.
@@ -182,6 +183,8 @@ export class ViewerRenderComponent implements OnChanges, OnInit {
} }
ngOnChanges() { ngOnChanges() {
this.isFileLoading = !this.blobFile && !this.urlFile;
if (this.blobFile) { if (this.blobFile) {
this.setUpBlobData(); this.setUpBlobData();
} else if (this.urlFile) { } else if (this.urlFile) {