fix(storefront): BCTHEME-67 Cart icon quantity should have appropriat…

…e link text (#1765)
bigcommerce · Aug 26, 2020 · 4e2946b · 4e2946b
1 parent ad952be
commit 4e2946b
Show file tree

Hide file tree

Showing 3 changed files with 5 additions and 1 deletion.
diff --git 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
@@ -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
@@ -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'}}"
             >
                 <span class="navUser-item-cartLabel">{{lang 'common.cart'}}</span>
                 <span class="countPill cart-quantity"></span>