update mdc-based menu

angular · Oct 11, 2019 · 1d4496e · 1d4496e
1 parent 1fc8a6f
commit 1d4496e
Show file tree

Hide file tree

Showing 2 changed files with 10 additions and 0 deletions.
diff --git a/src/material-experimental/mdc-menu/menu.html b/src/material-experimental/mdc-menu/menu.html
@@ -1,6 +1,7 @@
 <ng-template>
   <div
     class="mat-mdc-menu-panel mdc-menu-surface mdc-menu-surface--open"
+    [id]="panelId"
     [ngClass]="_classList"
     (keydown)="_handleKeydown($event)"
     (click)="closed.emit('click')"

diff --git a/src/material-experimental/mdc-menu/menu.spec.ts b/src/material-experimental/mdc-menu/menu.spec.ts
@@ -74,6 +74,15 @@ describe('MatMenu', () => {
     overlayContainer.ngOnDestroy();
   }));
 
+  it('should aria-controls the menu panel', () => {
+    const fixture = createComponent(SimpleMenu, [], [FakeIcon]);
+    fixture.detectChanges();
+    fixture.componentInstance.trigger.openMenu();
+    fixture.detectChanges();
+    expect(fixture.componentInstance.triggerEl.nativeElement.getAttribute('aria-controls'))
+        .toBe(fixture.componentInstance.menu.panelId);
+  });
+
   it('should open the menu as an idempotent operation', () => {
     const fixture = createComponent(SimpleMenu, [], [FakeIcon]);
     fixture.detectChanges();