Merge branch 'main' into quickfix

.eslintrc.js

@@ -20,6 +20,7 @@ module.exports = {
       ImportDeclaration: { multiline: true, minProperties: 6 },
       ExportDeclaration: { multiline: true, minProperties: 6 },
     }],
+    'no-return-assign': ['error', 'except-parens'],
     'no-unused-expressions': 0,
     'chai-friendly/no-unused-expressions': 2,
 

libs/blocks/featured-article/featured-article.js

@@ -22,7 +22,7 @@ export default async function init(el) {
 
   // load taxonomy to get link of article "category"
   const taxonomy = await fetchTaxonomy(getConfig(), '/topics');
-  const categoryTaxonomy = taxonomy.get(category);
+  const categoryTaxonomy = taxonomy.get(category) || 'News';
 
   const pic = doc.body.querySelector('picture');
   const featuredImg = createTag('div', { class: 'featured-article-card-image' }, pic);

libs/blocks/ost/ost.css

@@ -0,0 +1,30 @@
+body.tool-ost .ost {
+  position: fixed;
+  display: flex;
+  top: 0;
+  left: 0;
+  bottom: 0;
+  right: 0;
+  justify-content: center;
+  align-items: center;
+  background-color: var(--color-gray-75);
+}
+
+body.tool-ost .ost>div {
+  padding: 0 20px 0 20px;
+  min-height: 900px;
+  max-height: 1400px;
+  min-width: 1200px;
+  max-width: 1800px;
+  height: 80%;
+  width: 80%;
+  border-radius: 4px;
+  border-width: 2px;
+  background-color: var(--color-gray-100);
+  border-color: var(--color-gray-200);
+  border-style: solid;
+}
+
+.price-unit-type::before {
+  content: " ";
+}

libs/blocks/ost/ost.js

@@ -2,23 +2,23 @@ import { loadScript, loadStyle } from '../../utils/utils.js';
 
 const IMS_COMMERCE_CLIENT_ID = 'aos_milo_commerce';
 const IMS_PROD_URL = 'https://auth.services.adobe.com/imslib/imslib.min.js';
-const OST_SCRIPT_URL = 'https://www.stage.adobe.com/special/tacocat/ost/lib/index.js';
-const OST_STYLE_URL = 'https://www.stage.adobe.com/special/tacocat/ost/lib/index.css';
+const OST_SCRIPT_URL = 'https://www.stage.adobe.com/special/tacocat/ost/lib/1.10.0/index.js';
+const OST_STYLE_URL = 'https://www.stage.adobe.com/special/tacocat/ost/lib/1.10.0/index.css';
+
+const ENVIRONMENT = 'PROD';
+const WCS_API_KEY = 'wcms-commerce-ims-ro-user-cc';
+const AOS_API_KEY = 'wcms-commerce-ims-user-prod';
+const CHECKOUT_CLIENT_ID = 'creative';
+
+const searchParameters = new URLSearchParams(window.location.search);
+// this is only for testing PRs where test URLs are not supported by IMS.
+const token = searchParameters.get('token');
+if (token) {
+  searchParameters.delete('token');
+}
+
+document.body.classList.add('tool', 'tool-ost');
 
-const getImsToken = async () => {
-  window.adobeid = {
-    client_id: IMS_COMMERCE_CLIENT_ID,
-    environment: 'prod',
-    scope: 'AdobeID,openid',
-  };
-  if (!window.adobeIMS) {
-    await loadScript(IMS_PROD_URL);
-  }
-  if (!window.adobeIMS.isSignedInUser()) {
-    window.adobeIMS.signIn();
-  }
-  return window.adobeIMS?.getAccessToken()?.token;
-};
 export function createLinkMarkup(
   offerSelectorId,
   type,
@@ -75,30 +75,60 @@ export function createLinkMarkup(
   return link;
 }
 
-export default async function init() {
-  const aosAccessToken = await getImsToken();
+let rootElement;
+
+function initOST({ token: aosAccessToken }) {
   const country = 'US';
   const language = 'en';
-  const environment = 'PROD';
-  const wcsApiKey = 'wcms-commerce-ims-ro-user-cc';
-  const aosApiKey = 'wcms-commerce-ims-user-prod';
-  const checkoutClientId = 'creative';
-  const rootContainer = document.querySelector('.ost');
-  const searchParameters = new URLSearchParams(window.location.search);
-  rootContainer.removeChild(rootContainer.firstElementChild);
-  if (!window.ost) {
-    loadStyle(OST_STYLE_URL);
-    await loadScript(OST_SCRIPT_URL);
+
+  const options = {
+    rootMargin: '0px',
+    threshold: 1.0,
+  };
+
+  const main = document.querySelector('main');
+  const observer = new IntersectionObserver(() => {
+    observer.unobserve(main);
+    window.ost.openOfferSelectorTool({
+      country,
+      language,
+      environment: ENVIRONMENT,
+      wcsApiKey: WCS_API_KEY,
+      aosApiKey: AOS_API_KEY,
+      aosAccessToken,
+      checkoutClientId: CHECKOUT_CLIENT_ID,
+      searchParameters,
+      createLinkMarkup,
+      rootElement,
+    });
+  }, options);
+  observer.observe(main);
+}
+
+export default async function init(el) {
+  if (rootElement) return; // only one OST is supported per page
+  el.innerHTML = '<div />';
+  rootElement = el.firstElementChild;
+
+  loadStyle(OST_STYLE_URL);
+  await loadScript(OST_SCRIPT_URL);
+  await loadStyle('https://use.typekit.net/pps7abe.css');
+  if (token) {
+    initOST({ token });
+  } else {
+    window.adobeid = {
+      client_id: IMS_COMMERCE_CLIENT_ID,
+      environment: 'prod',
+      optimizations: { fastEvents: true },
+      autoValidateToken: true,
+      scope: 'AdobeID,openid',
+      onAccessToken: initOST,
+      onReady: () => {
+        if (!window.adobeIMS.isSignedInUser()) {
+          window.adobeIMS.signIn();
+        }
+      },
+    };
+    await loadScript(IMS_PROD_URL);
   }
-  window.ost.openOfferSelectorTool({
-    country,
-    language,
-    environment,
-    wcsApiKey,
-    aosApiKey,
-    aosAccessToken,
-    checkoutClientId,
-    searchParameters,
-    createLinkMarkup,
-  });
 }

libs/blocks/recommended-articles/recommended-articles.js

@@ -40,7 +40,7 @@ function getDecoratedCards(articles, taxonomy) {
     const wrapper = createTag('a', { class: 'article-card', href: path });
     const cardImage = createTag('div', { class: 'article-card-image' }, imageEl);
     const cardBody = createTag('div', { class: 'article-card-body' });
-    const categoryTaxonomy = taxonomy.get(category || 'News');
+    const categoryTaxonomy = taxonomy.get(category) || 'News';
     const categoryLink = createTag('a', { href: categoryTaxonomy.link }, categoryTaxonomy.name);
     const categoryEl = createTag('p', { class: 'article-card-category' }, categoryLink);
     const titleEl = createTag('h3', null, title);

libs/features/georoutingv2/georoutingv2.js

@@ -176,13 +176,18 @@ function buildContent(currentPage, locale, geoData, locales) {
   const titleText = geo.length ? geo[0][currentPage.geo] : '';
   const title = createTag('h3', { lang }, locale.title.replace('{{geo}}', titleText));
   const text = createTag('p', { class: 'locale-text', lang }, locale.text);
-  const flagFile = getCodes(locale).length > 1 ? 'globe-grid.png' : `flag_${locale.geo}.svg`;
+  const flagFile = getCodes(locale).length > 1 ? 'globe-grid.png' : `flag-${locale.geo}.svg`;
   const img = createTag('img', {
     class: 'icon-milo',
-    src: `${config.miloLibs || config.codeRoot}/features/georoutingv2/img/${flagFile}`,
     width: 15,
     height: 15,
   });
+  img.addEventListener(
+    'error',
+    () => (img.src = `${config.miloLibs || config.codeRoot}/features/georoutingv2/img/globe-grid.png`),
+    { once: true },
+  );
+  img.src = `${config.miloLibs || config.codeRoot}/img/georouting/${flagFile}`;
   const span = createTag('span', { class: 'icon margin-right' }, img);
   const mainAction = createTag('a', {
     class: 'con-button blue button-l', lang, role: 'button', 'aria-haspopup': !!locales, 'aria-expanded': false, href: '#',

tools/floodgate/js/promote.js

@@ -155,7 +155,7 @@ async function promoteFloodgatedFiles(project) {
   for (let i = 0; i < promoteStatuses.length; i += 1) {
     if (promoteStatuses[i].success) {
       // eslint-disable-next-line no-await-in-loop
-      const result = await simulatePreview(handleExtension(promoteStatuses[i].srcPath), 1, true);
+      const result = await simulatePreview(handleExtension(promoteStatuses[i].srcPath), 1);
       previewStatuses.push(result);
     }
     // eslint-disable-next-line no-await-in-loop, no-promise-executor-return