Merge pull request #1493 from edx/flowerhack/fix/wiki-textarea-trap

Fixing accessibility bug where users could not tab through on wiki

CHANGELOG.rst

@@ -32,6 +32,8 @@ Studio: Change course overview page, checklists, assets, and course staff
 management page URLs to a RESTful interface. Also removed "\listing", which
 duplicated "\index".
 
+LMS: Fixed accessibility bug where users could not tab through wiki (LMS-1307)
+
 Blades: When start time and end time are specified for a video, a visual range
 will be shown on the time slider to highlight the place in the video that will
 be played.

lms/djangoapps/course_wiki/editors.py

@@ -58,6 +58,7 @@ class CodeMirror(BaseEditor):
         js = ("js/vendor/CodeMirror/codemirror.js",
               "js/vendor/CodeMirror/xml.js",
               "js/vendor/CodeMirror/mitx_markdown.js",
+              "js/wiki/accessible.js",
               "js/wiki/CodeMirror.init.js",
               "js/wiki/cheatsheet.js",
               )

lms/static/js/wiki/CodeMirror.init.js

@@ -5,6 +5,7 @@ $(document).ready(function() {
     matchBrackets: true,
     theme: "default",
     lineWrapping: true,
+    keyMap: "accessible"
   });
       
   //Store the inital contents so we can compare for unsaved changes

lms/static/js/wiki/accessible.js

+/* By default, CodeMirror turns tabs into indents, which makes it difficult for keyboard-only
+   users to "tab through" elements on a page.  Including this file and setting keyMap to 
+   "accessible" removes the "tab" from CodeMirror's default KeyMap to remedy this problem */
+
+(function() {
+  var keyMap = CodeMirror.keyMap.accessible = {
+    "Tab": false,
+    "Shift-Tab": false, 
+    fallthrough: "default"
+  };
+})();