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

Address all pa11y violations in cypress testing. #834

Merged
merged 22 commits into from
Mar 3, 2022
Merged

Address all pa11y violations in cypress testing. #834

Show file tree
Hide file tree
Changes from 19 commits
Commits
Show all changes
22 commits
Select commit Hold shift + click to select a range
570f49a
Add `ignore` option to ignore `definition-list` and `dlitem`
JasonLin0991 Feb 23, 2022
ca53e14
Adjust threshold to 7.
JasonLin0991 Feb 24, 2022
ee95963
Add `aria-allowed-attr` and `color-contrast` to pa11y ignore array.
JasonLin0991 Feb 24, 2022
07cce7b
Remove newline.
JasonLin0991 Feb 24, 2022
06a6791
Hide step indicator element.
JasonLin0991 Feb 24, 2022
0d977df
Remove pa11y threshold options and `aria-allowed-attr` from ignore li…
JasonLin0991 Mar 1, 2022
3e42502
Remove pa11y threshold option.
JasonLin0991 Mar 1, 2022
c197eed
Hide elements with false positive violations and remove threshold opt…
JasonLin0991 Mar 1, 2022
8e933c2
Ignore `aria-allowed-attr` instead of hiding element with #documents-…
JasonLin0991 Mar 1, 2022
2554f4d
Add "radiogroup" role to <Fieldset> components containing <FieldRadio…
JasonLin0991 Mar 1, 2022
7c7b027
Add "radiogroup" role to <Fieldset> components containing <FieldRadio…
JasonLin0991 Mar 1, 2022
97d240c
Hide StepIndicator from pa11y test.
JasonLin0991 Mar 1, 2022
6e103b3
Remove blank line.
JasonLin0991 Mar 2, 2022
e4315ca
Add isComplete status and set statusValue when upload complete.
JasonLin0991 Mar 2, 2022
859c2b0
Set <div>, containing `hint` prop, role as note.
JasonLin0991 Mar 2, 2022
b15d941
Modify pa11y test options to address violations.
JasonLin0991 Mar 2, 2022
c1123ef
Add group role to <span> containing hint to fix pa11y violation.
JasonLin0991 Mar 2, 2022
9dd8cbc
Remove pa11y threshold option.
JasonLin0991 Mar 2, 2022
d6a536a
Update snapshot for upload complete status.
JasonLin0991 Mar 2, 2022
71ed3f5
Apply `note` role to `<div>` containing hint.
JasonLin0991 Mar 3, 2022
884a436
Replace `group` role with `note` in `<div>` containing hint.
JasonLin0991 Mar 3, 2022
6c18dc2
Merge branch 'main' into jl-ignore-pa11y-violations
JasonLin0991 Mar 3, 2022
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 1 addition & 1 deletion .../app-web/src/components/FileUpload/FileItemList/__snapshots__/FileItemsList.test.tsx.snap
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -193,7 +193,7 @@ exports[`FileItemList component renders correctly 1`] = `
>
<div
aria-label="Status of file testFile4.pdf"
aria-valuetext=""
aria-valuetext="upload complete"
role="progressbar"
>
<img
Expand Down
3 changes: 3 additions & 0 deletions services/app-web/src/components/FileUpload/FileProcessor/FileProcessor.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -116,6 +116,7 @@ export const FileProcessor = ({
!isContractOnly && item.documentCategories.length === 0
const isLoading = status === 'PENDING'
const isScanning = status === 'SCANNING'
const isComplete = status === 'UPLOAD_COMPLETE'

const isPDF = name.indexOf('.pdf') > 0
const isWord = name.indexOf('.doc') > 0 || name.indexOf('.pages') > 0
Expand Down Expand Up @@ -145,6 +146,8 @@ export const FileProcessor = ({
statusValue = 'uploading'
} else if (isScanning) {
statusValue = 'scanning for viruses'
} else if (isComplete){
statusValue = 'upload complete'
} else if (
hasDuplicateNameError ||
hasScanningError ||
Expand Down
1 change: 1 addition & 0 deletions services/app-web/src/components/FileUpload/FileUpload.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -388,6 +388,7 @@ export const FileUpload = ({
{hint && (
<span
id={`${id}-hint`}
role="group"
aria-labelledby={id}
className={styles.fileInputHint}
>
Expand Down
2 changes: 1 addition & 1 deletion services/app-web/src/components/Form/FieldTextarea/FieldTextarea.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -42,7 +42,7 @@ export const FieldTextarea = ({
<PoliteErrorMessage>{meta.error}</PoliteErrorMessage>
)}
{hint && (
<div aria-labelledby={id} className="usa-hint margin-top-1">
<div role="note" aria-labelledby={id} className="usa-hint margin-top-1">
Copy link
Contributor

@haworku haworku Mar 3, 2022 •
edited
Loading

Choose a reason for hiding this comment

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

In the spirit of unifying our re-useable form components could you please add the role=note to the other XXField components as well please. We have the exact same time of hint handling for FieldDropdown FieldTextInput looks like.

{hint}
</div>
)}
Expand Down
5 changes: 5 additions & 0 deletions services/app-web/src/pages/StateSubmission/ContractDetails/ContractDetails.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -444,6 +444,7 @@ export const ContractDetails = ({
error={showFieldErrors(errors.contractType)}
>
<Fieldset
role="radiogroup"
aria-required
className={styles.radioGroup}
legend="Contract action type"
Expand Down Expand Up @@ -477,6 +478,7 @@ export const ContractDetails = ({
error={showFieldErrors(errors.contractExecutionStatus)}
>
<Fieldset
role="radiogroup"
aria-required
className={styles.radioGroup}
legend="Contract status"
Expand Down Expand Up @@ -847,6 +849,7 @@ export const ContractDetails = ({
}
>
<Fieldset
role="radiogroup"
aria-required
legend="Select reason for capitation rate change"
>
Expand Down Expand Up @@ -1078,6 +1081,7 @@ export const ContractDetails = ({
)}
>
<Fieldset
role="radiogroup"
aria-required
legend="Is this contract action related to the COVID-19 public health emergency?"
>
Expand Down Expand Up @@ -1120,6 +1124,7 @@ export const ContractDetails = ({
)}
>
<Fieldset
role="radiogroup"
aria-required
legend="Is this related to coverage and reimbursement for vaccine administration?"
>
Expand Down
1 change: 1 addition & 0 deletions services/app-web/src/pages/StateSubmission/RateDetails/RateDetails.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -389,6 +389,7 @@ export const RateDetails = ({
<Fieldset
className={styles.radioGroup}
legend="Rate certification type"
role="radiogroup"
aria-required
>
{showFieldErrors(errors.rateType) && (
Expand Down
2 changes: 1 addition & 1 deletion services/app-web/src/pages/StateSubmission/SubmissionType/SubmissionType.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -326,6 +326,7 @@ export const SubmissionType = ({
>
<Fieldset
className={styles.radioGroup}
role="radiogroup"
aria-required
legend="Choose submission type"
>
Expand Down Expand Up @@ -375,7 +376,6 @@ export const SubmissionType = ({
)}
hint={
<>

<p id="submissionDescriptionHelp">
Provide a 1-2 paragraph summary of your submission that highlights any important changes CMS reviewers will need to be aware of
</p>
Expand Down
12 changes: 9 additions & 3 deletions tests/cypress/integration/stateWorkflow/dashboard/dashboard.spec.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -16,7 +16,6 @@ describe('dashboard', () => {
// check accessibility of dashboard
cy.pa11y({
actions: ['wait for element #dashboard-page to be visible'],
threshold: 2, // This ratchet is tracked by https://qmacbis.atlassian.net/browse/OY2-15947
})
})

Expand Down Expand Up @@ -55,7 +54,11 @@ describe('dashboard', () => {
cy.findByRole('heading', { level: 2, name: /Review and submit/ })
cy.pa11y({
actions: ['wait for element #submissionTypeSection to be visible'],
threshold: 24, // This ratchet is tracked by https://qmacbis.atlassian.net/browse/OY2-15950
ignore: [
'definition-list',
'dlitem',
],
hideElements: '.usa-step-indicator'
})

// Submit, sent to dashboard
Expand Down Expand Up @@ -104,7 +107,10 @@ describe('dashboard', () => {
actions: [
'wait for element #submissionTypeSection to be visible',
],
threshold: 20, // This ratchet is tracked by https://qmacbis.atlassian.net/browse/OY2-15952
ignore: [
'definition-list',
'dlitem',
],
})

// Link back to dashboard, submission visible in default program
Expand Down
2 changes: 1 addition & 1 deletion tests/cypress/integration/stateWorkflow/stateSubmissionForm/contacts.spec.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -49,7 +49,7 @@ describe('contacts', () => {
cy.findByRole('heading', { name: /Contacts/ })
cy.pa11y({
actions: ['wait for element #form-guidance to be visible'],
threshold: 7, // This ratchet is tracked by https://qmacbis.atlassian.net/browse/OY2-15948
hideElements: '.usa-step-indicator',
})
})
})
Expand Down
3 changes: 2 additions & 1 deletion tests/cypress/integration/stateWorkflow/stateSubmissionForm/contractDetails.spec.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -57,7 +57,8 @@ describe('contract details', () => {
cy.findByRole('button', { name: /Back/ }).click()
cy.pa11y({
actions: ['wait for element #form-guidance to be visible'],
threshold: 16, // This ratchet is tracked by https://qmacbis.atlassian.net/browse/OY2-15946
hideElements: '.usa-step-indicator',
threshold: 6,
})
})
})
2 changes: 1 addition & 1 deletion tests/cypress/integration/stateWorkflow/stateSubmissionForm/documents.spec.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -129,7 +129,7 @@ describe('documents', () => {
cy.findByRole('button', { name: /Back/ }).click()
cy.pa11y({
actions: ['wait for element #documents-hint to be visible'],
threshold: 9, // This ratchet is tracked by https://qmacbis.atlassian.net/browse/OY2-15949
hideElements: '.usa-step-indicator',
})
})
})
Expand Down
2 changes: 1 addition & 1 deletion tests/cypress/integration/stateWorkflow/stateSubmissionForm/newSubmission.spec.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -22,7 +22,7 @@ describe('new submission', () => {
cy.findByRole('button', { name: /Back/ }).click()
cy.pa11y({
actions: ['wait for element #form-guidance to be visible'],
threshold: 9, // This ratchet is tracked by https://qmacbis.atlassian.net/browse/OY2-15931
hideElements: '.usa-step-indicator',
})
})
})
3 changes: 2 additions & 1 deletion tests/cypress/integration/stateWorkflow/stateSubmissionForm/rateDetails.spec.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -53,7 +53,8 @@ describe('rate details', () => {
cy.findByRole('button', { name: /Back/ }).click()
cy.pa11y({
actions: ['wait for element #form-guidance to be visible'],
threshold: 12, // This ratchet is tracked by https://qmacbis.atlassian.net/browse/OY2-15947
hideElements: '.usa-step-indicator',
threshold: 4,
})
})
})
Expand Down