Accessibility: Make Safari 10 + VoiceOver announce repeated, identical, `wp.a11y.speak()` messages.

Safari 10 + VoiceOver don't announce repeated, identical, strings sent to an 
`aria-live` region. Appending a `no-break space` to a repeated message string,
forces them to think the strings are different.

Fixes #36853.

Built from https://develop.svn.wordpress.org/trunk@40479


git-svn-id: http://core.svn.wordpress.org/trunk@40355 1a063a9b-81f0-0310-95a4-ce76da25c4cd
This commit is contained in:
Andrea Fercia 2017-04-19 19:53:42 +00:00
parent 7977451301
commit 711796d172
3 changed files with 15 additions and 3 deletions

View File

@ -4,7 +4,8 @@ window.wp = window.wp || {};
'use strict'; 'use strict';
var $containerPolite, var $containerPolite,
$containerAssertive; $containerAssertive,
previousMessage = '';
/** /**
* Update the ARIA live notification area text node. * Update the ARIA live notification area text node.
@ -23,6 +24,17 @@ window.wp = window.wp || {};
// Ensure only text is sent to screen readers. // Ensure only text is sent to screen readers.
message = $( '<p>' ).html( message ).text(); 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 ) { if ( $containerAssertive && 'assertive' === ariaLive ) {
$containerAssertive.text( message ); $containerAssertive.text( message );
} else if ( $containerPolite ) { } else if ( $containerPolite ) {

View File

@ -1 +1 @@
window.wp=window.wp||{},function(a,b){"use strict";function c(a,c){e(),a=b("<p>").html(a).text(),g&&"assertive"===c?g.text(a):f&&f.text(a)}function d(a){a=a||"polite";var c=b("<div>",{id:"wp-a11y-speak-"+a,"aria-live":a,"aria-relevant":"additions text","aria-atomic":"true","class":"screen-reader-text wp-a11y-speak-region"});return b(document.body).append(c),c}function e(){b(".wp-a11y-speak-region").text("")}var f,g;b(document).ready(function(){f=b("#wp-a11y-speak-polite"),g=b("#wp-a11y-speak-assertive"),f.length||(f=d("polite")),g.length||(g=d("assertive"))}),a.a11y=a.a11y||{},a.a11y.speak=c}(window.wp,window.jQuery); window.wp=window.wp||{},function(a,b){"use strict";function c(a,c){e(),a=b("<p>").html(a).text(),h===a&&(a+="\xa0"),h=a,g&&"assertive"===c?g.text(a):f&&f.text(a)}function d(a){a=a||"polite";var c=b("<div>",{id:"wp-a11y-speak-"+a,"aria-live":a,"aria-relevant":"additions text","aria-atomic":"true","class":"screen-reader-text wp-a11y-speak-region"});return b(document.body).append(c),c}function e(){b(".wp-a11y-speak-region").text("")}var f,g,h="";b(document).ready(function(){f=b("#wp-a11y-speak-polite"),g=b("#wp-a11y-speak-assertive"),f.length||(f=d("polite")),g.length||(g=d("assertive"))}),a.a11y=a.a11y||{},a.a11y.speak=c}(window.wp,window.jQuery);

View File

@ -4,7 +4,7 @@
* *
* @global string $wp_version * @global string $wp_version
*/ */
$wp_version = '4.8-alpha-40478'; $wp_version = '4.8-alpha-40479';
/** /**
* Holds the WordPress DB revision, increments when changes are made to the WordPress DB schema. * Holds the WordPress DB revision, increments when changes are made to the WordPress DB schema.