Merge branch 'MDL-74741-311' of https://github.com/rezaies/moodle into MOODLE_311_STABLE

lib/yui/build/moodle-core-dragdrop/moodle-core-dragdrop-debug.js

@@ -471,6 +471,7 @@ Y.extend(DRAGDROP, Y.Base, {
                 listlink.setAttribute('data-drop-target', node.get('id'));
                 // Allow tabbing to the link.
                 listlink.setAttribute('tabindex', '0');
+                listlink.setAttribute('role', 'button');
 
                 // Set the event listeners for enter, space or click.
                 listlink.on('click', this.global_keyboard_drop, this);

lib/yui/build/moodle-core-dragdrop/moodle-core-dragdrop.js

@@ -471,6 +471,7 @@ Y.extend(DRAGDROP, Y.Base, {
                 listlink.setAttribute('data-drop-target', node.get('id'));
                 // Allow tabbing to the link.
                 listlink.setAttribute('tabindex', '0');
+                listlink.setAttribute('role', 'button');
 
                 // Set the event listeners for enter, space or click.
                 listlink.on('click', this.global_keyboard_drop, this);

lib/yui/build/moodle-core-notification-dialogue/moodle-core-notification-dialogue-debug.js

@@ -176,6 +176,13 @@ Y.extend(DIALOGUE, Y.Panel, {
 
         if (this.get('visible')) {
             this.applyZIndex();
+            this.applyAndTrapFocus();
+            // Only do accessibility hiding for modals because the ARIA spec
+            // says that all ARIA dialogues should be modal.
+            if (this.get('modal')) {
+                // Make this dialogue visible to screen readers.
+                this.setAccessibilityVisible();
+            }
         }
         // Recalculate the zIndex every time the modal is altered.
         this.on('maskShow', this.applyZIndex);
@@ -420,35 +427,12 @@ Y.extend(DIALOGUE, Y.Panel, {
     },
 
     show: function() {
-        var result = null,
+        var result = DIALOGUE.superclass.show.call(this);
-            content = this.bodyNode,
-            focusSelector = this.get('focusOnShowSelector'),
-            focusNode = null;
-
-        result = DIALOGUE.superclass.show.call(this);
-
         if (!this.get('center') && this._originalPosition) {
             // Restore the dialogue position to it's location before it was moved at show time.
             this.get('boundingBox').setXY(this._originalPosition);
         }
-
+        this.applyAndTrapFocus();
-        // Try and find a node to focus on using the focusOnShowSelector attribute.
-        if (focusSelector !== null) {
-            focusNode = this.get('boundingBox').one(focusSelector);
-        }
-        if (!focusNode) {
-            // Fall back to the first focusable element in the body of the dialogue if no focus node was found yet.
-            if (content && content !== '') {
-                focusNode = content.one(CAN_RECEIVE_FOCUS_SELECTOR);
-            }
-        }
-        require(['core/local/aria/focuslock'], function(FocusLockManager) {
-            // Trap focus to the current bounding box.
-            FocusLockManager.trapFocus(this.get('boundingBox').getDOMNode());
-            if (focusNode) {
-                focusNode.focus();
-            }
-        }.bind(this));
         return result;
     },
 
@@ -571,7 +555,37 @@ Y.extend(DIALOGUE, Y.Panel, {
 
         // Clear the cache. No longer need to store these.
         this._hiddenSiblings = [];
+    },
+
+    /**
+     * Focuses on the node specified by focusOnShowSelector, or the first focusable node if nothing is specified.
+     * It also traps the focus to the current bounding box.
+     *
+     * @method applyAndTrapFocus
+     */
+    applyAndTrapFocus: function() {
+        var content = this.bodyNode;
+        var focusSelector = this.get('focusOnShowSelector');
+        var focusNode = null;
+
+        // Try and find a node to focus on using the focusOnShowSelector attribute.
+        if (focusSelector !== null) {
+            focusNode = this.get('boundingBox').one(focusSelector);
         }
+        if (!focusNode) {
+            // Fall back to the first focusable element in the body of the dialogue if no focus node was found yet.
+            if (content && content !== '') {
+                focusNode = content.one(CAN_RECEIVE_FOCUS_SELECTOR);
+            }
+        }
+        require(['core/local/aria/focuslock'], function(FocusLockManager) {
+            // Trap focus to the current bounding box.
+            FocusLockManager.trapFocus(this.get('boundingBox').getDOMNode());
+            if (focusNode) {
+                focusNode.focus();
+            }
+        }.bind(this));
+    },
 }, {
     NAME: DIALOGUE_NAME,
     CSS_PREFIX: DIALOGUE_PREFIX,

lib/yui/build/moodle-core-notification-dialogue/moodle-core-notification-dialogue.js

@@ -176,6 +176,13 @@ Y.extend(DIALOGUE, Y.Panel, {
 
         if (this.get('visible')) {
             this.applyZIndex();
+            this.applyAndTrapFocus();
+            // Only do accessibility hiding for modals because the ARIA spec
+            // says that all ARIA dialogues should be modal.
+            if (this.get('modal')) {
+                // Make this dialogue visible to screen readers.
+                this.setAccessibilityVisible();
+            }
         }
         // Recalculate the zIndex every time the modal is altered.
         this.on('maskShow', this.applyZIndex);
@@ -420,35 +427,12 @@ Y.extend(DIALOGUE, Y.Panel, {
     },
 
     show: function() {
-        var result = null,
+        var result = DIALOGUE.superclass.show.call(this);
-            content = this.bodyNode,
-            focusSelector = this.get('focusOnShowSelector'),
-            focusNode = null;
-
-        result = DIALOGUE.superclass.show.call(this);
-
         if (!this.get('center') && this._originalPosition) {
             // Restore the dialogue position to it's location before it was moved at show time.
             this.get('boundingBox').setXY(this._originalPosition);
         }
-
+        this.applyAndTrapFocus();
-        // Try and find a node to focus on using the focusOnShowSelector attribute.
-        if (focusSelector !== null) {
-            focusNode = this.get('boundingBox').one(focusSelector);
-        }
-        if (!focusNode) {
-            // Fall back to the first focusable element in the body of the dialogue if no focus node was found yet.
-            if (content && content !== '') {
-                focusNode = content.one(CAN_RECEIVE_FOCUS_SELECTOR);
-            }
-        }
-        require(['core/local/aria/focuslock'], function(FocusLockManager) {
-            // Trap focus to the current bounding box.
-            FocusLockManager.trapFocus(this.get('boundingBox').getDOMNode());
-            if (focusNode) {
-                focusNode.focus();
-            }
-        }.bind(this));
         return result;
     },
 
@@ -570,7 +554,37 @@ Y.extend(DIALOGUE, Y.Panel, {
 
         // Clear the cache. No longer need to store these.
         this._hiddenSiblings = [];
+    },
+
+    /**
+     * Focuses on the node specified by focusOnShowSelector, or the first focusable node if nothing is specified.
+     * It also traps the focus to the current bounding box.
+     *
+     * @method applyAndTrapFocus
+     */
+    applyAndTrapFocus: function() {
+        var content = this.bodyNode;
+        var focusSelector = this.get('focusOnShowSelector');
+        var focusNode = null;
+
+        // Try and find a node to focus on using the focusOnShowSelector attribute.
+        if (focusSelector !== null) {
+            focusNode = this.get('boundingBox').one(focusSelector);
         }
+        if (!focusNode) {
+            // Fall back to the first focusable element in the body of the dialogue if no focus node was found yet.
+            if (content && content !== '') {
+                focusNode = content.one(CAN_RECEIVE_FOCUS_SELECTOR);
+            }
+        }
+        require(['core/local/aria/focuslock'], function(FocusLockManager) {
+            // Trap focus to the current bounding box.
+            FocusLockManager.trapFocus(this.get('boundingBox').getDOMNode());
+            if (focusNode) {
+                focusNode.focus();
+            }
+        }.bind(this));
+    },
 }, {
     NAME: DIALOGUE_NAME,
     CSS_PREFIX: DIALOGUE_PREFIX,

lib/yui/src/dragdrop/js/dragdrop.js

@@ -469,6 +469,7 @@ Y.extend(DRAGDROP, Y.Base, {
                 listlink.setAttribute('data-drop-target', node.get('id'));
                 // Allow tabbing to the link.
                 listlink.setAttribute('tabindex', '0');
+                listlink.setAttribute('role', 'button');
 
                 // Set the event listeners for enter, space or click.
                 listlink.on('click', this.global_keyboard_drop, this);

lib/yui/src/notification/js/dialogue.js

@@ -146,6 +146,13 @@ Y.extend(DIALOGUE, Y.Panel, {
 
         if (this.get('visible')) {
             this.applyZIndex();
+            this.applyAndTrapFocus();
+            // Only do accessibility hiding for modals because the ARIA spec
+            // says that all ARIA dialogues should be modal.
+            if (this.get('modal')) {
+                // Make this dialogue visible to screen readers.
+                this.setAccessibilityVisible();
+            }
         }
         // Recalculate the zIndex every time the modal is altered.
         this.on('maskShow', this.applyZIndex);
@@ -390,35 +397,12 @@ Y.extend(DIALOGUE, Y.Panel, {
     },
 
     show: function() {
-        var result = null,
+        var result = DIALOGUE.superclass.show.call(this);
-            content = this.bodyNode,
-            focusSelector = this.get('focusOnShowSelector'),
-            focusNode = null;
-
-        result = DIALOGUE.superclass.show.call(this);
-
         if (!this.get('center') && this._originalPosition) {
             // Restore the dialogue position to it's location before it was moved at show time.
             this.get('boundingBox').setXY(this._originalPosition);
         }
-
+        this.applyAndTrapFocus();
-        // Try and find a node to focus on using the focusOnShowSelector attribute.
-        if (focusSelector !== null) {
-            focusNode = this.get('boundingBox').one(focusSelector);
-        }
-        if (!focusNode) {
-            // Fall back to the first focusable element in the body of the dialogue if no focus node was found yet.
-            if (content && content !== '') {
-                focusNode = content.one(CAN_RECEIVE_FOCUS_SELECTOR);
-            }
-        }
-        require(['core/local/aria/focuslock'], function(FocusLockManager) {
-            // Trap focus to the current bounding box.
-            FocusLockManager.trapFocus(this.get('boundingBox').getDOMNode());
-            if (focusNode) {
-                focusNode.focus();
-            }
-        }.bind(this));
         return result;
     },
 
@@ -541,7 +525,37 @@ Y.extend(DIALOGUE, Y.Panel, {
 
         // Clear the cache. No longer need to store these.
         this._hiddenSiblings = [];
+    },
+
+    /**
+     * Focuses on the node specified by focusOnShowSelector, or the first focusable node if nothing is specified.
+     * It also traps the focus to the current bounding box.
+     *
+     * @method applyAndTrapFocus
+     */
+    applyAndTrapFocus: function() {
+        var content = this.bodyNode;
+        var focusSelector = this.get('focusOnShowSelector');
+        var focusNode = null;
+
+        // Try and find a node to focus on using the focusOnShowSelector attribute.
+        if (focusSelector !== null) {
+            focusNode = this.get('boundingBox').one(focusSelector);
         }
+        if (!focusNode) {
+            // Fall back to the first focusable element in the body of the dialogue if no focus node was found yet.
+            if (content && content !== '') {
+                focusNode = content.one(CAN_RECEIVE_FOCUS_SELECTOR);
+            }
+        }
+        require(['core/local/aria/focuslock'], function(FocusLockManager) {
+            // Trap focus to the current bounding box.
+            FocusLockManager.trapFocus(this.get('boundingBox').getDOMNode());
+            if (focusNode) {
+                focusNode.focus();
+            }
+        }.bind(this));
+    },
 }, {
     NAME: DIALOGUE_NAME,
     CSS_PREFIX: DIALOGUE_PREFIX,