Ticket #32600: 32600.patch

src/wp-includes/js/wp-a11y.js

@@ -3 +3 @@
 ( function ( wp, $ ) {
         'use strict';
 
-        var $container;
+        var $containerPolite,
+                $containerAssertive;
 
         /**
          * Update the ARIA live notification area text node.
          *
          * @since 4.2.0
+         * @since 4.3.0 Introduced the 'politeness' argument.
          *
-         * @param {String} message
+         * @param {String} message    The message to be announced by Assistive Technologies.
+         * @param {String} politeness The politeness level for aria-live. Possible values:
+         *                            polite or assertive. Default polite.
          */
-        function speak( message ) {
-                if ( $container ) {
-                        $container.text( message );
+        function speak( message, politeness ) {
+
+                // Clear previous messages if any to allow repeated strings being read out.
+                clearSpeak();
+
+                if ( $containerAssertive && 'assertive' === politeness ) {
+
+                        // Print the message to the assertive live region.
+                        $containerAssertive.text( message );
+
+                } else if ( $containerPolite ) {
+
+                        // Print the message to the polite live region.
+                        $containerPolite.text( message );
+
                 }
         }
 
@@ -22 +38 @@
          * Initialize wp.a11y and define ARIA live notification area.
          *
          * @since 4.2.0
+         * @since 4.3.0 Added the assertive live region.
          */
         $( document ).ready( function() {
-                $container = $( '#wp-a11y-speak' );
+                $containerPolite = $( '#wp-a11y-speak-polite' );
+                $containerAssertive = $( '#wp-a11y-speak-assertive' );
 
-                if ( ! $container.length ) {
-                        $container = $( '<div>', {
-                                id: 'wp-a11y-speak',
-                                role: 'status',
+                if ( ! $containerPolite.length ) {
+
+                        $containerPolite = $( '<div>', {
+                                'id': 'wp-a11y-speak-polite',
+                                'role': 'status',
                                 'aria-live': 'polite',
-                                'aria-relevant': 'all',
+                                'aria-relevant': 'additions text',
                                 'aria-atomic': 'true',
-                                'class': 'screen-reader-text'
-                        } );
+                                'class': 'screen-reader-text wp-a11y-speak-region'
+                        });
 
-                        $( document.body ).append( $container );
+                        $( document.body ).append( $containerPolite );
                 }
-        } );
 
+                if ( ! $containerAssertive.length ) {
+
+                        $containerAssertive = $( '<div>', {
+                                'id': 'wp-a11y-speak-assertive',
+                                'role': 'status',
+                                'aria-live': 'assertive',
+                                'aria-relevant': 'additions text',
+                                'aria-atomic': 'true',
+                                'class': 'screen-reader-text wp-a11y-speak-region'
+                        });
+
+                        $( document.body ).append( $containerAssertive );
+                }
+        });
+
+        /**
+         * Clear the live regions.
+         *
+         * @since 4.3.0
+         */
+        function clearSpeak() {
+                $( '.wp-a11y-speak-region' ).text( '' );
+        }
+
         wp.a11y = wp.a11y || {};
         wp.a11y.speak = speak;