diff --git a/assets/js/theme/global/cart-preview.js b/assets/js/theme/global/cart-preview.js
index 32d1c9ce91..167a5a7775 100644
--- a/assets/js/theme/global/cart-preview.js
+++ b/assets/js/theme/global/cart-preview.js
@@ -16,11 +16,14 @@ export default function (secureBaseUrl, cartId) {
const $body = $('body');
$body.on('cart-quantity-update', (event, quantity) => {
+ $cart.attr('aria-label', (_, prevValue) => prevValue.replace(/\d+/, quantity));
+
if (!quantity) {
$cart.addClass('navUser-item--cart__hidden-s');
} else {
$cart.removeClass('navUser-item--cart__hidden-s');
}
+
$('.cart-quantity')
.text(quantity)
.toggleClass('countPill--positive', quantity > 0);
diff --git a/lang/en.json b/lang/en.json
index 12d7cf6264..3368f6edad 100755
--- a/lang/en.json
+++ b/lang/en.json
@@ -36,6 +36,7 @@
"title": "Checkout"
},
"cart": {
+ "nav_aria_label": "Cart with 0 items",
"continue_shopping": "Click here to continue shopping",
"items": "{NUM, plural, =0{(0 items)} one {(# item)} other {(# items)}}",
"checkout": {
diff --git a/templates/components/common/navigation.html b/templates/components/common/navigation.html
index 8a721e13ea..d82aec049b 100644
--- a/templates/components/common/navigation.html
+++ b/templates/components/common/navigation.html
@@ -92,7 +92,7 @@
data-dropdown="cart-preview-dropdown"
data-options="align:right"
href="{{urls.cart}}"
- aria-label="{{lang 'common.cart'}}"
+ aria-label="{{lang 'cart.nav_aria_label'}}"
>
{{lang 'common.cart'}}