fix(menu): Switch from aria-selected to aria-checked for selected menu item. (#4779)

aria-checked is advised in ARIA spec for selectable menu items:
* w3.org/TR/wai-aria-1.1/#menuitemcheckbox
* w3.org/TR/wai-aria-1.1/#menuitemradio

Author: joyzhong

packages/mdc-menu/constants.ts

@@ -28,7 +28,7 @@ const cssClasses = {
 };
 
 const strings = {
-  ARIA_SELECTED_ATTR: 'aria-selected',
+  ARIA_CHECKED_ATTR: 'aria-checked',
   CHECKBOX_SELECTOR: 'input[type="checkbox"]',
   LIST_SELECTOR: '.mdc-list',
   SELECTED_EVENT: 'MDCMenu:selected',

packages/mdc-menu/foundation.ts

@@ -142,12 +142,12 @@ export class MDCMenuFoundation extends MDCFoundation<MDCMenuAdapter> {
 
     const prevSelectedIndex = this.adapter_.getSelectedSiblingOfItemAtIndex(index);
     if (prevSelectedIndex >= 0) {
-      this.adapter_.removeAttributeFromElementAtIndex(prevSelectedIndex, strings.ARIA_SELECTED_ATTR);
+      this.adapter_.removeAttributeFromElementAtIndex(prevSelectedIndex, strings.ARIA_CHECKED_ATTR);
       this.adapter_.removeClassFromElementAtIndex(prevSelectedIndex, cssClasses.MENU_SELECTED_LIST_ITEM);
     }
 
     this.adapter_.addClassToElementAtIndex(index, cssClasses.MENU_SELECTED_LIST_ITEM);
-    this.adapter_.addAttributeToElementAtIndex(index, strings.ARIA_SELECTED_ATTR, 'true');
+    this.adapter_.addAttributeToElementAtIndex(index, strings.ARIA_CHECKED_ATTR, 'true');
   }
 
   private validatedIndex_(index: number): void {

test/unit/mdc-menu/menu.foundation.test.js

@@ -279,9 +279,9 @@ test('setSelectedIndex calls addClass and addAttribute only', () => {
   td.verify(mockAdapter.removeClassFromElementAtIndex(
     td.matchers.isA(Number), cssClasses.MENU_SELECTED_LIST_ITEM), {times: 0});
   td.verify(mockAdapter.removeAttributeFromElementAtIndex(td.matchers.isA(Number),
-    strings.ARIA_SELECTED_ATTR), {times: 0});
+    strings.ARIA_CHECKED_ATTR), {times: 0});
   td.verify(mockAdapter.addClassToElementAtIndex(0, cssClasses.MENU_SELECTED_LIST_ITEM), {times: 1});
-  td.verify(mockAdapter.addAttributeToElementAtIndex(0, strings.ARIA_SELECTED_ATTR, 'true'), {times: 1});
+  td.verify(mockAdapter.addAttributeToElementAtIndex(0, strings.ARIA_CHECKED_ATTR, 'true'), {times: 1});
 });
 
 test('setSelectedIndex remove class and attribute, and adds class and attribute to newly selected item', () => {
@@ -295,9 +295,9 @@ test('setSelectedIndex remove class and attribute, and adds class and attribute
   foundation.setSelectedIndex(0);
   td.verify(mockAdapter.removeClassFromElementAtIndex(1, cssClasses.MENU_SELECTED_LIST_ITEM), {times: 1});
   td.verify(
-    mockAdapter.removeAttributeFromElementAtIndex(1, strings.ARIA_SELECTED_ATTR), {times: 1});
+    mockAdapter.removeAttributeFromElementAtIndex(1, strings.ARIA_CHECKED_ATTR), {times: 1});
   td.verify(mockAdapter.addClassToElementAtIndex(0, cssClasses.MENU_SELECTED_LIST_ITEM), {times: 1});
-  td.verify(mockAdapter.addAttributeToElementAtIndex(0, strings.ARIA_SELECTED_ATTR, 'true'), {times: 1});
+  td.verify(mockAdapter.addAttributeToElementAtIndex(0, strings.ARIA_CHECKED_ATTR, 'true'), {times: 1});
 });
 
 test('setSelectedIndex throws error if index is not in range', () => {