From 421ab620402ae914f35da5b5b38e8821c1b0afb9 Mon Sep 17 00:00:00 2001
From: Roy Ho <roykho77@gmail.com>
Date: Thu, 1 Jun 2023 05:41:43 -0700
Subject: [PATCH] Ensure aria-label is showing correct value based on setting
 (#9672)

* Ensure aria-label is showing correct value based on setting

* Reuse same format code
---
 assets/js/blocks/mini-cart/block.tsx     | 36 +++++++++++------
 assets/js/blocks/mini-cart/utils/data.ts | 49 ++++++++++++++++--------
 2 files changed, 58 insertions(+), 27 deletions(-)

diff --git a/assets/js/blocks/mini-cart/block.tsx b/assets/js/blocks/mini-cart/block.tsx
index fc19a1f2f6e..6e637799f90 100644
--- a/assets/js/blocks/mini-cart/block.tsx
+++ b/assets/js/blocks/mini-cart/block.tsx
@@ -212,17 +212,31 @@ const MiniCartBlock = ( attributes: Props ): JSX.Element => {
 		  parseInt( cartTotals.total_items_tax, 10 )
 		: parseInt( cartTotals.total_items, 10 );
 
-	const ariaLabel = sprintf(
-		/* translators: %1$d is the number of products in the cart. %2$s is the cart total */
-		_n(
-			'%1$d item in cart, total price of %2$s',
-			'%1$d items in cart, total price of %2$s',
-			cartItemsCount,
-			'woo-gutenberg-products-block'
-		),
-		cartItemsCount,
-		formatPrice( subTotal, getCurrencyFromPriceResponse( cartTotals ) )
-	);
+	const ariaLabel = hasHiddenPrice
+		? sprintf(
+				/* translators: %1$d is the number of products in the cart. */
+				_n(
+					'%1$d item in cart',
+					'%1$d items in cart',
+					cartItemsCount,
+					'woo-gutenberg-products-block'
+				),
+				cartItemsCount
+		  )
+		: sprintf(
+				/* translators: %1$d is the number of products in the cart. %2$s is the cart total */
+				_n(
+					'%1$d item in cart, total price of %2$s',
+					'%1$d items in cart, total price of %2$s',
+					cartItemsCount,
+					'woo-gutenberg-products-block'
+				),
+				cartItemsCount,
+				formatPrice(
+					subTotal,
+					getCurrencyFromPriceResponse( cartTotals )
+				)
+		  );
 
 	const colorStyle = {
 		backgroundColor: style?.color?.background,
diff --git a/assets/js/blocks/mini-cart/utils/data.ts b/assets/js/blocks/mini-cart/utils/data.ts
index ced7bfce848..7cb5c78c316 100644
--- a/assets/js/blocks/mini-cart/utils/data.ts
+++ b/assets/js/blocks/mini-cart/utils/data.ts
@@ -13,9 +13,7 @@ export const updateTotals = ( totals: [ string, number ] | undefined ) => {
 		return;
 	}
 	const [ amount, quantity ] = totals;
-	const miniCartButtons = document.querySelectorAll(
-		'.wc-block-mini-cart__button'
-	);
+	const miniCartBlocks = document.querySelectorAll( '.wc-block-mini-cart' );
 	const miniCartQuantities = document.querySelectorAll(
 		'.wc-block-mini-cart__badge'
 	);
@@ -23,20 +21,39 @@ export const updateTotals = ( totals: [ string, number ] | undefined ) => {
 		'.wc-block-mini-cart__amount'
 	);
 
-	miniCartButtons.forEach( ( miniCartButton ) => {
-		miniCartButton.setAttribute(
+	miniCartBlocks.forEach( ( miniCartBlock ) => {
+		if ( ! ( miniCartBlock instanceof HTMLElement ) ) {
+			return;
+		}
+
+		const miniCartButton = miniCartBlock.querySelector(
+			'.wc-block-mini-cart__button'
+		);
+
+		miniCartButton?.setAttribute(
 			'aria-label',
-			sprintf(
-				/* translators: %s number of products in cart. */
-				_n(
-					'%1$d item in cart, total price of %2$s',
-					'%1$d items in cart, total price of %2$s',
-					quantity,
-					'woo-gutenberg-products-block'
-				),
-				quantity,
-				amount
-			)
+			miniCartBlock.dataset.hasHiddenPrice
+				? sprintf(
+						/* translators: %s number of products in cart. */
+						_n(
+							'%1$d item in cart',
+							'%1$d items in cart',
+							quantity,
+							'woo-gutenberg-products-block'
+						),
+						quantity
+				  )
+				: sprintf(
+						/* translators: %1$d is the number of products in the cart. %2$s is the cart total */
+						_n(
+							'%1$d item in cart, total price of %2$s',
+							'%1$d items in cart, total price of %2$s',
+							quantity,
+							'woo-gutenberg-products-block'
+						),
+						quantity,
+						amount
+				  )
 		);
 	} );
 	miniCartQuantities.forEach( ( miniCartQuantity ) => {