Skip to content

[CDC COVID19] - Bug: Site remains dim after user tabs out of "Cloth Face Covers" disclosure #16

Open
@mxmason

Description

Issue Summary

If a user has a viewport of 991px or narrower, the site displays a disclosure widget near the top of the page. Clicking the disclosure at the top of the page will open it and dim the area outside the disclosure.

Tabbing sequentially through the links until browser focus exits the disclosure does not remove the dimming overlay.

Steps to reproduce

Steps to reproduce the behavior:

  1. Go to https://www.cdc.gov/coronavirus/2019-ncov/prevent-getting-sick/prevention.html
    (or any page on which the disclosure appears)
  2. Make sure your viewport is 991px or fewer.
  3. Click on the disclosure widget at the top of the page.
  4. Observe that the area outside the disclosure is dim.
  5. Press Tab to navigate sequentially through the links in the disclosure, until you have tabbed out of the disclosure
  6. Observe that the disclosure is closed, the page is still dim

Behavior

Expected behavior

The page is no longer dimmed after the user tabs out of the disclosure widget.

Actual behavior

The page dimming does not go away when expected.

Note: Dimming behaves as expected when user interacts with a mouse.

Device Information:

  • OS: MacOS 10.15.2
  • Browser: Chrome, Chromium Edge, Safari, Firefox (all latest)

Screen Reader or AT Information

N/A

Screenshots

One of the disclosure widgets, in the closed state.

www cdc gov_coronavirus_2019-ncov_prevent-getting-sick_prevention html
The disclosure in the open state, with the background area dimmed.

Specifications

WCAG 2.1.1 ?

Metadata

Assignees

No one assigned

    Labels

    CDC COVID-19Issues logged for the CDC COVID-19 sitebugSomething isn't working

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions