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

Trap focus for open modal (backport of MDL-35926)

    Details

    • Testing Instructions:
      Hide
      1. Login as a student
      2. Navigate to a course
      3. Click the assignment
      4. Click add submissions
      5. Click the Add... button in the file picker
      • Tab through the page and make sure it only select the elements within the modal.

      Additional Test (optional):

      • Repeat the above steps with screenreader on and make sure the screen reader only read elements within the modal.

      Notes: This patch only affects the forward tab direct, shift tab will still get out of the loop. It also only affects a limited set of windows - which are just the ones from filepicker/filemanager (e.g. file properties, create folder, unzip etc).

      Show
      Login as a student Navigate to a course Click the assignment Click add submissions Click the Add... button in the file picker Tab through the page and make sure it only select the elements within the modal. Additional Test (optional): Repeat the above steps with screenreader on and make sure the screen reader only read elements within the modal. Notes: This patch only affects the forward tab direct, shift tab will still get out of the loop. It also only affects a limited set of windows - which are just the ones from filepicker/filemanager (e.g. file properties, create folder, unzip etc).
    • Affected Branches:
      MOODLE_24_STABLE, MOODLE_25_STABLE
    • Fixed Branches:
      MOODLE_25_STABLE
    • Pull from Repository:
    • Sprint:
      FRONTEND Sprint 8

      Description

      Issue
      Context change - When the user activates Add.. modal, the focus is not being put in the modal window but is being sent back to the top of the page. Screen reader and keyboard users now have to make their way back to the modal window, only to find out it's impossible to get back in it (and therefore, close it).

      Standard Level
      WCAG 2 3.2.2 (A) http://www.w3.org/WAI/WCAG20/quickref/#qr-minimize-error-cues

      Impact
      Critical

      Example Link
      http://demo.moodle.net/mod/assign/view.php?id=1778&action=editsubmission

      Test Steps

      1. Login as a student
      2. Navigate to a course
      3. Click the assignment
      4. Click add submissions
      5. Click the Add... button in the file picker with a screen reader one
      6. Notice the screen reader starts reading at the top of the page.

        Gliffy Diagrams

          Attachments

            Issue Links

              Activity

                People

                • Votes:
                  0 Vote for this issue
                  Watchers:
                  6 Start watching this issue

                  Dates

                  • Created:
                    Updated:
                    Resolved:
                    Fix Release Date:
                    10/Mar/14