diff --git a/lib/content-services/i18n/en.json b/lib/content-services/i18n/en.json
index 0e7a953c72..425721b080 100644
--- a/lib/content-services/i18n/en.json
+++ b/lib/content-services/i18n/en.json
@@ -131,6 +131,7 @@
},
"ARIA-LABEL": {
"VERSION": "File version",
+ "DIALOG": "Upload list",
"DIALOG_MAXIMIZE": "Maximize upload dialog",
"DIALOG_MINIMIZE": "Minimize upload dialog",
"DIALOG_CLOSE": "Close upload dialog",
diff --git a/lib/content-services/upload/components/file-uploading-dialog.component.html b/lib/content-services/upload/components/file-uploading-dialog.component.html
index de1bc831e5..002c2a4ff1 100644
--- a/lib/content-services/upload/components/file-uploading-dialog.component.html
+++ b/lib/content-services/upload/components/file-uploading-dialog.component.html
@@ -1,5 +1,7 @@
diff --git a/lib/content-services/upload/components/file-uploading-dialog.component.spec.ts b/lib/content-services/upload/components/file-uploading-dialog.component.spec.ts
index d20270fdb5..a7154c8ff3 100644
--- a/lib/content-services/upload/components/file-uploading-dialog.component.spec.ts
+++ b/lib/content-services/upload/components/file-uploading-dialog.component.spec.ts
@@ -16,7 +16,7 @@
*/
import { EventEmitter } from '@angular/core';
-import { ComponentFixture, TestBed } from '@angular/core/testing';
+import { ComponentFixture, TestBed, fakeAsync, tick } from '@angular/core/testing';
import {
FileModel, FileUploadCompleteEvent, FileUploadErrorEvent, UploadService, setupTestBed, CoreModule, AlfrescoApiService, AlfrescoApiServiceMock, UserPreferencesService
} from '@alfresco/adf-core';
@@ -78,6 +78,16 @@ describe('FileUploadingDialogComponent', () => {
expect(component.isDialogActive).toBe(true);
});
+ it('should focus on dialog when uploading file', fakeAsync(() => {
+ uploadService.addToQueue(...fileList);
+ uploadService.uploadFilesInTheQueue(emitter);
+
+ fixture.detectChanges();
+ tick(100);
+
+ expect(document.activeElement.id).toBe('upload-dialog');
+ }));
+
it('should update uploading file list', () => {
uploadService.addToQueue(...fileList);
uploadService.uploadFilesInTheQueue(emitter);
diff --git a/lib/content-services/upload/components/file-uploading-dialog.component.ts b/lib/content-services/upload/components/file-uploading-dialog.component.ts
index bab4cc839d..64d50274ed 100644
--- a/lib/content-services/upload/components/file-uploading-dialog.component.ts
+++ b/lib/content-services/upload/components/file-uploading-dialog.component.ts
@@ -16,11 +16,11 @@
*/
import { FileModel, FileUploadStatus, UploadService, UserPreferencesService } from '@alfresco/adf-core';
-import { ChangeDetectorRef, Component, Input, Output, EventEmitter, OnDestroy, OnInit, ViewChild, HostBinding } from '@angular/core';
+import { ChangeDetectorRef, Component, Input, Output, EventEmitter, OnDestroy, OnInit, ViewChild, HostBinding, ElementRef } from '@angular/core';
import { Subscription, merge, Subject } from 'rxjs';
import { FileUploadingListComponent } from './file-uploading-list.component';
import { Direction } from '@angular/cdk/bidi';
-import { takeUntil } from 'rxjs/operators';
+import { takeUntil, delay } from 'rxjs/operators';
@Component({
selector: 'adf-file-uploading-dialog',
@@ -67,22 +67,34 @@ export class FileUploadingDialogComponent implements OnInit, OnDestroy {
private counterSubscription: Subscription;
private fileUploadSubscription: Subscription;
private errorSubscription: Subscription;
+ private dialogActive = new Subject();
constructor(
private uploadService: UploadService,
private changeDetector: ChangeDetectorRef,
- private userPreferencesService: UserPreferencesService
+ private userPreferencesService: UserPreferencesService,
+ private elementRef: ElementRef
) {
}
ngOnInit() {
+ this.dialogActive
+ .pipe(
+ delay(100),
+ takeUntil(this.onDestroy$)
+ )
+ .subscribe(() => {
+ this.elementRef.nativeElement.querySelector('#upload-dialog').focus();
+ });
+
this.listSubscription = this.uploadService.queueChanged
.pipe(takeUntil(this.onDestroy$))
.subscribe(fileList => {
this.filesUploadingList = fileList;
- if (this.filesUploadingList.length) {
+ if (this.filesUploadingList.length && !this.isDialogActive) {
this.isDialogActive = true;
+ this.dialogActive.next();
}
});