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

Colour contrast issues with the accessibility toolkit's heatmap

XMLWordPrintable

    • MOODLE_401_STABLE, MOODLE_403_STABLE, MOODLE_404_STABLE, MOODLE_405_STABLE
    • MOODLE_401_STABLE, MOODLE_403_STABLE, MOODLE_404_STABLE
    • MDL-79288-401_blockaccessreview_colourcontrastcheck
    • MDL-79288-403_blockaccessreview_colourcontrastcheck
    • MDL-79288-404_blockaccessreview_colourcontrastcheck
    • MDL-79288-main_blockaccessreview_colourcontrastcheck
    • Hide

      Setup:

      To test this, the site needs to be registered with Brickfield. If you don't have a Brickfield account, you can register here.

      1. Activate your site with Brickfield in "Site administration / Plugins / Admin tools / Accessibility / Brickfield registration" by entering the API and Secret keys.
      2. Enable analysis requests in "Site administration / Plugins / Admin tools / Accessibility / Accessibility toolkit settings".

      Test:

      1. Download and restore the test course: a11ytest_course.mbz
      2. Add the "Accessibility review" block to the course.
      3. Click on the "Submit to Analysis" button to request that the course be analyzed using the accessibility toolkit.
      4. Run cron. (You should edit the brickfield cron tasks at Site administration > Server > Tasks > Scheduled tasks to run every minute to speed up this analysis process so that the brickfield task is run the very next time you run cron.)
      5. When the accessibility check has been completed, turn on the heatmap (eye icon) on the accessibility review block.
      6. You should see
        • A page resource with a status of "Failed - error count: 1"
        • Another page resource with a status of "Failed - error count: 2".
        • The rest of the activities with a "Passed" status.
      7. Check the page with an accessibility checker (e.g. axe DevTools).
      8. Confirm that there are no failures related to colour contrast.
      Show
      Setup: To test this, the site needs to be registered with Brickfield. If you don't have a Brickfield account, you can register here . Activate your site with Brickfield in "Site administration / Plugins / Admin tools / Accessibility / Brickfield registration" by entering the API and Secret keys. Enable analysis requests in "Site administration / Plugins / Admin tools / Accessibility / Accessibility toolkit settings". Test: Download and restore the test course: a11ytest_course.mbz Add the "Accessibility review" block to the course. Click on the "Submit to Analysis" button to request that the course be analyzed using the accessibility toolkit. Run cron. (You should edit the brickfield cron tasks at Site administration > Server > Tasks > Scheduled tasks to run every minute to speed up this analysis process so that the brickfield task is run the very next time you run cron.) When the accessibility check has been completed, turn on the heatmap (eye icon) on the accessibility review block. You should see A page resource with a status of " Failed - error count: 1 " Another page resource with a status of " Failed - error count: 2 ". The rest of the activities with a " Passed " status. Check the page with an accessibility checker (e.g. axe DevTools). Confirm that there are no failures related to colour contrast.

      To reproduce:

      1. Set up the accessibility toolkit on your Moodle instance as per the documentation. (You may need to expose your instance over the internet. This can be done using ngrok)
      2. Add the Accessibility review block to a course.
      3. Check the accessibility of the course's contents (See the docs. You may also need to run cron).
      4. When the accessibility check has been completed, turn on the heatmap (eye icon) on the accessibility review block.
      5. Check the page with an accessibility checker (e.g. axe DevTools)
      6. Expected: There should be no colour contrast issues on the page.
      7. Actual: Colour contrast issues are reported by the accessibility checker.

        1. (1) 6 Passed -- (Main)MDL-79288.png
          (1) 6 Passed -- (Main)MDL-79288.png
          126 kB
        2. (1) 8 Passed -- (Main)MDL-79288.png
          (1) 8 Passed -- (Main)MDL-79288.png
          144 kB
        3. a11ytest_course.mbz
          19 kB
        4. accessibility_heatmap_lighter_colours.png
          accessibility_heatmap_lighter_colours.png
          35 kB
        5. Adding border to heatmap items.png
          Adding border to heatmap items.png
          167 kB
        6. block_review_newcss.png
          block_review_newcss.png
          38 kB
        7. contrast issues on course homepage.png
          contrast issues on course homepage.png
          338 kB
        8. first_child_item.png
          first_child_item.png
          107 kB
        9. patchformain.png
          patchformain.png
          64 kB
        10. second_child_item.png
          second_child_item.png
          106 kB

            mpound Michael Pound
            jpataleta Jun Pataleta
            Karen Holland Karen Holland
            Jun Pataleta Jun Pataleta
            Kim Jared Lucas Kim Jared Lucas
            Votes:
            0 Vote for this issue
            Watchers:
            6 Start watching this issue

              Created:
              Updated:
              Resolved:

                Estimated:
                Original Estimate - 0 minutes
                0m
                Remaining:
                Remaining Estimate - 0 minutes
                0m
                Logged:
                Time Spent - 50 minutes
                50m

                  Error rendering 'clockify-timesheets-time-tracking-reports:timer-sidebar'. Please contact your Jira administrators.