diff --git a/e2e/suites/actions-available/test-util.ts b/e2e/suites/actions-available/test-util.ts
index 0521848e0..f499df3ad 100644
--- a/e2e/suites/actions-available/test-util.ts
+++ b/e2e/suites/actions-available/test-util.ts
@@ -23,7 +23,7 @@
* along with Alfresco. If not, see .
*/
-import { BrowsingPage, Viewer, Utils } from '@alfresco/aca-testing-shared';
+import { BrowsingPage, Viewer, Utils, Menu } from '@alfresco/aca-testing-shared';
import { BrowserActions } from '@alfresco/adf-testing';
const page = new BrowsingPage();
@@ -31,6 +31,7 @@ const { dataTable, toolbar } = page;
const contextMenu = dataTable.menu;
const viewer = new Viewer();
const viewerToolbar = viewer.toolbar;
+const menu = new Menu();
export async function checkContextMenu(item: string, expectedContextMenu: string[]): Promise {
await dataTable.rightClickOnItem(item);
@@ -39,6 +40,7 @@ export async function checkContextMenu(item: string, expectedContextMenu: string
expect(actualActions).toEqual(expectedContextMenu);
await Utils.pressEscape();
+ await menu.waitForMenuToClose();
}
export async function checkToolbarPrimary(item: string, expectedToolbarPrimary: string[]): Promise {
@@ -80,6 +82,7 @@ export async function checkMultipleSelContextMenu(items: string[], expectedConte
expect(actualActions).toEqual(expectedContextMenu);
await Utils.pressEscape();
+ await menu.waitForMenuToClose();
}
export async function checkMultipleSelToolbarPrimary(items: string[], expectedToolbarPrimary: string[]): Promise {
@@ -122,6 +125,7 @@ export async function checkViewerActions(item: string, expectedToolbarPrimary: s
expect(actualMoreActions).toEqual(expectedToolbarMore);
await Utils.pressEscape();
+ await menu.waitForMenuToClose();
}
const toRemove = ['Close', 'Previous File', 'Next File', 'View details'];
diff --git a/projects/aca-shared/src/lib/components/tool-bar/toolbar-menu/toolbar-menu.component.html b/projects/aca-shared/src/lib/components/tool-bar/toolbar-menu/toolbar-menu.component.html
index 4d53ce246..0de97258e 100644
--- a/projects/aca-shared/src/lib/components/tool-bar/toolbar-menu/toolbar-menu.component.html
+++ b/projects/aca-shared/src/lib/components/tool-bar/toolbar-menu/toolbar-menu.component.html
@@ -5,6 +5,7 @@
[attr.aria-label]="actionRef.description || actionRef.title | translate"
[attr.title]="actionRef.description || actionRef.title | translate"
[matMenuTriggerFor]="menu"
+ #matTrigger="matMenuTrigger"
>
@@ -13,10 +14,7 @@
-
+
diff --git a/projects/aca-shared/src/lib/components/tool-bar/toolbar-menu/toolbar-menu.component.spec.ts b/projects/aca-shared/src/lib/components/tool-bar/toolbar-menu/toolbar-menu.component.spec.ts
index 476a92101..853ff5f20 100644
--- a/projects/aca-shared/src/lib/components/tool-bar/toolbar-menu/toolbar-menu.component.spec.ts
+++ b/projects/aca-shared/src/lib/components/tool-bar/toolbar-menu/toolbar-menu.component.spec.ts
@@ -24,9 +24,39 @@
*/
import { ToolbarMenuComponent } from './toolbar-menu.component';
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+import { MaterialModule } from '@alfresco/adf-core';
+import { OverlayModule } from '@angular/cdk/overlay';
+import { TranslateModule, TranslateLoader, TranslateFakeLoader } from '@ngx-translate/core';
+import { ContentActionRef } from '@alfresco/adf-extensions';
describe('ToolbarMenuComponent', () => {
- it('should be defined', () => {
- expect(ToolbarMenuComponent).toBeDefined();
+ let fixture: ComponentFixture;
+ let component: ToolbarMenuComponent;
+
+ const actions = { id: 'action-1', type: 'button' } as ContentActionRef;
+
+ beforeEach(() => {
+ TestBed.configureTestingModule({
+ imports: [
+ MaterialModule,
+ OverlayModule,
+ TranslateModule.forRoot({
+ loader: { provide: TranslateLoader, useClass: TranslateFakeLoader }
+ })
+ ]
+ });
+ fixture = TestBed.createComponent(ToolbarMenuComponent);
+ component = fixture.componentInstance;
+ component.matTrigger = jasmine.createSpyObj('MatMenuTrigger', ['closeMenu']);
+ component.actionRef = actions;
+ fixture.detectChanges();
+ });
+
+ it('should close toolbar context menu', () => {
+ spyOn(component.matTrigger, 'closeMenu');
+ document.dispatchEvent(new KeyboardEvent('keydown', { key: 'Escape' }));
+ fixture.detectChanges();
+ expect(component.matTrigger.closeMenu).toHaveBeenCalled();
});
});
diff --git a/projects/aca-shared/src/lib/components/tool-bar/toolbar-menu/toolbar-menu.component.ts b/projects/aca-shared/src/lib/components/tool-bar/toolbar-menu/toolbar-menu.component.ts
index 4e78b1e07..142cee9d7 100644
--- a/projects/aca-shared/src/lib/components/tool-bar/toolbar-menu/toolbar-menu.component.ts
+++ b/projects/aca-shared/src/lib/components/tool-bar/toolbar-menu/toolbar-menu.component.ts
@@ -23,8 +23,9 @@
* along with Alfresco. If not, see .
*/
-import { Component, Input, ViewEncapsulation } from '@angular/core';
+import { Component, Input, ViewEncapsulation, HostListener, ViewChild } from '@angular/core';
import { ContentActionRef } from '@alfresco/adf-extensions';
+import { MatMenuTrigger } from '@angular/material/menu';
@Component({
selector: 'app-toolbar-menu',
@@ -39,6 +40,13 @@ export class ToolbarMenuComponent {
@Input()
color = '';
+ @ViewChild('matTrigger') matTrigger: MatMenuTrigger;
+
+ @HostListener('document:keydown.Escape')
+ handleKeydownEscape() {
+ this.matTrigger.closeMenu();
+ }
+
get hasChildren(): boolean {
return this.actionRef && this.actionRef.children && this.actionRef.children.length > 0;
}