--- a/wp/wp-includes/js/wp-a11y.js Tue Jun 09 11:14:17 2015 +0000
+++ b/wp/wp-includes/js/wp-a11y.js Mon Oct 14 17:39:30 2019 +0200
@@ -1,46 +1,103 @@
+/** @namespace wp */
window.wp = window.wp || {};
( function ( wp, $ ) {
'use strict';
- var $container;
+ var $containerPolite,
+ $containerAssertive,
+ previousMessage = '';
/**
* Update the ARIA live notification area text node.
*
* @since 4.2.0
+ * @since 4.3.0 Introduced the 'ariaLive' argument.
*
- * @param {String} message
+ * @param {String} message The message to be announced by Assistive Technologies.
+ * @param {String} [ariaLive] The politeness level for aria-live. Possible values:
+ * polite or assertive. Default polite.
+ * @returns {void}
*/
- function speak( message ) {
- if ( $container ) {
- $container.text( message );
+ function speak( message, ariaLive ) {
+ // Clear previous messages to allow repeated strings being read out.
+ clear();
+
+ // Ensure only text is sent to screen readers.
+ message = $( '<p>' ).html( message ).text();
+
+ /*
+ * Safari 10+VoiceOver don't announce repeated, identical strings. We use
+ * a `no-break space` to force them to think identical strings are different.
+ * See ticket #36853.
+ */
+ if ( previousMessage === message ) {
+ message = message + '\u00A0';
+ }
+
+ previousMessage = message;
+
+ if ( $containerAssertive && 'assertive' === ariaLive ) {
+ $containerAssertive.text( message );
+ } else if ( $containerPolite ) {
+ $containerPolite.text( message );
}
}
/**
+ * Build the live regions markup.
+ *
+ * @since 4.3.0
+ *
+ * @param {String} ariaLive Optional. Value for the 'aria-live' attribute, default 'polite'.
+ *
+ * @return {Object} $container The ARIA live region jQuery object.
+ */
+ function addContainer( ariaLive ) {
+ ariaLive = ariaLive || 'polite';
+
+ var $container = $( '<div>', {
+ 'id': 'wp-a11y-speak-' + ariaLive,
+ 'aria-live': ariaLive,
+ 'aria-relevant': 'additions text',
+ 'aria-atomic': 'true',
+ 'class': 'screen-reader-text wp-a11y-speak-region'
+ });
+
+ $( document.body ).append( $container );
+ return $container;
+ }
+
+ /**
+ * Clear the live regions.
+ *
+ * @since 4.3.0
+ */
+ function clear() {
+ $( '.wp-a11y-speak-region' ).text( '' );
+ }
+
+ /**
* 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 ( ! $containerPolite.length ) {
+ $containerPolite = addContainer( 'polite' );
+ }
- if ( ! $container.length ) {
- $container = $( '<div>', {
- id: 'wp-a11y-speak',
- role: 'status',
- 'aria-live': 'polite',
- 'aria-relevant': 'all',
- 'aria-atomic': 'true',
- 'class': 'screen-reader-text'
- } );
+ if ( ! $containerAssertive.length ) {
+ $containerAssertive = addContainer( 'assertive' );
+ }
+ });
- $( document.body ).append( $container );
- }
- } );
-
+ /** @namespace wp.a11y */
wp.a11y = wp.a11y || {};
wp.a11y.speak = speak;
-} )( window.wp, window.jQuery );
+}( window.wp, window.jQuery ));