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.

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

feat(wcag-2-2): Add "dragging movements" test #7058

Merged
merged 16 commits into from
Oct 31, 2023

Conversation

codeofdusk
Copy link
Contributor

@codeofdusk codeofdusk commented Oct 26, 2023

Details

This PR adds "dragging movements" to the assessment experience.

Motivation

Part of Feature 2100304 (internal access required to view).

Pull request checklist

  • [n/a] Addresses an existing issue: #0000
  • Ran yarn fastpass
  • [n/a] Added/updated relevant unit test(s) (and ran yarn test)
  • [n/a] Verified code coverage for the changes made. Check coverage report at: <rootDir>/test-results/unit/coverage
  • PR title AND final merge commit title both start with a semantic tag (fix:, chore:, feat(feature-name):, refactor:). See CONTRIBUTING.md.
  • [n/a] (UI changes only) Added screenshots/GIFs to description above
  • [n/a] (UI changes only) Verified usability with NVDA/JAWS

interprets pointer actions (i.e. this does not apply to actions that are required to
operate the user agent or assistive technology).
</p>
<ManualTestRecordYourResults isMultipleFailurePossible={true} />
Copy link
Contributor Author

Choose a reason for hiding this comment

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

Is this markup okay? NVDA is acting like this creates a <li> element (should it be inside a list?)

Copy link
Contributor

Choose a reason for hiding this comment

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

If you look at one of the other test steps for pointer motion, (e.g., Motion operation), you'll see that the "Exception" paragraph is part of the <li> before it, and that the ManualTestRecordYourResults component is inside the <ol> since it does create a <li> element. Once this matches that formatting, NVDA should be happier.

Copy link
Contributor

@madalynrose madalynrose 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 only thing you are missing is adding the content for this test to the index of links for pointer motion (src/content/test/pointer-motion/index.ts). That will make the content available to the test step and display the info-examples button to open the side panel.

I added a comment about formatting on the file itself, but other than these two changes it looks great!

interprets pointer actions (i.e. this does not apply to actions that are required to
operate the user agent or assistive technology).
</p>
<ManualTestRecordYourResults isMultipleFailurePossible={true} />
Copy link
Contributor

Choose a reason for hiding this comment

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

If you look at one of the other test steps for pointer motion, (e.g., Motion operation), you'll see that the "Exception" paragraph is part of the <li> before it, and that the ManualTestRecordYourResults component is inside the <ol> since it does create a <li> element. Once this matches that formatting, NVDA should be happier.

@DaveTryon
Copy link
Contributor

@madalynrose Other items in the Pointer assessment are represented in the e2e test snapshots (link). Is there something special that needs to happen to make this occur in the e2e tests?

@codeofdusk codeofdusk marked this pull request as ready for review October 26, 2023 18:46
@codeofdusk codeofdusk requested a review from a team as a code owner October 26, 2023 18:46
@codeofdusk codeofdusk changed the title feat(wcag-2-2): Add "dragging movements" assessment feat(wcag-2-2): Add "dragging movements" test Oct 28, 2023
Copy link
Contributor

@madalynrose madalynrose left a comment

Choose a reason for hiding this comment

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

update links to match other requirements

src/content/test/pointer-motion/dragging-movements.tsx Outdated Show resolved Hide resolved
src/content/test/pointer-motion/dragging-movements.tsx Outdated Show resolved Hide resolved
src/content/test/pointer-motion/dragging-movements.tsx Outdated Show resolved Hide resolved
src/content/test/pointer-motion/dragging-movements.tsx Outdated Show resolved Hide resolved
Copy link
Contributor

@madalynrose madalynrose left a comment

Choose a reason for hiding this comment

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

Looks great!

@codeofdusk codeofdusk merged commit c946ce8 into microsoft:main Oct 31, 2023
12 checks passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

3 participants