Adding aria label for include/exclude selector button #772

This now makes the screen reader say 'clickable include or exclude menu button sub menu' compared to 'clickable menu button sub menu'. This is a minor improvement, could be made better
ral-facilities · Aug 25, 2021 · 9b6dab0 · 9b6dab0
1 parent 423787e
commit 9b6dab0
Showing 1 changed file with 3 additions and 0 deletions.
diff --git a/packages/datagateway-common/src/table/columnFilters/textColumnFilter.component.tsx b/packages/datagateway-common/src/table/columnFilters/textColumnFilter.component.tsx
@@ -79,6 +79,9 @@ const TextColumnFilter = (props: {
               // Do not render a value
               renderValue={() => ''}
               onChange={(e) => handleSelectChange(e.target.value as string)}
+              SelectDisplayProps={{
+                'aria-label': `include or exclude`,
+              }}
             >
               <MenuItem
                 key="include"