Merge branch 'stage' into MWPW-147172

* stage:
  Revert "MWPW-148002: Adjust Strike-through price font size for: merch-card (all variations)" (adobecom#2529)
  Integrating spectrum Toast in milo required by Event creation console. (adobecom#2511)
  MWPW-152283: [TEST] switch WCS to acom domain (adobecom#2504)
  MWPW-153068: fix missing 'P3Y' in ost (adobecom#2502)
  MWPW-146782: Add Description to Article richresults (adobecom#2505)
  MWPW-146326 introduce promo text for all cards (adobecom#2483)
  MWPW-150705: De-couple Result Spreadsheet for Interactive Front Door Experience (adobecom#2481)
  MWPW-152627 [MILO][MARTECH] add Target propositionDisplay call (adobecom#2477)
  MWPW-143637 [Milo]Component Enhancements for ACE0861 Prioritized Placements HP Test  (adobecom#2506)
  [MWPW-129964] Fix accessibility issues for georouting language selector (adobecom#2497)
  MWPW-148424 Fix chart dates (adobecom#2466)
  MWPW-139487 - Fix for Gnav scroll issue with Landscape Orientation on devices (adobecom#2473)
  MWPW-151588: fix geo modal is not closed on ESC (adobecom#2449)
  MWPW-148002: Adjust Strike-through price font size for: merch-card (all variations) (adobecom#2459)
  MWPW-140523: Update existing LANA logs to capture potential client errors (adobecom#2402)
  [MWPW-152676] Ensure all Graybox URLs use STAGE environment (adobecom#2488)

# Conflicts:
#	libs/deps/merch-card.js

libs/blocks/chart/utils.js

@@ -34,20 +34,12 @@ export function formatExcelDate(date) {
   let newDate;
 
   if (!Number.isNaN(+date)) {
-    const hours = Math.floor((+date % 1) * 24);
-    const minutes = Math.floor((((+date % 1) * 24) - hours) * 60);
-    const offsetUTC = 24 - (new Date().getTimezoneOffset() / 60);
-
-    newDate = new Date(Date.UTC(0, 0, +date, hours - offsetUTC, minutes));
+    newDate = +date > 99999
+      ? new Date(+date * 1000)
+      : new Date(Math.round((+date - (1 + 25567 + 1)) * 86400 * 1000));
   } else {
     newDate = new Date(date);
   }
 
-  const localDateFormat = new Date(
-    newDate.getFullYear(),
-    newDate.getMonth(),
-    newDate.getDate(),
-  );
-
-  return localDateFormat.toLocaleString([], { dateStyle: 'short' });
+  return newDate.toLocaleString([], { dateStyle: 'short', timeZone: 'GMT' });
 }

libs/blocks/global-footer/global-footer.js

@@ -72,12 +72,7 @@ class Footer {
     this.body = await fetchAndProcessPlainHtml({
       url,
       shouldDecorateLinks: false,
-    })
-      .catch((e) => lanaLog({
-        message: `Error fetching footer content ${url}`,
-        e,
-        tags: 'errorType=error,module=global-footer',
-      }));
+    });
 
     if (!this.body) return;
 
@@ -153,7 +148,13 @@ class Footer {
 
   loadIcons = async () => {
     const file = await fetch(`${base}/blocks/global-footer/icons.svg`);
-
+    if (!file.ok) {
+      lanaLog({
+        message: 'Issue with loadIcons',
+        e: `${file.statusText} url: ${file.url}`,
+        tags: 'errorType=info,module=global-footer',
+      });
+    }
     const content = await file.text();
     const elem = toFragment`<div class="feds-footer-icons">${content}</div>`;
     this.block.append(elem);

libs/blocks/global-navigation/global-navigation.css

@@ -566,8 +566,9 @@ header.global-navigation {
 
   .feds-navItem--megaMenu .feds-popup {
     right: 0;
-    justify-content: center;
     padding: 40px 0 0;
+    max-height: calc(100vh - 100%);
+    overflow: auto;
   }
 
   [dir = "rtl"] .feds-navItem--megaMenu .feds-popup {

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

@@ -5,7 +5,6 @@ import {
   loadIms,
   decorateLinks,
   loadScript,
-  loadStyle,
 } from '../../utils/utils.js';
 import {
   closeAllDropdowns,
@@ -23,6 +22,7 @@ import {
   loadBaseStyles,
   loadBlock,
   loadDecorateMenu,
+  rootPath,
   loadStyles,
   logErrorFor,
   selectors,
@@ -409,14 +409,14 @@ class Gnav {
           Search,
         ] = await Promise.all([
           loadBlock('../features/search/gnav-search.js'),
-          loadStyles('features/search/gnav-search.css'),
+          loadStyles(rootPath('features/search/gnav-search.css')),
         ]);
         this.Search = Search;
 
         if (!this.useUniversalNav) {
           const [ProfileDropdown] = await Promise.all([
             loadBlock('../features/profile/dropdown.js'),
-            loadStyles('features/profile/dropdown.css'),
+            loadStyles(rootPath('features/profile/dropdown.css')),
           ]);
           this.ProfileDropdown = ProfileDropdown;
         }
@@ -465,6 +465,11 @@ class Gnav {
     const profileData = await fetch(`https://${env.adobeIO}/profile`, { headers });
 
     if (profileData.status !== 200) {
+      lanaLog({
+        message: 'GNAV: decorateProfile has failed to fetch profile data',
+        e: `${profileData.statusText} url: ${profileData.url}`,
+        tags: 'errorType=info,module=gnav',
+      });
       return;
     }
 
@@ -515,7 +520,7 @@ class Gnav {
     const unavVersion = new URLSearchParams(window.location.search).get('unavVersion') || '1.1';
     await Promise.all([
       loadScript(`https://${environment}.adobeccstatic.com/unav/${unavVersion}/UniversalNav.js`),
-      loadStyle(`https://${environment}.adobeccstatic.com/unav/${unavVersion}/UniversalNav.css`),
+      loadStyles(`https://${environment}.adobeccstatic.com/unav/${unavVersion}/UniversalNav.css`),
     ]);
 
     const getChildren = () => {
@@ -638,7 +643,7 @@ class Gnav {
       webappPrompt,
     ] = await Promise.all([
       import('../../features/webapp-prompt/webapp-prompt.js'),
-      loadStyle(`${base}/features/webapp-prompt/webapp-prompt.css`),
+      loadStyles(`${base}/features/webapp-prompt/webapp-prompt.css`),
     ]);
 
     webappPrompt.default({ promptPath, entName, parent: this.blocks.universalNav, getAnchorState });
@@ -1006,12 +1011,7 @@ export default async function init(block) {
   try {
     const { mep } = getConfig();
     const url = await getSource();
-    const content = await fetchAndProcessPlainHtml({ url })
-      .catch((e) => lanaLog({
-        message: `Error fetching gnav content url: ${url}`,
-        e,
-        tags: 'errorType=error,module=gnav',
-      }));
+    const content = await fetchAndProcessPlainHtml({ url });
     if (!content) return null;
     const gnav = new Gnav({
       content,

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

@@ -5,7 +5,6 @@ import {
   getAnalyticsValue,
   icons,
   isDesktop,
-  lanaLog,
   logErrorFor,
   selectors,
   setActiveDropdown,
@@ -308,12 +307,8 @@ const decorateMenu = (config) => logErrorFor(async () => {
     const pathElement = config.item.querySelector('a');
     if (!(pathElement instanceof HTMLElement)) return;
 
-    const content = await fetchAndProcessPlainHtml({ url: pathElement.href })
-      .catch((e) => lanaLog({
-        message: `Menu could not be fetched ${pathElement.href}`,
-        e,
-        tags: 'errorType=error,module=menu',
-      }));
+    const content = await fetchAndProcessPlainHtml({ url: pathElement.href });
+
     if (!content) return;
 
     const menuContent = toFragment`<div class="feds-menu-content">${content.innerHTML}</div>`;

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

@@ -183,18 +183,30 @@ export function getExperienceName() {
   return '';
 }
 
-export function loadStyles(path) {
+export function rootPath(path) {
   const { miloLibs, codeRoot } = getConfig();
-  return new Promise((resolve) => {
-    loadStyle(`${miloLibs || codeRoot}/blocks/global-navigation/${path}`, resolve);
+  const url = `${miloLibs || codeRoot}/blocks/global-navigation/${path}`;
+  return url;
+}
+
+export function loadStyles(url) {
+  loadStyle(url, (e) => {
+    if (e === 'error') {
+      lanaLog({
+        message: 'GNAV: Error in loadStyles',
+        e: `error loading style: ${url}`,
+        tags: 'errorType=info,module=utilities',
+      });
+    }
   });
 }
 
 // Base styles are shared between top navigation and footer,
 // since they can be independent of each other.
 // CSS imports were not used due to duplication of file include
 export async function loadBaseStyles() {
-  await loadStyles('base.css');
+  const url = rootPath('base.css');
+  await loadStyles(url);
 }
 
 export function loadBlock(path) {
@@ -212,7 +224,7 @@ export async function loadDecorateMenu() {
 
   const [{ decorateMenu, decorateLinkGroup }] = await Promise.all([
     loadBlock('./menu/menu.js'),
-    loadStyles('utilities/menu/menu.css'),
+    loadStyles(rootPath('utilities/menu/menu.css')),
   ]);
 
   resolve({
@@ -332,6 +344,13 @@ export async function fetchAndProcessPlainHtml({ url, shouldDecorateLinks = true
     path = mepFragment.target;
   }
   const res = await fetch(path.replace(/(\.html$|$)/, '.plain.html'));
+  if (res.status !== 200) {
+    lanaLog({
+      message: 'Error in fetchAndProcessPlainHtml',
+      e: `${res.statusText} url: ${res.url}`,
+      tags: 'errorType=info,module=utilities',
+    });
+  }
   const text = await res.text();
   const { body } = new DOMParser().parseFromString(text, 'text/html');
   if (mepFragment?.manifestId) body.dataset.manifestId = mepFragment.manifestId;
@@ -360,7 +379,14 @@ export async function fetchAndProcessPlainHtml({ url, shouldDecorateLinks = true
   const blocks = body.querySelectorAll('.martech-metadata');
   if (blocks.length) {
     import('../../martech-metadata/martech-metadata.js')
-      .then(({ default: decorate }) => blocks.forEach((block) => decorate(block)));
+      .then(({ default: decorate }) => blocks.forEach((block) => decorate(block)))
+      .catch((e) => {
+        lanaLog({
+          message: 'Error in fetchAndProcessPlainHtml',
+          e,
+          tags: 'errorType=info,module=utilities',
+        });
+      });
   }
 
   body.innerHTML = await replaceText(body.innerHTML, getFedsPlaceholderConfig());

libs/blocks/merch-card/merch-card.js

@@ -28,13 +28,15 @@ const CARD_TYPES = [
 
 const CARD_SIZES = ['wide', 'super-wide'];
 
-const TEXT_STYLES = {
-  H5: 'detail-m',
+const SLOT_MAP_DEFAULT = {
+  H5: 'promo-text',
   H4: 'body-xxs',
   H3: 'heading-xs',
   H2: 'heading-m',
 };
 
+const SLOT_MAP = { 'special-offers': { H5: 'detail-m' } };
+
 const HEADING_MAP = {
   'special-offers': {
     H5: 'H4',
@@ -153,9 +155,7 @@ const parseContent = async (el, merchCard) => {
 
   if (merchCard.variant === MINI_COMPARE_CHART) {
     bodySlotName = 'body-m';
-    const promoText = el.querySelectorAll('h5');
     const priceSmallType = el.querySelectorAll('h6');
-    appendSlot(promoText, 'promo-text', merchCard);
     appendSlot(priceSmallType, 'price-commitment', merchCard);
   }
 
@@ -171,7 +171,7 @@ const parseContent = async (el, merchCard) => {
   innerElements.forEach((element) => {
     let { tagName } = element;
     if (isHeadingTag(tagName)) {
-      let slotName = TEXT_STYLES[tagName];
+      let slotName = SLOT_MAP[merchCard.variant]?.[tagName] || SLOT_MAP_DEFAULT[tagName];
       if (slotName) {
         if (['H2', 'H3', 'H4', 'H5'].includes(tagName)) {
           element.classList.add('card-heading');

libs/blocks/ost/ost.js

@@ -8,7 +8,7 @@ const IMS_COMMERCE_CLIENT_ID = 'aos_milo_commerce';
 const IMS_SCOPE = 'AdobeID,openid';
 const IMS_ENV = 'prod';
 const IMS_PROD_URL = 'https://auth.services.adobe.com/imslib/imslib.min.js';
-const OST_VERSION = '1.18.2';
+const OST_VERSION = '1.18.4';
 const OST_BASE = `https://www.stage.adobe.com/special/tacocat/ost/lib/${OST_VERSION}`;
 const OST_SCRIPT_URL = `${OST_BASE}/index.js`;
 const OST_STYLE_URL = `${OST_BASE}/index.css`;

libs/blocks/quiz-entry/quiz-entry.js

@@ -16,10 +16,11 @@ const App = ({
   analyticsType = null,
   questionData = { questions: { data: [] } },
   stringsData = { questions: { data: [] } },
+  resultsData = {},
   debug = false,
 }) => {
   const [dataLoaded, setDataLoaded] = useState(false);
-  const [quizState, setQuizState] = useState({ userFlow: [], userSelection: [] });
+  const [quizState, setQuizState] = useState({ userFlow: [], userSelection: [], results: {} });
   const [quizLists, setQuizLists] = useState({});
   const [quizData, setQuizData] = useState({});
   const [hasMLData, setHasMLData] = useState(false);
@@ -117,6 +118,7 @@ const App = ({
         setQuizState({
           userFlow: [questionDataArray[0].questions],
           userSelection: quizState.userSelection,
+          results: resultsData,
         });
         setSelectedQuestion(qLists.questions[questionDataArray[0].questions]);
       }
@@ -260,6 +262,7 @@ const App = ({
       const currentQuizState = {
         userFlow: nextFlow,
         userSelection: nextSelections,
+        results: resultsData,
       };
       localStorage.setItem('stored-quiz-state', JSON.stringify(currentQuizState));
       setQuizState(currentQuizState);
@@ -390,6 +393,7 @@ export default async function init(
     analyticsType: null,
     questionData: null,
     stringsData: null,
+    resultsData: null,
     debug: false,
   },
 ) {
@@ -408,6 +412,7 @@ export default async function init(
         analyticsType: '',
         questionData: { questions: { data: [] } },
         stringsData: { questions: { data: [] } },
+        resultsData: {},
         debug: false,
       };
     }
@@ -424,6 +429,7 @@ export default async function init(
     analyticsType=${quizEntry.analyticsType || ''}
     questionData=${quizEntry.questionData}
     stringsData=${quizEntry.stringsData}
+    resultsData=${quizEntry.resultsData}
     debug=${quizEntry.debug || false}
   />`, el);
 }

libs/blocks/quiz-entry/utils.js

@@ -7,14 +7,25 @@ export async function fetchJson(path) {
 
 export async function getQuizJson(path) {
   try {
-    const [questions, strings] = await Promise.all(
-      [fetchJson(`${path}questions.json`), fetchJson(`${path}strings.json`)],
-    );
-    return [questions, strings];
+    // Fetch required files
+    const [questions, strings] = await Promise.all([
+      fetchJson(`${path}questions.json`),
+      fetchJson(`${path}strings.json`),
+    ]);
+
+    // Try to fetch optional file, results.json
+    let results = [];
+    try {
+      results = await fetchJson(`${path}results.json`);
+    } catch (ex) {
+      window.lana?.log(`INFO: results.json not found or couldn't be fetched: ${ex}`, { tags: 'errorType=info,module=quiz-entry' });
+    }
+
+    return [questions, strings, results];
   } catch (ex) {
-    window.lana?.log(`ERROR: Fetching data for quiz entry ${ex}`);
+    window.lana?.log(`ERROR: Fetching data for quiz entry: ${ex}`, { tags: 'errorType=error,module=quiz-entry' });
+    return [];
   }
-  return [];
 }
 
 export const handleNext = (questionsData, selectedQuestion, userInputSelections, userFlow) => {
@@ -98,13 +109,14 @@ export async function getQuizEntryData(el) {
   const maxQuestions = Number(blockData.maxquestions?.text) || 10;
   const analyticsType = blockData.analyticstype?.text;
   const analyticsQuiz = blockData.analyticsquiz?.text;
-  const [questionData, stringsData] = await getQuizJson(dataPath);
+  const [questionData, stringsData, resultsData] = await getQuizJson(dataPath);
   return {
     quizPath,
     maxQuestions,
     analyticsQuiz,
     analyticsType,
     questionData,
     stringsData,
+    resultsData,
   };
 }