Add aria label to the customer account block link (#46899)

plugins/woocommerce-blocks/assets/js/blocks/customer-account/block.tsx

@@ -56,12 +56,20 @@ export const CustomerAccountBlock = ( {
 } ): JSX.Element => {
 	const { displayStyle, iconStyle, iconClass } = attributes;
 
+	const ariaAttributes =
+		displayStyle === DisplayStyle.ICON_ONLY
+			? {
+					'aria-label': __( 'My Account', 'woocommerce' ),
+			  }
+			: {};
+
 	return (
 		<a
 			href={ getSetting(
 				'dashboardUrl',
 				getSetting( 'wpLoginUrl', '/wp-login.php' )
 			) }
+			{ ...ariaAttributes }
 		>
 			<AccountIcon
 				iconStyle={ iconStyle }

plugins/woocommerce/changelog/46899-dev-fix-a11y-icon-only-customer-account-block

@@ -0,0 +1,4 @@
+Significance: patch
+Type: update
+
+Add aria-label to customer account block link when in icon-only display mode.

plugins/woocommerce/src/Blocks/BlockTypes/CustomerAccount.php

@@ -122,10 +122,13 @@ protected function render( $attributes, $content, $block ) {
 			),
 		);
 
+		// Only provide aria-label if the display style is icon only.
+		$aria_label = self::ICON_ONLY === $attributes['displayStyle'] ? 'aria-label="' . esc_attr( $this->render_label() ) . '"' : '';
+
 		$label_markup = self::ICON_ONLY === $attributes['displayStyle'] ? '' : '<span class="label">' . wp_kses( $this->render_label(), array() ) . '</span>';
 
 		return "<div class='wp-block-woocommerce-customer-account " . esc_attr( $classes_and_styles['classes'] ) . "' style='" . esc_attr( $classes_and_styles['styles'] ) . "'>
-			<a href='" . esc_attr( $account_link ) . "'>
+			<a " . $aria_label . " href='" . esc_attr( $account_link ) . "'>
 				" . wp_kses( $this->render_icon( $attributes ), $allowed_svg ) . $label_markup . '
 			</a>
 		</div>';