Adding aria-label for checkout-link using productFamily as placeholde…

…r key
adobecom · Jan 22, 2025 · 9f96bd7 · 9f96bd7
1 parent f62be2e
commit 9f96bd7
Showing 1 changed file with 9 additions and 2 deletions.
diff --git a/libs/blocks/merch-card/merch-card.js b/libs/blocks/merch-card/merch-card.js
@@ -706,10 +706,17 @@ export default async function init(el) {
   }
   el.replaceWith(merchCard);
   decorateMerchCardLinkAnalytics(merchCard);
+
+  // Adding aria-label for checkout-link using productFamily as placeholder key
   const ctaLink = ctas?.querySelector('a');
-  if (merchCard.name && ctaLink) {
+  if (ctaLink && !ctaLink.getAttribute('aria-label')) {
     const { replaceKey } = await import('../../features/placeholders.js');
-    await replaceKey(merchCard.name, getConfig()).then((key) => ctaLink.setAttribute('aria-label', `${ctaLink.textContent} ${key}`));
+    ctaLink.addEventListener('mas:resolved', async () => {
+      const productName = ctaLink.value[0]?.productArrangement?.productFamily;
+      if (productName) {
+        await replaceKey(productName, getConfig()).then((key) => ctaLink.setAttribute('aria-label', `${ctaLink.textContent} - ${key}`));
+      }
+    });
   }
   return merchCard;
 }