diff --git a/app/src/app/content-plugin/store/effects/upload.effects.spec.ts b/app/src/app/content-plugin/store/effects/upload.effects.spec.ts index 3e407e043..72e928f91 100644 --- a/app/src/app/content-plugin/store/effects/upload.effects.spec.ts +++ b/app/src/app/content-plugin/store/effects/upload.effects.spec.ts @@ -30,7 +30,7 @@ import { UploadEffects } from './upload.effects'; import { AppTestingModule } from '../../testing/app-testing.module'; import { NgZone } from '@angular/core'; import { UploadService, FileUploadCompleteEvent, FileModel } from '@alfresco/adf-core'; -import { UnlockWriteAction, UploadFileVersionAction } from '@alfresco/aca-shared/store'; +import { UnlockWriteAction, UploadFilesAction, UploadFileVersionAction, UploadFolderAction } from '@alfresco/aca-shared/store'; import { ContentManagementService } from '../../services/content-management.service'; describe('UploadEffects', () => { @@ -59,6 +59,80 @@ describe('UploadEffects', () => { spyOn(effects, 'uploadVersion').and.callThrough(); }); + describe('uploadFiles$', () => { + let createMenuButton: HTMLButtonElement; + const focusedClass = 'cdk-program-focused'; + + beforeEach(() => { + createMenuButton = document.createElement('button'); + document.body.appendChild(createMenuButton); + store.dispatch(new UploadFilesAction({})); + spyOn(document, 'querySelector').withArgs('app-create-menu button').and.returnValue(createMenuButton); + }); + + it('should call focus function on create menu button', () => { + spyOn(createMenuButton, 'focus'); + window.dispatchEvent(new FocusEvent('focus')); + expect(createMenuButton.focus).toHaveBeenCalledWith(); + }); + + it('should not call focus function on create menu button if handler for focus of window is not fired', () => { + spyOn(createMenuButton, 'focus'); + expect(createMenuButton.focus).not.toHaveBeenCalled(); + }); + + it('should add cdk-program-focused class to create menu button', () => { + window.dispatchEvent(new FocusEvent('focus')); + createMenuButton.dispatchEvent(new FocusEvent('focus')); + expect(createMenuButton).toHaveClass(focusedClass); + }); + + it('should not add cdk-program-focused class to create menu button if handler for focus of window is not fired', () => { + expect(createMenuButton).not.toHaveClass(focusedClass); + }); + + afterEach(() => { + createMenuButton.remove(); + }); + }); + + describe('uploadFolder$', () => { + let createMenuButton: HTMLButtonElement; + const focusedClass = 'cdk-program-focused'; + + beforeEach(() => { + createMenuButton = document.createElement('button'); + document.body.appendChild(createMenuButton); + store.dispatch(new UploadFolderAction({})); + spyOn(document, 'querySelector').withArgs('app-create-menu button').and.returnValue(createMenuButton); + }); + + it('should call focus function on create menu button', () => { + spyOn(createMenuButton, 'focus'); + window.dispatchEvent(new FocusEvent('focus')); + expect(createMenuButton.focus).toHaveBeenCalledWith(); + }); + + it('should not call focus function on create menu button if handler for focus of window is not fired', () => { + spyOn(createMenuButton, 'focus'); + expect(createMenuButton.focus).not.toHaveBeenCalled(); + }); + + it('should add cdk-program-focused class to create menu button', () => { + window.dispatchEvent(new FocusEvent('focus')); + createMenuButton.dispatchEvent(new FocusEvent('focus')); + expect(createMenuButton).toHaveClass(focusedClass); + }); + + it('should not add cdk-program-focused class to create menu button if handler for focus of window is not fired', () => { + expect(createMenuButton).not.toHaveClass(focusedClass); + }); + + afterEach(() => { + createMenuButton.remove(); + }); + }); + describe('uploadAndUnlock()', () => { it('should not upload and unlock file if param not provided', () => { effects.uploadAndUnlock(null); diff --git a/app/src/app/content-plugin/store/effects/upload.effects.ts b/app/src/app/content-plugin/store/effects/upload.effects.ts index 08536292b..c06fce6cc 100644 --- a/app/src/app/content-plugin/store/effects/upload.effects.ts +++ b/app/src/app/content-plugin/store/effects/upload.effects.ts @@ -90,6 +90,7 @@ export class UploadEffects { this.actions$.pipe( ofType(UploadActionTypes.UploadFiles), map(() => { + this.registerFocusingCreateMenuButton(this.fileInput); this.fileInput.click(); }) ), @@ -101,6 +102,7 @@ export class UploadEffects { this.actions$.pipe( ofType(UploadActionTypes.UploadFolder), map(() => { + this.registerFocusingCreateMenuButton(this.folderInput); this.folderInput.click(); }) ), @@ -196,4 +198,28 @@ export class UploadEffects { }); }); } + + private registerFocusingCreateMenuButton(input: HTMLInputElement): void { + input.addEventListener( + 'click', + () => { + window.addEventListener( + 'focus', + () => { + const createMenuButton = document.querySelector('app-create-menu button'); + createMenuButton.addEventListener('focus', () => createMenuButton.classList.add('cdk-program-focused'), { + once: true + }); + createMenuButton.focus(); + }, + { + once: true + } + ); + }, + { + once: true + } + ); + } }