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

Course management: insufficient colour contrast

    XMLWordPrintable

Details

    • MOODLE_37_STABLE, MOODLE_38_STABLE
    • MOODLE_37_STABLE, MOODLE_38_STABLE
    • MDL-68266-master
    • Hide

      Functional testing

      1. Log in as admin
      2. Navigate to Site Administration > Courses > Manage courses and categories
      3. Create 3 categories "Cat A", "Cat B", "Cat C" with Parent category "Top"
      4. For "Cat A" set the field "Category ID number" to be "Cat0123"
      5. Create 2 courses in "Cat A" named "Mathematics" and "Science"
        1. Verify you see a blue left border for the active category
        2. Verify you see checkboxes for each category
        3. Verify you see the grey text "Cat0123" in the row of "Cat A"
      6. Select "Cat B" and choose "Move selected categories to:" "Cat A"
        1. Verify "Cat B" is now a subcategory of "Cat A"
      7. Scroll down the page to the "Search courses" input
      8. Search for "Math"
        1. Verify you see course "Mathematics"
        2. Verify you see a checkbox for course "Mathematics"

      Accessibility testing

      1. Install a tool like the chrome plugins Axe or Wave for accessibility testing
        Note: You may see an occurrece of "Elements must have sufficient color contrast" for the "#menuselectsortby" element
        This is not a fail. It is picked up because the Axe tool is unable to distinguish the relative size of the up/down arrows which are shown in the dropdown and therefore is unable to determine whether they are conformant or not.
        The same applies for any other dropdown selects visible on the page
        1. Verify the page passes the colour contrast checks
      Show
      Functional testing Log in as admin Navigate to Site Administration > Courses > Manage courses and categories Create 3 categories "Cat A", "Cat B", "Cat C" with Parent category "Top" For "Cat A" set the field "Category ID number" to be "Cat0123" Create 2 courses in "Cat A" named "Mathematics" and "Science" Verify you see a blue left border for the active category Verify you see checkboxes for each category Verify you see the grey text "Cat0123" in the row of "Cat A" Select "Cat B" and choose "Move selected categories to:" "Cat A" Verify "Cat B" is now a subcategory of "Cat A" Scroll down the page to the "Search courses" input Search for "Math" Verify you see course "Mathematics" Verify you see a checkbox for course "Mathematics" Accessibility testing Install a tool like the chrome plugins Axe or Wave for accessibility testing Note: You may see an occurrece of "Elements must have sufficient color contrast" for the " #menuselectsortby " element This is not a fail. It is picked up because the Axe tool is unable to distinguish the relative size of the up/down arrows which are shown in the dropdown and therefore is unable to determine whether they are conformant or not. The same applies for any other dropdown selects visible on the page Verify the page passes the colour contrast checks

    Description

      The course management page has insufficient colour contrast for:

      • graduation cap icons with number of courses
      • category idnumber display (scitech)
      • borders around checkboxes

      Guidelines affected

      1.4.11 Non-text Contrast:
      1.4.11 The visual presentation of the following have a contrast ratio of at least 3:1 against adjacent color(s):

      Attachments

        Issue Links

          Activity

            People

              basbrands Bas Brands
              basbrands Bas Brands
              Jun Pataleta Jun Pataleta
              Andrew Lyons Andrew Lyons
              Janelle Barcega Janelle Barcega
              Andrew Lyons, Huong Nguyen, Jun Pataleta, Michael Hawkins, Shamim Rezaie, Simey Lameze, Stevani Andolo, Amaia Anabitarte, Carlos Escobedo, Ferran Recio, Ilya Tregubov, Laurent David, Raquel Ortega, Sara Arjona (@sarjona)
              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 - 6 hours, 24 minutes
                  6h 24m