PressThis: accessibility enhancements:

- Add missing form labels.
- Add some screen-reader-text and aria-hidden attributes.
- Focus handling improvements.
- Change tagcloud-link into a button.
- Add missing ID attribute in tools.php.
Props afercia. Fixes #31449.
Built from https://develop.svn.wordpress.org/trunk@31566


git-svn-id: http://core.svn.wordpress.org/trunk@31547 1a063a9b-81f0-0310-95a4-ce76da25c4cd

wp-admin/css/press-this-rtl.css

@@ -217,9 +217,9 @@ input[type="search"]::-webkit-search-decoration {
 }
 
 fieldset {
-	border: 1px solid #c0c0c0;
-	margin: 0 2px;
-	padding: 0.35em 0.625em 0.75em;
+	border: 0;
+	margin: 0;
+	padding: 0;
 }
 
 legend {

wp-admin/css/press-this.css

@@ -217,9 +217,9 @@ input[type="search"]::-webkit-search-decoration {
 }
 
 fieldset {
-	border: 1px solid #c0c0c0;
-	margin: 0 2px;
-	padding: 0.35em 0.625em 0.75em;
+	border: 0;
+	margin: 0;
+	padding: 0;
 }
 
 legend {

wp-admin/includes/class-wp-press-this.php

@@ -537,6 +537,7 @@ class WP_Press_This {
 
 				?>
 				<div id="post-formats-select">
+				<fieldset><legend class="screen-reader-text"><?php _e( 'Post formats' ); ?></legend>
 					<input type="radio" name="post_format" class="post-format" id="post-format-0" value="0" <?php checked( $post_format, '0' ); ?> />
 					<label for="post-format-0" class="post-format-icon post-format-standard"><?php echo get_post_format_string( 'standard' ); ?></label>
 					<?php
@@ -550,6 +551,7 @@ class WP_Press_This {
 						<?php
 					 }
 					 ?>
+				</fieldset>
 				</div>
 				<?php
 			}
@@ -569,8 +571,8 @@ class WP_Press_This {
 
 		if ( current_user_can( $taxonomy->cap->edit_terms ) ) {
 			?>
-			<button type="button" class="add-cat-toggle button-subtle">
-				<span class="dashicons dashicons-plus"></span>
+			<button type="button" class="add-cat-toggle button-subtle" aria-expanded="false">
+				<span class="dashicons dashicons-plus"></span><span class="screen-reader-text"><?php _e( 'Toggle add category' ); ?></span>
 			</button>
 			<div class="add-category is-hidden">
 				<label class="screen-reader-text" for="new-category"><?php echo $taxonomy->labels->add_new_item; ?></label>
@@ -592,12 +594,12 @@ class WP_Press_This {
 			</div>
 		<?php } ?>
 		<div class="categories-search-wrapper">
-			<input id="categories-search" type="search" class="categories-search" placeholder="<?php esc_attr_e( 'Search categories' ) ?>">
+			<input id="categories-search" type="search" class="categories-search" placeholder="<?php esc_attr_e( 'Search categories by name' ) ?>">
 			<label for="categories-search">
-				<span class="dashicons dashicons-search"></span>
+				<span class="dashicons dashicons-search"></span><span class="screen-reader-text"><?php _e( 'Search categories' ); ?></span>
 			</label>
 		</div>
-		<ul class="categories-select">
+		<ul class="categories-select" aria-label="<?php esc_attr_e( 'Categories' ); ?>">
 			<?php wp_terms_checklist( $post->ID, array( 'taxonomy' => 'category' ) ); ?>
 		</ul>
 		<?php
@@ -645,9 +647,7 @@ class WP_Press_This {
 		<?php
 		if ( $user_can_assign_terms ) {
 			?>
-			<p>
-				<a href="#titlediv" class="tagcloud-link" id="link-post_tag"><?php echo $taxonomy->labels->choose_from_most_used; ?></a>
-			</p>
+			<button type="button" class="button-reset button-link tagcloud-link" id="link-post_tag"><?php echo $taxonomy->labels->choose_from_most_used; ?></button>
 			<?php
 		}
 	}
@@ -756,6 +756,7 @@ class WP_Press_This {
 
 	<div id="scanbar" class="scan">
 		<form method="GET">
+			<label for="url-scan" class="screen-reader-text"><?php _e( 'Scan site for content' ); ?></label>
 			<input type="url" name="u" id="url-scan" class="scan-url" value="" placeholder="<?php esc_attr_e( 'Enter a URL to scan' ) ?>" />
 			<input type="submit" name="url-scan-submit" id="url-scan-submit" class="scan-submit" value="<?php esc_attr_e( 'Scan' ) ?>" />
 		</form>
@@ -842,19 +843,29 @@ class WP_Press_This {
 			<?php if ( $supports_formats ) : ?>
 				<div class="setting-modal is-off-screen is-hidden">
 					<button type="button" class="button-reset modal-close">
-						<span class="dashicons dashicons-arrow-left-alt2"></span><span class="setting-title"><?php _e( 'Post format' ); ?></span>
+						<span class="dashicons dashicons-arrow-left-alt2"></span>
+						<span class="setting-title" aria-hidden="true"><?php _e( 'Post format' ); ?></span>
+						<span class="screen-reader-text"><?php _e( 'Back to post options' ) ?></span>
 					</button>
 					<?php $this->post_formats_html( $post ); ?>
 				</div>
 			<?php endif; ?>
 
 			<div class="setting-modal is-off-screen is-hidden">
-				<button type="button" class="button-reset modal-close"><span class="dashicons dashicons-arrow-left-alt2"></span><span class="setting-title"><?php _e( 'Categories' ); ?></span></button>
+				<button type="button" class="button-reset modal-close">
+					<span class="dashicons dashicons-arrow-left-alt2"></span>
+					<span class="setting-title" aria-hidden="true"><?php _e( 'Categories' ); ?></span>
+					<span class="screen-reader-text"><?php _e( 'Back to post options' ) ?></span>
+				</button>
 				<?php $this->categories_html( $post ); ?>
 			</div>
 
 			<div class="setting-modal tags is-off-screen is-hidden">
-				<button type="button" class="button-reset modal-close"><span class="dashicons dashicons-arrow-left-alt2"></span><span class="setting-title"><?php _e( 'Tags' ); ?></span></button>
+				<button type="button" class="button-reset modal-close">
+					<span class="dashicons dashicons-arrow-left-alt2"></span>
+					<span class="setting-title" aria-hidden="true"><?php _e( 'Tags' ); ?></span>
+					<span class="screen-reader-text"><?php _e( 'Back to post options' ) ?></span>
+				</button>
 				<?php $this->tags_html( $post ); ?>
 			</div>
 		</div><!-- .options-panel -->
@@ -876,8 +887,6 @@ class WP_Press_This {
 
 	<?php
 
-		// TODO: consider running "special" press-this hooks here?
-		// Maybe better so we don't output stuff accidentally added by plugins. Would probably prevent some errors.
 		do_action( 'admin_footer', '' );
 		do_action( 'admin_print_footer_scripts' );
 

wp-admin/js/press-this.js

@@ -540,10 +540,17 @@
 		 * Save a new user-generated category via AJAX
 		 */
 		function saveNewCategory() {
-			var data = {
+			var data,
+				name = $( '#new-category' ).val();
+
+			if ( ! name ) {
+				return;
+			}
+
+			data = {
 				action: 'press-this-add-category',
 				post_id: $( '#post_ID' ).val() || 0,
-				name: $( '#new-category' ).val() || '',
+				name: name,
 				new_cat_nonce: $( '#_ajax_nonce-add-category' ).val() || '',
 				parent: $( '#new-category-parent' ).val() || 0
 			};
@@ -810,7 +817,7 @@
 				$targetSettingModal
 					.removeClass( isOffScreen + ' ' + isHidden )
 					.one( transitionEndEvent, function() {
-						$( this ).find( $modalClose ).focus();
+						$( this ).find( '.modal-close' ).focus();
 					} );
 			} );
 
@@ -827,16 +834,16 @@
 					.addClass( isOffScreen )
 					.one( transitionEndEvent, function() {
 						$( this ).addClass( isHidden );
+						$postOption.eq( index - 1 ).focus();
 					} );
 
 				// For browser that don't support transitionend.
 				if ( ! transitionEndEvent ) {
 					setTimeout( function() {
 						$targetSettingModal.addClass( isHidden );
+						$postOption.eq( index - 1 ).focus();
 					}, 350 );
 				}
-
-				$postOption.eq( index - 1 ).focus();
 			} );
 		}
 
@@ -963,14 +970,16 @@
 			} );
 
 			$( 'button.add-cat-toggle' ).on( 'click.press-this', function() {
-				$( this ).toggleClass( 'is-toggled' );
-				$( '.setting-modal .add-category' ).toggleClass( 'is-hidden' );
-				$( '.categories-search-wrapper' ).toggleClass( 'is-hidden' );
+				var $this = $( this );
+
+				$this.toggleClass( 'is-toggled' );
+				$this.attr( 'aria-expanded', ! $this.attr( 'aria-expanded' ) );
+				$( '.setting-modal .add-category, .categories-search-wrapper' ).toggleClass( 'is-hidden' );
 			} );
 
 			$( 'button.add-cat-submit' ).on( 'click.press-this', saveNewCategory );
 
-			$( '.categories-search' ).on( 'keyup', function() {
+			$( '.categories-search' ).on( 'keyup.press-this', function() {
 				var search = $( this ).val().toLowerCase() || '';
 
 				// Don't search when less thasn 3 extended ASCII chars

wp-admin/js/tags-box.js

@@ -193,7 +193,7 @@ var tagBox, array_unique_noempty;
 			});
 
 			// tag cloud
-			$('a.tagcloud-link').click(function(){
+			$('.tagcloud-link').click(function(){
 				tagBox.get( $(this).attr('id') );
 				$(this).unbind().click(function(){
 					$(this).siblings('.the-tagcloud').toggle();

wp-admin/js/tags-box.min.js

@@ -1 +1 @@
-var tagBox,array_unique_noempty;!function(a){array_unique_noempty=function(b){var c=[];return a.each(b,function(b,d){d=a.trim(d),d&&-1===a.inArray(d,c)&&c.push(d)}),c},tagBox={clean:function(a){var b=window.tagsBoxL10n.tagDelimiter;return","!==b&&(a=a.replace(new RegExp(b,"g"),",")),a=a.replace(/\s*,\s*/g,",").replace(/,+/g,",").replace(/[,\s]+$/,"").replace(/^[,\s]+/,""),","!==b&&(a=a.replace(/,/g,b)),a},parseTags:function(b){var c=b.id,d=c.split("-check-num-")[1],e=a(b).closest(".tagsdiv"),f=e.find(".the-tags"),g=window.tagsBoxL10n.tagDelimiter,h=f.val().split(g),i=[];return delete h[d],a.each(h,function(b,c){c=a.trim(c),c&&i.push(c)}),f.val(this.clean(i.join(g))),this.quickClicks(e),!1},quickClicks:function(b){var c,d,e=a(".the-tags",b),f=a(".tagchecklist",b),g=a(b).attr("id");e.length&&(d=e.prop("disabled"),c=e.val().split(window.tagsBoxL10n.tagDelimiter),f.empty(),a.each(c,function(b,c){var e,h;c=a.trim(c),c&&(e=a("<span />").text(c),d||(h=a('<a id="'+g+"-check-num-"+b+'" class="ntdelbutton" tabindex="0">X</a>'),h.on("click keypress",function(b){("click"===b.type||13===b.keyCode)&&(13===b.keyCode&&a(this).closest(".tagsdiv").find("input.newtag").focus(),tagBox.parseTags(this))}),e.prepend("&nbsp;").prepend(h)),f.append(e))}))},flushTags:function(b,c,d){var e,f,g,h=a(".the-tags",b),i=a("input.newtag",b),j=window.tagsBoxL10n.tagDelimiter;return c=c||!1,g=c?a(c).text():i.val(),e=h.val(),f=e?e+j+g:g,f=this.clean(f),f=array_unique_noempty(f.split(j)).join(j),h.val(f),this.quickClicks(b),c||i.val(""),"undefined"==typeof d&&i.focus(),!1},get:function(b){var c=b.substr(b.indexOf("-")+1);a.post(ajaxurl,{action:"get-tagcloud",tax:c},function(d,e){0!==d&&"success"==e&&(d=a('<p id="tagcloud-'+c+'" class="the-tagcloud">'+d+"</p>"),a("a",d).click(function(){return tagBox.flushTags(a("#"+c),this),!1}),a("#"+b).after(d))})},init:function(){var b=this,c=a("div.ajaxtag");a(".tagsdiv").each(function(){tagBox.quickClicks(this)}),a(".tagadd",c).click(function(){b.flushTags(a(this).closest(".tagsdiv"))}),a("div.taghint",c).click(function(){a(this).css("visibility","hidden").parent().siblings(".newtag").focus()}),a("input.newtag",c).blur(function(){""===this.value&&a(this).parent().siblings(".taghint").css("visibility","")}).focus(function(){a(this).parent().siblings(".taghint").css("visibility","hidden")}).keyup(function(b){return 13==b.which?(tagBox.flushTags(a(this).closest(".tagsdiv")),!1):void 0}).keypress(function(a){return 13==a.which?(a.preventDefault(),!1):void 0}).each(function(){var b=a(this).closest("div.tagsdiv").attr("id");a(this).suggest(ajaxurl+"?action=ajax-tag-search&tax="+b,{delay:500,minchars:2,multiple:!0,multipleSep:window.tagsBoxL10n.tagDelimiter+" "})}),a("#post").submit(function(){a("div.tagsdiv").each(function(){tagBox.flushTags(this,!1,1)})}),a("a.tagcloud-link").click(function(){return tagBox.get(a(this).attr("id")),a(this).unbind().click(function(){return a(this).siblings(".the-tagcloud").toggle(),!1}),!1})}},a(document).ready(function(){tagBox.init()})}(jQuery);
+var tagBox,array_unique_noempty;!function(a){array_unique_noempty=function(b){var c=[];return a.each(b,function(b,d){d=a.trim(d),d&&-1===a.inArray(d,c)&&c.push(d)}),c},tagBox={clean:function(a){var b=window.tagsBoxL10n.tagDelimiter;return","!==b&&(a=a.replace(new RegExp(b,"g"),",")),a=a.replace(/\s*,\s*/g,",").replace(/,+/g,",").replace(/[,\s]+$/,"").replace(/^[,\s]+/,""),","!==b&&(a=a.replace(/,/g,b)),a},parseTags:function(b){var c=b.id,d=c.split("-check-num-")[1],e=a(b).closest(".tagsdiv"),f=e.find(".the-tags"),g=window.tagsBoxL10n.tagDelimiter,h=f.val().split(g),i=[];return delete h[d],a.each(h,function(b,c){c=a.trim(c),c&&i.push(c)}),f.val(this.clean(i.join(g))),this.quickClicks(e),!1},quickClicks:function(b){var c,d,e=a(".the-tags",b),f=a(".tagchecklist",b),g=a(b).attr("id");e.length&&(d=e.prop("disabled"),c=e.val().split(window.tagsBoxL10n.tagDelimiter),f.empty(),a.each(c,function(b,c){var e,h;c=a.trim(c),c&&(e=a("<span />").text(c),d||(h=a('<a id="'+g+"-check-num-"+b+'" class="ntdelbutton" tabindex="0">X</a>'),h.on("click keypress",function(b){("click"===b.type||13===b.keyCode)&&(13===b.keyCode&&a(this).closest(".tagsdiv").find("input.newtag").focus(),tagBox.parseTags(this))}),e.prepend("&nbsp;").prepend(h)),f.append(e))}))},flushTags:function(b,c,d){var e,f,g,h=a(".the-tags",b),i=a("input.newtag",b),j=window.tagsBoxL10n.tagDelimiter;return c=c||!1,g=c?a(c).text():i.val(),e=h.val(),f=e?e+j+g:g,f=this.clean(f),f=array_unique_noempty(f.split(j)).join(j),h.val(f),this.quickClicks(b),c||i.val(""),"undefined"==typeof d&&i.focus(),!1},get:function(b){var c=b.substr(b.indexOf("-")+1);a.post(ajaxurl,{action:"get-tagcloud",tax:c},function(d,e){0!==d&&"success"==e&&(d=a('<p id="tagcloud-'+c+'" class="the-tagcloud">'+d+"</p>"),a("a",d).click(function(){return tagBox.flushTags(a("#"+c),this),!1}),a("#"+b).after(d))})},init:function(){var b=this,c=a("div.ajaxtag");a(".tagsdiv").each(function(){tagBox.quickClicks(this)}),a(".tagadd",c).click(function(){b.flushTags(a(this).closest(".tagsdiv"))}),a("div.taghint",c).click(function(){a(this).css("visibility","hidden").parent().siblings(".newtag").focus()}),a("input.newtag",c).blur(function(){""===this.value&&a(this).parent().siblings(".taghint").css("visibility","")}).focus(function(){a(this).parent().siblings(".taghint").css("visibility","hidden")}).keyup(function(b){return 13==b.which?(tagBox.flushTags(a(this).closest(".tagsdiv")),!1):void 0}).keypress(function(a){return 13==a.which?(a.preventDefault(),!1):void 0}).each(function(){var b=a(this).closest("div.tagsdiv").attr("id");a(this).suggest(ajaxurl+"?action=ajax-tag-search&tax="+b,{delay:500,minchars:2,multiple:!0,multipleSep:window.tagsBoxL10n.tagDelimiter+" "})}),a("#post").submit(function(){a("div.tagsdiv").each(function(){tagBox.flushTags(this,!1,1)})}),a(".tagcloud-link").click(function(){return tagBox.get(a(this).attr("id")),a(this).unbind().click(function(){return a(this).siblings(".the-tagcloud").toggle(),!1}),!1})}},a(document).ready(function(){tagBox.init()})}(jQuery);

wp-admin/tools.php

@@ -57,7 +57,7 @@ require_once( ABSPATH . 'wp-admin/admin-header.php' );
 			</button>
 		</p>
 
-		<div class="hidden js-pressthis-code-wrap">
+		<div class="hidden js-pressthis-code-wrap" id="pressthis-code-wrap">
 			<p id="pressthis-code-desc">
 				<?php _e( 'If you can\'t drag it to your bookmarks, copy the following code and create new bookmark. Paste the code into the new bookmark\'s URL field.' ) ?>
 			</p>

wp-includes/version.php

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