From 8db3eeec7d407c1c3b52c3fa666111573b4368d8 Mon Sep 17 00:00:00 2001
From: "Dominik Schilling (ocean90)" <ocean90@git.wordpress.org>
Date: Wed, 29 Jul 2015 09:49:55 +0000
Subject: [PATCH] Customizer: Add an `aria-expanded` attribute to Edit menu
 item toggles.

props afercia.
fixes #33129.

git-svn-id: https://develop.svn.wordpress.org/trunk@33483 602fd350-edb4-49c9-b593-d223f7449a82
---
 src/wp-admin/css/customize-nav-menus.css      | 34 ++++++-------------
 src/wp-admin/js/customize-nav-menus.js        |  2 ++
 .../class-wp-customize-control.php            |  4 +--
 3 files changed, 15 insertions(+), 25 deletions(-)

diff --git a/src/wp-admin/css/customize-nav-menus.css b/src/wp-admin/css/customize-nav-menus.css
index 7136825b56..a0b7909023 100644
--- a/src/wp-admin/css/customize-nav-menus.css
+++ b/src/wp-admin/css/customize-nav-menus.css
@@ -214,10 +214,8 @@
 	width: 30px;
 	height: 38px;
 	margin-right: 0 !important;
-	text-indent: 100%;
 	outline: none;
 	overflow: hidden;
-	white-space: nowrap;
 	cursor: pointer;
 }
 
@@ -227,35 +225,25 @@
 	box-shadow: 0 0 0 1px #5b9dd9, 0 0 2px 1px rgba(30, 140, 190, .8);
 }
 
-/* Duplicates `.nav-menus-php .item-edit:before {}` in common.css:2220. */
-.wp-customizer .menu-item .item-edit:before {
-	top: -1px;
-	right: 0;
+/* rework the arrow indicator implementation for NVDA bug same as #32715 */
+.wp-customizer .menu-item .item-edit .toggle-indicator {
+	display: inline-block;
+	font-size: 20px;
+	line-height: 1;
+}
+
+.wp-customizer .menu-item .item-edit .toggle-indicator:after {
 	content: '\f140';
-	border: none;
-	background: none;
 	font: normal 20px/1 dashicons;
+	color: #a0a5aa;
+	vertical-align: top;
 	speak: none;
-	display: block;
-	padding: 0;
-	text-indent: 0;
-	text-align: center;
-	position: relative;
 	-webkit-font-smoothing: antialiased;
 	-moz-osx-font-smoothing: grayscale;
 	text-decoration: none !important;
 }
 
-.wp-customizer .menu-item.menu-item-edit-active .item-edit:before {
-	content: '\f142';
-}
-
-.wp-customizer .menu-item .item-edit:before {
-	line-height: 2;
-}
-
-/* Duplicates `.nav-menus-php .menu-item-edit-active .item-edit:before {}` in common.css:2271. */
-.wp-customizer .menu-item .menu-item-edit-active .item-edit:before {
+.wp-customizer .menu-item.menu-item-edit-active .item-edit .toggle-indicator:after {
 	content: '\f142';
 }
 
diff --git a/src/wp-admin/js/customize-nav-menus.js b/src/wp-admin/js/customize-nav-menus.js
index 7d5e054cfb..3734a79b99 100644
--- a/src/wp-admin/js/customize-nav-menus.js
+++ b/src/wp-admin/js/customize-nav-menus.js
@@ -1364,6 +1364,7 @@
 					self.container.trigger( 'expanded' );
 				};
 
+				$menuitem.find( '.item-edit' ).attr( 'aria-expanded', 'true' );
 				$inside.slideDown( 'fast', complete );
 
 				self.container.trigger( 'expand' );
@@ -1377,6 +1378,7 @@
 
 				self.container.trigger( 'collapse' );
 
+				$menuitem.find( '.item-edit' ).attr( 'aria-expanded', 'false' );
 				$inside.slideUp( 'fast', complete );
 			}
 		},
diff --git a/src/wp-includes/class-wp-customize-control.php b/src/wp-includes/class-wp-customize-control.php
index 45904bff43..31ff482074 100644
--- a/src/wp-includes/class-wp-customize-control.php
+++ b/src/wp-includes/class-wp-customize-control.php
@@ -1685,10 +1685,10 @@ class WP_Customize_Nav_Menu_Item_Control extends WP_Customize_Control {
 					<span class="menu-item-title<# if ( ! data.title ) { #> no-title<# } #>">{{ data.title || wp.customize.Menus.data.l10n.untitled }}</span>
 				</span>
 				<span class="item-controls">
-					<button type="button" class="not-a-button item-edit"><span class="screen-reader-text"><?php
+					<button type="button" class="not-a-button item-edit" aria-expanded="false"><span class="screen-reader-text"><?php
 						/* translators: 1: Title of a menu item, 2: Type of a menu item */
 						printf( __( 'Edit menu item: %1$s (%2$s)' ), '{{ data.title || wp.customize.Menus.data.l10n.untitled }}', '{{ data.item_type_label }}' );
-					?></span></button>
+					?></span><span class="toggle-indicator" aria-hidden="true"></span></button>
 					<button type="button" class="not-a-button item-delete submitdelete deletion"><span class="screen-reader-text"><?php
 						/* translators: 1: Title of a menu item, 2: Type of a menu item */
 						printf( __( 'Remove Menu Item: %1$s (%2$s)' ), '{{ data.title || wp.customize.Menus.data.l10n.untitled }}', '{{ data.item_type_label }}' );