Merge branch 'main' into a11y/home-links

microsoft · Feb 9, 2022 · cc80593 · cc80593
2 parents 6420e90 + c6afb6c
commit cc80593
Show file tree

Hide file tree

Showing 2 changed files with 7 additions and 2 deletions.
diff --git a/Composer/packages/ui-plugins/select-dialog/src/SelectDialogMenu.tsx b/Composer/packages/ui-plugins/select-dialog/src/SelectDialogMenu.tsx
@@ -121,6 +121,7 @@ export const SelectDialogMenu: React.FC<SelectDialogMenuProps> = (props) => {
       text: d.displayName,
       isSelected: value === d.displayName,
       data: d,
+      role: 'option',
       iconProps: {
         iconName: getIconName(d),
         styles: {
@@ -141,6 +142,7 @@ export const SelectDialogMenu: React.FC<SelectDialogMenuProps> = (props) => {
         sectionProps: {
           items: dialogItems,
         },
+        role: 'option',
       },
       {
         key: 'actions',
@@ -154,13 +156,15 @@ export const SelectDialogMenu: React.FC<SelectDialogMenuProps> = (props) => {
               iconProps: {
                 iconName: Icons.EXPRESSION,
               },
+              role: 'option',
             },
             {
               key: ADD_DIALOG,
               text: formatMessage('Create a new dialog'),
               iconProps: {
                 iconName: 'Add',
               },
+              role: 'option',
             },
           ],
         },
@@ -266,6 +270,7 @@ export const SelectDialogMenu: React.FC<SelectDialogMenuProps> = (props) => {
                 }
               `,
             }}
+            role="listbox"
             styles={buttonStyles}
             text={selectedLabel || ' '}
             onBlur={() => onBlur?.(id, value)}

diff --git a/Composer/packages/ui-plugins/select-dialog/src/__tests__/selectDialog.test.tsx b/Composer/packages/ui-plugins/select-dialog/src/__tests__/selectDialog.test.tsx
@@ -58,7 +58,7 @@ describe('Select Dialog', () => {
     const menu = await findByLabelText('Dialog name');
     fireEvent.click(menu);
 
-    const createItem = getAllByRole(baseElement, 'menuitem').pop();
+    const createItem = getAllByRole(baseElement, 'option').pop();
     expect(createItem).toHaveTextContent('Create a new dialog');
     act(() => {
       fireEvent.click(createItem);
@@ -79,7 +79,7 @@ describe('Select Dialog', () => {
     const menu = await findByLabelText('Dialog name');
     fireEvent.click(menu);
 
-    const [dialog] = getAllByRole(baseElement, 'menuitem');
+    const [dialog] = getAllByRole(baseElement, 'option');
     expect(dialog).toHaveTextContent('dialog2');
     act(() => {
       fireEvent.click(dialog);