[bug fix] As an A11y user I want to be able to have screen reader available for collapsed sidenav navbar in mobile mode

[raftmsohani]

Description

Problem The navbar items in mobile mode are hidden from NVDA screen reader.

Cause Following issue #1984, it is evident that the source of the problem is caused by a bug in USWDS package version 2.13.3 currently being used in the project (see also email below). The mobile navbar sandwich button adds aria-hidden="true" to all the parent elements, and since aria-hidden hides all accessibility features from the element and all its children (see this), the navbar items will be hidden from screen reader.

Solution

Upgrade USWDS to version 3.2.0.

Deliverables

1. Upgrade USWDS to 3.2.0
2. Use forward instead of Import updated SASS from USWDS according to USWDS documentation.
3. Build frontend using Webpack following USWDS documentation. Note: The build script should be updated to include build paths for new USWDS (now ./node_modules/@uswds/uswds).

Acceptance Criteria

1. Tabing through navbar, all items should be readable by NVDA screen reader.
2. Test other pages with screen reader
3. Additional acceptance test for other frontend scripts and components to ensure no collateral negative affect on other items

Notes:

• Note 1: NVDA is a MS Windows program, as such the test has to be done in Windows env

[robgendron]

@reitermb Is this related to Parity?

[reitermb]

@reitermb Is this related to Parity?

This is a relatively high priority accessibility issue but isn't technically parity.