DESENG-617 Update changelog, check linting, final tweaks to screen re…

…ader language
bcgov · Jun 28, 2024 · 516b1c6 · 516b1c6
1 parent 7d5992c
commit 516b1c6
Show file tree

Hide file tree

Showing 3 changed files with 8 additions and 2 deletions.
diff --git a/CHANGELOG.MD b/CHANGELOG.MD
@@ -1,3 +1,6 @@
+## June 28, 2024
+- **Task** Improve screen reader support for home/engagement search page [DESENG-617](https://citz-gdx.atlassian.net/browse/DESENG-617)
+
 ## June 27, 2024
 
 - **Bugfix** Fix tenant landing page [🎟️ DESENG-635](https://citz-gdx.atlassian.net/browse/DESENG-635)

diff --git a/met-web/src/components/landing/FilterBlock.tsx b/met-web/src/components/landing/FilterBlock.tsx
@@ -94,7 +94,7 @@ const FilterBlock = () => {
                 <Grid item xl={6} lg={8} md={10} sm={8} xs={12}>
                     <MetLabel paddingBottom={'3px'}>{translate('landing.filters.search')}</MetLabel>
                     <CustomTextField
-                        aria-label="Search box for filtering engagements. Type or select filters to narrow results automatically."
+                        aria-label="Search box for filtering engagements. Search by title or select filters to narrow results automatically."
                         tabIndex={0}
                         fullWidth
                         placeholder={translate('landing.filters.searchPlaceholder')}

diff --git a/met-web/src/components/landing/TileBlock.tsx b/met-web/src/components/landing/TileBlock.tsx
@@ -58,6 +58,7 @@ const TileBlock = () => {
                 xs={10}
             >
                 <NoResult />
+                <ul tabIndex={0} aria-label="Engagements list. No results."></ul>
             </Grid>
         );
     }
@@ -76,6 +77,7 @@ const TileBlock = () => {
                 {engagements.map((engagement, index) => {
                     return (
                         <Grid
+                            component="ul"
                             item
                             container
                             xs={12}
@@ -86,9 +88,10 @@ const TileBlock = () => {
                                 flexBasis: '320px',
                                 alignItems: 'center',
                                 justifyContent: 'center',
+                                listStyleType: 'none',
                             }}
                         >
-                            <Grid item width="320px">
+                            <Grid item width="320px" component="li">
                                 <EngagementTile passedEngagement={engagement} engagementId={engagement.id} />
                             </Grid>
                         </Grid>