Uploaded image for project: 'Moodle'
  1. Moodle
  2. MDL-68355

Fix accessibility issues for the marking guide grading form in the forum grading UI

    XMLWordPrintable

Details

    • MOODLE_38_STABLE
    • MOODLE_38_STABLE
    • MDL-68355-master
    • Hide
      Prerequisite
      1. A screen reader (e.g. Chromevox, NVDA, or JAWS)
      2. The axe - Web Accessibility Testing tool (available for Chrome)
      Setup
      1. Create a course with some enrolled students
      2. Create a forum in the course with "Whole forum grading" turned configured to use marking guide grading.
      3. Configure the marking guide to have
        • at least 2 criteria, complete with description for students and markers
        • at least 2 frequently-used comments.
      Axe
      1. Log in as a teacher.
      2. Go to the forum
      3. Press "Grade users"
      4. Open the browser's developer tools
      5. Open axe
      6. Press "Analyze"
      7. Confirm that you don't see any "Buttons must have discernible text" error.
      8. Confirm that you don't see any "Elements must have sufficient colour contrast" for the "Additional comments" labels.
      Screen reader
      1. Using your keyboard, navigate to the grading section.
      2. Tab to the button icon beside the first criterion.
      3. Confirm that the screen reader announces the button icon as "[CRITERION's NAME] information"
      4. Tab to the score text field.
      5. Confirm that it is being announced as "[CRITERION's NAME] score".
      6. Confirm that you also hear more details about the score text field. e.g. "Enter a score for [CRITERION's NAME] between 0 and [MAX SCORE VALUE]."
      7. Tab to the Additional comments field.
      8. Confirm that it is being announced as "Additional comments for criterion, [CRITERION's NAME]"
      9. Confirm that you also hear more details about the score text field. e.g. "Enter any additional comments about this criterion."
      10. Tab to the Frequently used comments button icon.
      11. Confirm that it is being announced as "Frequently used comments picker for [CRITERION's NAME] additional comments"
      Show
      Prerequisite A screen reader (e.g. Chromevox, NVDA, or JAWS) The axe - Web Accessibility Testing tool (available for Chrome) Setup Create a course with some enrolled students Create a forum in the course with " Whole forum grading " turned configured to use marking guide grading . Configure the marking guide to have at least 2 criteria, complete with description for students and markers at least 2 frequently-used comments. Axe Log in as a teacher. Go to the forum Press " Grade users " Open the browser's developer tools Open axe Press " Analyze " Confirm that you don't see any " Buttons must have discernible text " error. Confirm that you don't see any " Elements must have sufficient colour contrast " for the " Additional comments " labels. Screen reader Using your keyboard, navigate to the grading section. Tab to the button icon beside the first criterion. Confirm that the screen reader announces the button icon as " [CRITERION's NAME] information " Tab to the score text field. Confirm that it is being announced as " [CRITERION's NAME] score ". Confirm that you also hear more details about the score text field. e.g. " Enter a score for [CRITERION's NAME] between 0 and [MAX SCORE VALUE] . " Tab to the Additional comments field. Confirm that it is being announced as " Additional comments for criterion, [CRITERION's NAME] " Confirm that you also hear more details about the score text field. e.g. " Enter any additional comments about this criterion. " Tab to the Frequently used comments button icon. Confirm that it is being announced as " Frequently used comments picker for [CRITERION's NAME] additional comments "
    • 1
    • International 3.9 - Sprint 9

    Description

      Axe reports 2 accessibility issues for the marking guide grading form in the forum grading UI.

      1. Empty button description for the criterion description. e.g.

        <button class="btn btn-link px-1" aria-controls="gradingform_guide-7-criteria-5-description" aria-expanded="false" data-target="#gradingform_guide-7-criteria-5-description" data-toggle="collapse" type="button">
        

      2. Empty button description for the frequently-used comments picker button. e.g.

        <button class="btn btn-icon form-inset-item icon-no-margin p-0 mt-1 mr-1 text-reset" aria-controls="gradingform_guide-7-criteria-5-remark-frequent-comments" aria-expanded="true" data-toggle="collapse" data-target="#gradingform_guide-7-criteria-5-remark-frequent-comments" type="button" id="yui_3_17_2_1_1586240583780_992">
        

      Attachments

        Issue Links

          Activity

            People

              jpataleta Jun Pataleta
              jpataleta Jun Pataleta
              Bas Brands Bas Brands
              Jake Dallimore Jake Dallimore
              Anna Carissa Sadia Anna Carissa Sadia
              Jun Pataleta, Adrian Greeve, Ilya Tregubov, Kevin Percy, Mathew May, Mihail Geshoski, Shamim Rezaie, Ilya Tregubov, Kevin Percy, Mathew May, Mihail Geshoski, Shamim Rezaie
              Votes:
              0 Vote for this issue
              Watchers:
              6 Start watching this issue

              Dates

                Created:
                Updated:
                Resolved:
                11/May/20

                Time Tracking

                  Estimated:
                  Original Estimate - Not Specified
                  Not Specified
                  Remaining:
                  Remaining Estimate - 0 minutes
                  0m
                  Logged:
                  Time Spent - 1 day, 3 hours, 21 minutes
                  1d 3h 21m