Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

USWDS-Site: Add banner accessibility tests page #2687

Merged
merged 13 commits into from
Jun 7, 2024
Merged

USWDS-Site: Add banner accessibility tests page #2687

merged 13 commits into from
Jun 7, 2024

Conversation

amyleadem
Copy link
Contributor

@amyleadem amyleadem commented May 20, 2024 •
edited
Loading

Summary

Added accessibility tests page for the banner component.

Important

We should update changelog dates before merge.

Related issue

Closes #2642

Preview link

Resources

Testing and review

  1. Confirm that both the main component page and the accessibility tests page have the correct compliance tag at the top.
  2. Confirm that the main component page links to the accessibility tests page in the side navigation.
  3. Confirm that the main component page links to the accessibility tests page from the accessibility guidance section.
  4. Confirm that the main component page shows the accessibility tests summary.
  5. Check that accessibility tests page provides the correct counts for each test status type.
  6. Confirm the test checklist summaries and data are accurate.
  7. Confirm no visual issues.
  8. Confirm there is an appropriate changelog entry on both the main component page and the accessibility tests page.

@amyleadem amyleadem marked this pull request as ready for review May 21, 2024 22:56
amyleadem
amyleadem commented May 21, 2024
View reviewed changes
Copy link
Contributor Author

@amyleadem amyleadem left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@alex-hull @amycole501 @sarah-sch @finekatie

I tagged you all with some open questions below. Please review and let me know if you have any questions!

_data/accessibility-tests/banner.yml Outdated Show resolved Hide resolved
_data/accessibility-tests/banner.yml Outdated Show resolved Hide resolved
_data/accessibility-tests/banner.yml Outdated Show resolved Hide resolved
_data/accessibility-tests/banner.yml Show resolved Hide resolved
_data/accessibility-tests/banner.yml Outdated Show resolved Hide resolved
_data/accessibility-tests/banner.yml Outdated Show resolved Hide resolved
_data/accessibility-tests/banner.yml Outdated Show resolved Hide resolved
amycole501
amycole501 reviewed May 22, 2024
View reviewed changes
Copy link

@amycole501 amycole501 left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I left a suggestion for a wording change to the focus order check. I also approved your suggestion for the alt text additional prompt.

sarah-sch
sarah-sch requested changes May 24, 2024
View reviewed changes
Copy link
Contributor

@sarah-sch sarah-sch left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Adding some comments and suggestions. Sorry that I didn't catch all of these in the drafting phase!

_data/accessibility-tests/banner.yml Outdated Show resolved Hide resolved
_data/accessibility-tests/banner.yml Outdated Show resolved Hide resolved
_data/accessibility-tests/banner.yml Outdated Show resolved Hide resolved
_data/accessibility-tests/banner.yml Outdated Show resolved Hide resolved
@amyleadem
Copy link
Contributor Author

@sarah-sch @alex-hull @amycole501 This is ready for your re-review. I believe I have addressed all of your comments. We are still missing a test status for 2.4.6. @alex-hull @amycole501, can you let me know what status I should put there?

@amyleadem amyleadem requested a review from mahoneycm May 29, 2024 21:11
mahoneycm
mahoneycm reviewed May 31, 2024
View reviewed changes
Copy link
Contributor

@mahoneycm mahoneycm left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Code-wise, this is looking pretty good! Left a couple questions for ya but once your existing questions are cleared up this should be good to go

_data/accessibility-tests/banner.yml Outdated Show resolved Hide resolved
_data/accessibility-tests/banner.yml Show resolved Hide resolved
_components/banner/banner.md Outdated Show resolved Hide resolved
_data/accessibility-tests/banner.yml
Comment on lines +11 to +14
- summary: Text meets color contrast requirements.
summary_additional: |
When you open the banner and use ANDI or another color contrast analyzer to look at the hex numbers,
the contrast between the banner text and background color is at least 4.5:1.
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Curious, for components with settings to customize colors, should we add a note that they'll need to test themselves if they customize colors? We do offer color contrast checks that will warn them if the colors aren't compliant so maybe we don't need to worry about noting here.

What do you think?

Copy link
Contributor Author

@amyleadem amyleadem Jun 4, 2024 •
edited
Loading

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I don't think it is necessary to add an additional note here. We explicitly state at the top of the page that each of these tests should be completed after the component is implemented in a project ("USWDS tests components in isolation. You need to test the banner component in the context of your own site to ensure compliance with Section 508 accessibility standards."), so users should be testing regardless. Any objections to moving forward as-is?

Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I'm leaning more with, Amy. I think we can keep it as is (but I also see your POV as well, Charlie).

@amyleadem @mahoneycm
Remove indent from subnav
2711dae 
Co-authored-by: Charlie Mahoney <charlie.mahoney@bixal.com>
alex-hull
alex-hull approved these changes May 31, 2024
View reviewed changes
Copy link

@alex-hull alex-hull left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I think the tests look. Approving the additions.

sarah-sch
sarah-sch approved these changes Jun 3, 2024
View reviewed changes
Copy link
Contributor

@sarah-sch sarah-sch left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

LGTM

@amyleadem amyleadem requested a review from mahoneycm June 4, 2024 20:59
@finekatie finekatie removed their request for review June 4, 2024 21:03
@mahoneycm mahoneycm requested a review from thisisdano June 5, 2024 20:37
@thisisdano thisisdano merged commit 1a42981 into main Jun 7, 2024
11 checks passed
@thisisdano thisisdano deleted the al-a11y-tests-banner branch June 7, 2024 19:00
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Reviewers

@alex-hull alex-hull alex-hull approved these changes

@amycole501 amycole501 amycole501 approved these changes

@sarah-sch sarah-sch sarah-sch approved these changes

@mahoneycm mahoneycm mahoneycm approved these changes

@thisisdano thisisdano thisisdano approved these changes

Assignees
No one assigned
Labels
None yet
Projects
None yet
Milestone
No milestone
Development

Successfully merging this pull request may close these issues.

CC a11y: publish Banner checklist - create PR
6 participants
@amyleadem @thisisdano @mahoneycm @sarah-sch @amycole501 @alex-hull