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

Create tests for APG design pattern example: Color Viewer Slider #403

Closed
IsaDC opened this issue Mar 19, 2021 · 2 comments · Fixed by #414
Closed

Create tests for APG design pattern example: Color Viewer Slider #403

IsaDC opened this issue Mar 19, 2021 · 2 comments · Fixed by #414
Assignees
@IsaDC

Comments

@IsaDC
Copy link
Contributor

IsaDC commented Mar 19, 2021 •
edited
Loading

Applies To

Testing Notes

This issue thread will house all documentation relating to the development of a test plan for the "Horizontal Slider " APG example, which conforms to the "Slider" design pattern. All follow-ups (including the test plan itself) will be added as new comments to facilitate notifications, but this initial comment will be updated with relevant details and URLs as needed for convenience.

Additional References
@IsaDC IsaDC self-assigned this Mar 19, 2021
@IsaDC
Copy link
Contributor Author

IsaDC commented Mar 31, 2021 •
edited
Loading

Below is the test plan for the color viewer slider example. Each test title is marked up as a level 4 heading to facilitate screen reader navigation.

Navigate forwards to a horizontal slider

  • Applies to: JAWS, NVDA, macOS VoiceOver
  • Modes: reading, interaction
  • Instructions:
    • Reading mode: With the reading cursor on the 'Navigate forwards from here' link, navigate to the 'Red' slider.
    • Interaction mode: With focus on the 'Navigate forwards from here' link, navigate to the 'Red' slider.
  • Setup script description: sets focus on a link before the slider
Commands
AT Mode Commands
JAWS, NVDA reading
  • Down Arrow Folloed by Down Arrow
  • Tab
JAWS, NVDA interaction Tab
macOS VoiceOver interaction
  • Control+Option+Right Arrow folloed by Control+Option+Right Arrow
  • Tab
Assertions
Assertion Priority
Role 'slider' is conveyed required
Name 'Red' is conveyed required
Value '128' is conveyed required
Orientation 'horizontal' is conveyed required
Minimum value '0' is conveyed optional
Maximum value '255' is conveyed optional
References

slider, aria-labelledby, aria-valuenow, aria-valuemin, aria-valuemax

Navigate backwards to a horizontal slider

  • Applies to: JAWS, NVDA, macOS VoiceOver
  • Modes: reading, interaction
  • Instructions:
    • Reading mode: With the reading cursor on the 'Navigate backwards from here' link, navigate to the 'Red' slider.
    • Interaction mode: With focus on the 'Navigate backwards from here' link, navigate to the 'Red' slider.
  • Setup script description: sets focus on a link after the slider
Commands
AT Mode Commands
JAWS, NVDA reading
  • Up Arrow Folloed by Up Arrow
  • Shift+Tab
JAWS, NVDA interaction Shift+Tab
macOS VoiceOver interaction
  • Control+Option+Left Arrow folloed by Control+Option+Left Arrow
  • Tab
Assertions
Assertion Priority
Role 'slider' is conveyed required
Name 'Red' is conveyed required
Value '128' is conveyed required
Orientation 'horizontal' is conveyed required
Minimum value '0' is conveyed optional
Maximum value '255' is conveyed optional
References

slider, aria-labelledby, aria-valuenow, aria-valuemin, aria-valuemax

Read information about a horizontal slider

  • Applies to: JAWS, NVDA, macOS VoiceOver
  • Modes: reading, interaction
  • Instructions:
    • Reading mode: With the reading cursor on the 'Red' slider, read information about the slider.
    • Interaction mode: With focus on the 'Red' slider, read information about the slider.
  • Setup script description: sets focus on the 'Red' slider
Commands
AT Mode Commands
JAWS, NVDA reading, interaction
  • Insert+Tab
  • Insert+Up
macOS VoiceOver interaction
  • Control+Option+F3
  • Control+option+F4
Assertions
Assertion Priority
Role 'slider' is conveyed required
Name 'Red' is conveyed required
Value '128' is conveyed required
Orientation 'horizontal' is conveyed required
References

slider, aria-labelledby, aria-valuenow

Increment a horizontal slider by one step

  • Applies to: JAWS, NVDA, macOS VoiceOver
  • Modes: interaction
  • Instructions:
    • Interaction mode: With focus on the 'Red' slider, set its value to 1.
  • Setup script description: sets focus on the 'Red' slider, and sets its value to 0
Commands
AT Mode Commands
JAWS, NVDA, macOS VoiceOver interaction
  • Right Arrow
  • Up Arrow
Assertions
Assertion Priority
Value '1' is conveyed required
References

aria-valuenow

Decrement a horizontal slider by one step

  • Applies to: JAWS, NVDA, macOS VoiceOver
  • Modes: interaction
  • Instructions:
    • Interaction mode: With focus on the 'Red' slider, set its value to 0.
  • Setup script description: sets focus on the 'Red' slider, and sets its value to 1
Commands
AT Mode Commands
JAWS, NVDA, macOS VoiceOver interaction
  • Left Arrow
  • Down Arrow
Assertions
Assertion Priority
Value '0' is conveyed required
References

aria-valuenow

Increment a horizontal slider by ten steps

  • Applies to: JAWS, NVDA, macOS VoiceOver
  • Modes: interaction
  • Instructions:
    • Interaction mode: With focus on the 'Red' slider, set its value to 10.
  • Setup script description: sets focus on the 'Red' slider, and sets its value to 0
Commands
AT Mode Commands
JAWS, NVDA, macOS VoiceOver interaction Page Up
Assertions
Assertion Priority
Value '10' is conveyed required
References

aria-valuenow

Decrement a horizontal slider by ten steps

  • Applies to: JAWS, NVDA, macOS VoiceOver
  • Modes: interaction
  • Instructions:
    • Interaction mode: With focus on the 'Red' slider, set its value to 0.
  • Setup script description: sets focus on the 'Red' slider, and sets its value to 10
Commands
AT Mode Commands
JAWS, NVDA, macOS VoiceOver interaction Page Down
Assertions
Assertion Priority
Value '0' is conveyed required
References

aria-valuenow

Decrement a horizontal slider to the minimum value

  • Applies to: JAWS, NVDA, macOS VoiceOver
  • Modes: interaction
  • Instructions:
    • Interaction mode: With focus on the 'Red' slider, set its value to 0.
  • Setup script description: sets focus on the 'Red' slider, and sets its value to 255
Commands
AT Mode Commands
JAWS, NVDA, macOS VoiceOver interaction Home
Assertions
Assertion Priority
Value '0' is conveyed required
References

aria-valuenow, aria-valuemin

Increment a horizontal slider to the maximum value

  • Applies to: JAWS, NVDA, macOS VoiceOver
  • Modes: interaction
  • Instructions:
    • Interaction mode: With focus on the 'Red' slider, set its value to 255.
  • Setup script description: sets focus on the 'Red' slider, and sets its value to 0
Commands
AT Mode Commands
JAWS, NVDA, macOS VoiceOver interaction End
Assertions
Assertion Priority
Value '255' is conveyed required
References

aria-valuenow, aria-valuemax

@IsaDC IsaDC mentioned this issue Apr 6, 2021
Merged
@JAWS-test JAWS-test mentioned this issue Apr 6, 2021
Open
@IsaDC IsaDC changed the title Create tests for APG design pattern example: Horizontal Slider Create tests for APG design pattern example: Color Viewer Slider Example May 17, 2021
@IsaDC IsaDC changed the title Create tests for APG design pattern example: Color Viewer Slider Example Create tests for APG design pattern example: Color Viewer Slider May 17, 2021
@IsaDC
Copy link
Contributor Author

IsaDC commented Jun 9, 2021

Below is the test plan for the color viewer slider example. Each test title is marked up as a level 4 heading to facilitate screen reader navigation.

Navigate forwards to a slider

  • Applies to: JAWS, NVDA, macOS VoiceOver
  • Modes: reading, interaction
  • Instructions:
    • Reading mode: With the reading cursor on the 'Navigate forwards from here' link, navigate to the 'Red' slider.
    • Interaction mode: With focus on the 'Navigate forwards from here' link, navigate to the 'Red' slider.
  • Setup script description: sets focus on a link before the Red slider
Commands
AT Mode Commands
JAWS, NVDA reading
  • Down Arrow Folloed by Down Arrow
  • Tab
JAWS, NVDA interaction Tab
macOS VoiceOver interaction
  • Control+Option+Right Arrow folloed by Control+Option+Right Arrow
  • Tab
Assertions
Assertion Priority
Role 'slider' is conveyed required
Name 'Red' is conveyed required
Value '128' is conveyed required
Orientation 'horizontal' is conveyed required
Minimum value '0' is conveyed optional
Maximum value '255' is conveyed optional
References

slider, aria-labelledby, aria-valuenow, aria-valuemin, aria-valuemax

Navigate backwards to a slider

  • Applies to: JAWS, NVDA, macOS VoiceOver
  • Modes: reading, interaction
  • Instructions:
    • Reading mode: With the reading cursor on the 'Navigate backwards from here' link, navigate to the 'Red' slider.
    • Interaction mode: With focus on the 'Navigate backwards from here' link, navigate to the 'Red' slider.
  • Setup script description: sets focus on a link after the Red slider
Commands
AT Mode Commands
JAWS, NVDA reading
  • Up Arrow Folloed by Up Arrow
  • Shift+Tab
JAWS, NVDA interaction Shift+Tab
macOS VoiceOver interaction
  • Control+Option+Left Arrow folloed by Control+Option+Left Arrow
  • Tab
Assertions
Assertion Priority
Role 'slider' is conveyed required
Name 'Red' is conveyed required
Value '128' is conveyed required
Orientation 'horizontal' is conveyed required
Minimum value '0' is conveyed optional
Maximum value '255' is conveyed optional
References

slider, aria-labelledby, aria-valuenow, aria-valuemin, aria-valuemax

Read information about a slider

  • Applies to: JAWS, NVDA, macOS VoiceOver
  • Modes: reading, interaction
  • Instructions:
    • Reading mode: With the reading cursor on the 'Red' slider, read information about the slider.
    • Interaction mode: With focus on the 'Red' slider, read information about the slider.
  • Setup script description: sets focus on the 'Red' slider
Commands
AT Mode Commands
JAWS, NVDA reading, interaction
  • Insert+Tab
  • Insert+Up
macOS VoiceOver interaction
  • Control+Option+F3
  • Control+option+F4
Assertions
Assertion Priority
Role 'slider' is conveyed required
Name 'Red' is conveyed required
Value '128' is conveyed required
Orientation 'horizontal' is conveyed required
Minimum value '0' is conveyed optional
Maximum value '255' is conveyed optional
References

slider, aria-labelledby, aria-valuenow

Increment a slider by one step

  • Applies to: JAWS, NVDA, macOS VoiceOver
  • Modes: interaction
  • Instructions:
    • Interaction mode: With focus on the 'Red' slider, set its value to 129.
  • Setup script description: sets focus on the 'Red' slider
Commands
AT Mode Commands
JAWS, NVDA, macOS VoiceOver interaction
  • Right Arrow
  • Up Arrow
Assertions
Assertion Priority
Value '129' is conveyed required
References

aria-valuenow

Decrement a slider by one step

  • Applies to: JAWS, NVDA, macOS VoiceOver
  • Modes: interaction
  • Instructions:
    • Interaction mode: With focus on the 'Red' slider, set its value to 127.
  • Setup script description: sets focus on the 'Red' slider
Commands
AT Mode Commands
JAWS, NVDA, macOS VoiceOver interaction
  • Left Arrow
  • Down Arrow
Assertions
Assertion Priority
Value '127' is conveyed required
References

aria-valuenow

Increment a slider by ten steps

  • Applies to: JAWS, NVDA, macOS VoiceOver
  • Modes: interaction
  • Instructions:
    • Interaction mode: With focus on the 'Red' slider, set its value to 138.
  • Setup script description: sets focus on the 'Red' slider
Commands
AT Mode Commands
JAWS, NVDA, macOS VoiceOver interaction Page Up
Assertions
Assertion Priority
Value '138' is conveyed required
References

aria-valuenow

Decrement a slider by ten steps

  • Applies to: JAWS, NVDA, macOS VoiceOver
  • Modes: interaction
  • Instructions:
    • Interaction mode: With focus on the 'Red' slider, set its value to 118.
  • Setup script description: sets focus on the 'Red' slider
Commands
AT Mode Commands
JAWS, NVDA, macOS VoiceOver interaction Page Down
Assertions
Assertion Priority
Value '118' is conveyed required
References

aria-valuenow

Decrement a slider to the minimum value

  • Applies to: JAWS, NVDA, macOS VoiceOver
  • Modes: interaction
  • Instructions:
    • Interaction mode: With focus on the 'Red' slider, set its value to 0.
  • Setup script description: sets focus on the 'Red' slider
Commands
AT Mode Commands
JAWS, NVDA, macOS VoiceOver interaction Home
Assertions
Assertion Priority
Value '0' is conveyed required
References

aria-valuenow, aria-valuemin

Increment a slider to the maximum value

  • Applies to: JAWS, NVDA, macOS VoiceOver
  • Modes: interaction
  • Instructions:
    • Interaction mode: With focus on the 'Red' slider, set its value to 255.
  • Setup script description: sets focus on the 'Red' slider
Commands
AT Mode Commands
JAWS, NVDA, macOS VoiceOver interaction End
Assertions
Assertion Priority
Value '255' is conveyed required
References

aria-valuenow, aria-valuemax

@mcking65 mcking65 mentioned this issue Aug 16, 2023
Closed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees

@IsaDC IsaDC

Labels
None yet
Projects
None yet
Milestone
No milestone
Development

Successfully merging a pull request may close this issue.

Create tests for APG design pattern example: Color Viewer Slider w3c/aria-at
1 participant
@IsaDC