[Release] Stage to Main (#3581)

libs/blocks/global-navigation/utilities/utilities.js

@@ -465,7 +465,8 @@ export const transformTemplateToMobile = async (popup, item, localnav = false) =
         {{main-menu}}
       </button>
   `;
-  const brand = document.querySelector('.feds-brand')?.outerHTML;
+  // Get the outerHTML of the .feds-brand element or use a default empty <span> if it doesn't exist
+  const brand = document.querySelector('.feds-brand')?.outerHTML || '<span></span>';
   const breadCrumbs = document.querySelector('.feds-breadcrumbs')?.outerHTML;
   popup.innerHTML = `
     <div class="top-bar">

libs/blocks/merch/merch.js

@@ -721,6 +721,19 @@ export async function buildCta(el, params) {
       reopenModal(cta);
     });
   }
+
+  // Adding aria-label for checkout-link using productFamily and customerSegment as placeholder key.
+  if (!cta.getAttribute('aria-label')) {
+    cta.onceSettled().finally(async () => {
+      const productFamily = cta.value[0]?.productArrangement?.productFamily;
+      const marketSegment = cta.value[0]?.marketSegments[0];
+      const customerSegment = marketSegment === 'EDU' ? marketSegment : cta.value[0]?.customerSegment;
+      let ariaLabel = cta.textContent;
+      ariaLabel = productFamily ? `${ariaLabel} - ${await replaceKey(productFamily, getConfig())}` : ariaLabel;
+      ariaLabel = customerSegment ? `${ariaLabel} - ${await replaceKey(customerSegment, getConfig())}` : ariaLabel;
+      cta.setAttribute('aria-label', ariaLabel);
+    });
+  }
   return cta;
 }
 

libs/blocks/modal/modal.js

@@ -112,7 +112,7 @@ async function getPathModal(path, dialog) {
 }
 
 export async function getModal(details, custom) {
-  if (!(details?.path || custom)) return null;
+  if (!((details?.path && details?.id) || custom)) return null;
   const { id } = details || custom;
 
   dialogLoadingSet.add(id);

libs/deps/mas/merch-card.js

@@ -1412,6 +1412,11 @@ merch-card[variant='twp'] merch-offer-select {
     line-height: var(--consonant-merch-card-body-xxs-line-height);
   }
 
+  merch-card[variant="ccd-suggested"] [slot="price"] em {
+      font-size: var(--consonant-merch-card-body-xxs-font-size);
+      line-height: var(--consonant-merch-card-body-xxs-line-height);
+  }
+
 .spectrum--darkest merch-card[variant="ccd-suggested"] {
   --consonant-merch-card-background-color:rgb(30, 30, 30);
   --consonant-merch-card-heading-xs-color:rgb(239, 239, 239);
@@ -1531,7 +1536,6 @@ merch-card[variant='twp'] merch-offer-select {
         :host([variant='ccd-suggested']) ::slotted([slot='price']) {
             font-size: var(--consonant-merch-card-body-xs-font-size);
             line-height: var(--consonant-merch-card-body-xs-line-height);
-            min-width: fit-content;
         }
 
         :host([variant='ccd-suggested']) ::slotted([slot='cta']) {

libs/features/mas/src/variants/ccd-suggested.css.js

@@ -10,6 +10,11 @@ export const CSS = `
     line-height: var(--consonant-merch-card-body-xxs-line-height);
   }
 
+  merch-card[variant="ccd-suggested"] [slot="price"] em {
+      font-size: var(--consonant-merch-card-body-xxs-font-size);
+      line-height: var(--consonant-merch-card-body-xxs-line-height);
+  }
+
 .spectrum--darkest merch-card[variant="ccd-suggested"] {
   --consonant-merch-card-background-color:rgb(30, 30, 30);
   --consonant-merch-card-heading-xs-color:rgb(239, 239, 239);

libs/features/mas/src/variants/ccd-suggested.js

@@ -163,7 +163,6 @@ export class CCDSuggested extends VariantLayout {
         :host([variant='ccd-suggested']) ::slotted([slot='price']) {
             font-size: var(--consonant-merch-card-body-xs-font-size);
             line-height: var(--consonant-merch-card-body-xs-line-height);
-            min-width: fit-content;
         }
 
         :host([variant='ccd-suggested']) ::slotted([slot='cta']) {

test/blocks/gist/gist.test.js

@@ -1,3 +1,4 @@
+import sinon from 'sinon';
 import { readFile } from '@web/test-runner-commands';
 import { expect } from '@esm-bundle/chai';
 import { waitForElement } from '../../helpers/waitfor.js';
@@ -6,10 +7,45 @@ document.body.innerHTML = await readFile({ path: './mocks/body.html' });
 const { default: init } = await import('../../../libs/blocks/gist/gist.js');
 
 describe('adobetv autoblock', () => {
-  it('creates iframe video block', async () => {
+  let createElementStub;
+  let clock;
+  let originalCreateElement;
+
+  beforeEach(() => {
+    clock = sinon.useFakeTimers();
+    originalCreateElement = document.createElement;
+
+    createElementStub = sinon.stub(document, 'createElement').callsFake((tagName) => {
+      if (tagName !== 'script') {
+        return originalCreateElement.call(document, tagName);
+      }
+      const scriptMock = originalCreateElement.call(document, 'script');
+      Object.defineProperty(scriptMock, 'src', {
+        set: async (url) => {
+          const gistCb = url.match(/callback=([^&]+)/)?.[1];
+          if (!gistCb) return;
+
+          await clock.runAllAsync();
+          if (window[gistCb]) {
+            window[gistCb]({ div: '<div class="gist-data">Mock Gist Content</div>' });
+          }
+        },
+      });
+      return scriptMock;
+    });
+  });
+
+  afterEach(() => {
+    createElementStub.restore();
+    clock.restore();
+  });
+
+  it('creates gist block with mocked data', async () => {
     const gistLink = document.body.querySelector('a');
     init(gistLink);
+    await clock.runAllAsync();
     const div = await waitForElement('div.gist-data');
     expect(div).to.exist;
+    expect(div.innerHTML).to.contain('Mock Gist Content');
   });
 });