Merge branch 'stage' of github.com:adobecom/milo into MWPW-161355

.github/PULL_REQUEST_TEMPLATE/gnav.md

@@ -32,5 +32,5 @@ Resolves: [MWPW-111111](https://jira.corp.adobe.com/browse/MWPW-111111)
 - After: https://main--blog--adobecom.hlx.page/?milolibs=<branch>--milo--<owner>
 
 **Milo:**
-- Before: https://main--milo--adobecom.hlx.page/ch_de/drafts/ramuntea/gnav-refactor?martech=off
-- After: https://<branch>--milo--<owner>.hlx.page/ch_de/drafts/ramuntea/gnav-refactor?martech=off
+- Before: https://main--milo--adobecom.aem.page/ch_de/drafts/ramuntea/gnav-refactor?martech=off
+- After: https://<branch>--milo--<owner>.aem.page/ch_de/drafts/ramuntea/gnav-refactor?martech=off

.github/pull_request_template.md

@@ -7,5 +7,5 @@
 Resolves: [MWPW-NUMBER](https://jira.corp.adobe.com/browse/MWPW-NUMBER)
 
 **Test URLs:**
-- Before: https://main--milo--adobecom.hlx.page/?martech=off
-- After: https://<branch>--milo--adobecom.hlx.page/?martech=off
+- Before: https://main--milo--adobecom.aem.page/?martech=off
+- After: https://<branch>--milo--adobecom.aem.page/?martech=off

.github/workflows/merge-to-stage.js

@@ -44,8 +44,8 @@ let body = `
 **Acrobat:** https://www.stage.adobe.com/acrobat/online/sign-pdf.html
 
 **Milo:**
-- Before: https://main--milo--adobecom.hlx.live/?martech=off
-- After: https://stage--milo--adobecom.hlx.live/?martech=off
+- Before: https://main--milo--adobecom.aem.live/?martech=off
+- After: https://stage--milo--adobecom.aem.live/?martech=off
 `;
 
 const isHighPrio = (labels) => labels.includes(LABELS.highPriority);

.github/workflows/update-script.js

@@ -50,8 +50,8 @@ Resolves: NO TICKET - AUTOMATED CREATED PR.
 - After: https://main--blog--adobecom.hlx.page/?martech=off&milolibs=${branch}--milo--adobecom
 
 **Milo:**
-- Before: https://main--milo--adobecom.hlx.page/ch_de/drafts/ramuntea/gnav-refactor?martech=off
-- After: https://${branch}--milo--adobecom.hlx.page/ch_de/drafts/ramuntea/gnav-refactor?martech=off`;
+- Before: https://main--milo--adobecom.aem.page/ch_de/drafts/ramuntea/gnav-refactor?martech=off
+- After: https://${branch}--milo--adobecom.aem.page/ch_de/drafts/ramuntea/gnav-refactor?martech=off`;
 
 const fetchScript = (path) =>
   new Promise((resolve, reject) => {

CONTRIBUTING.md

@@ -21,7 +21,7 @@ Ensure that your PR follows the [pull request template](.github/pull_request_tem
 
 * description contains Issue or Ticket
 * description _always_ contains at least one Milo-specific testing URL
-  * `https://<branch>--milo--<user>.hlx.page/?martech=off`
+  * `https://<branch>--milo--<user>.aem.page/?martech=off`
 
 Ensure your PR passes all checks:
 

README.md

@@ -4,7 +4,7 @@ Milo is a shared set of features and services to power Franklin-based websites o
 [![codecov](https://codecov.io/gh/adobecom/milo/branch/main/graph/badge.svg?token=a7ZTCbitBt)](https://codecov.io/gh/adobecom/milo)
 
 ## Environments
-[Preview](https://main--milo--adobecom.hlx.page) | [Live](https://milo.adobe.com)
+[Preview](https://main--milo--adobecom.aem.page) | [Live](https://milo.adobe.com)
 
 ## Getting started
 
@@ -51,11 +51,11 @@ You can then test any of the following:
 ```
 http://localhost:3000/?milolibs=local (local code, stage content)
 
-https://main--project--owner.hlx.page/?milolibs=local (prod code, stage content)
+https://main--project--owner.aem.page/?milolibs=local (prod code, stage content)
 
-https://main--project--owner.hlx.live/?milolibs=local (prod code, prod content)
+https://main--project--owner.aem.live/?milolibs=local (prod code, prod content)
 
-https://feat-branch--project--owner.hlx.page/?milolibs=local (feature code, stage content)
+https://feat-branch--project--owner.aem.page/?milolibs=local (feature code, stage content)
 ```
 
 ## Testing

codecov.yaml

@@ -2,7 +2,7 @@ coverage:
   status: 
     patch:
       default:
-        target: 100%
+        target: 90%
         threshold: 0.1%
     project:
       default:

helix-query.yaml

@@ -1,5 +1,5 @@
 version: 1
-# See https://www.hlx.live/docs/setup-indexing.
+# See https://www.aem.live/docs/setup-indexing.
 
 indices:
   wiki:

libs/blocks/bulk-publish-v2/utils.js

@@ -6,7 +6,7 @@ const checkedIcon = `${base}/blocks/bulk-publish-v2/img/checked.svg`;
 const crossedIcon = `${base}/blocks/bulk-publish-v2/img/crossed.svg`;
 const indicatorIcon = `${base}/blocks/bulk-publish-v2/img/indicator.svg`;
 
-const getHost = (host) => (host === 'localhost' ? 'main--milo--adobecom.hlx.page' : host);
+const getHost = (host) => (host === 'localhost' ? 'main--milo--adobecom.aem.page' : host);
 
 const getStatusIcon = (status) => {
   switch (status) {

libs/blocks/caas-marquee/caas-marquee.js

@@ -1,5 +1,5 @@
 /* eslint-disable no-shadow, consistent-return, max-len, quote-props, prefer-const */
-import { createTag, getConfig, loadMartech } from '../../utils/utils.js';
+import { createTag, getConfig, loadMartech, SLD } from '../../utils/utils.js';
 
 const SEGMENTS_MAP = {
   attributes: {
@@ -195,8 +195,8 @@ function getMetadata(el) {
 
 function isProd() {
   const { host } = window.location;
-  return !(host.includes('hlx.page')
-    || host.includes('hlx.live')
+  return !(host.includes(`${SLD}.page`)
+    || host.includes(`${SLD}.live`)
     || host.includes('localhost')
     || host.includes('stage.adobe')
     || host.includes('corp.adobe'));

libs/blocks/caas/caas.js

@@ -11,6 +11,7 @@ import {
   getConfig,
   getMetadata,
   parseEncodedConfig,
+  SLD,
 } from '../../utils/utils.js';
 
 const ROOT_MARGIN = 1000;
@@ -61,12 +62,12 @@ const loadCaas = async (a) => {
 
   if (host.includes('stage.adobe') || env?.name === 'local' || caasEndpoint === 'stage') {
     chimeraEndpoint = S_CAAS_AIO;
-  } else if (host.includes('.hlx.') || caasEndpoint === 'prod') {
+  } else if (host.includes(`.${SLD}.`) || caasEndpoint === 'prod') {
     // If invoking URL is not an Acom URL, then switch to AIO
     chimeraEndpoint = P_CAAS_AIO;
   }
 
-  if (host.includes('hlx.page') || env?.name === 'local' || caasContainer === 'draft') {
+  if (host.includes(`${SLD}.page`) || env?.name === 'local' || caasContainer === 'draft') {
     state.draftDb = true;
   }
 

libs/blocks/card-horizontal/card-horizontal.css

@@ -10,6 +10,7 @@
 
 .card-horizontal a {
   color: var(--text-color);
+  text-decoration: none;
 }
 
 .card-horizontal a:focus {

libs/blocks/editorial-card/editorial-card.css

@@ -307,3 +307,11 @@
 
   .editorial-card .vp-media .desktop-only { display: block; }
 }
+
+/* mobile only */
+@media screen and (max-width: 700px) {
+  .section.two-up-mobile:has(.editorial-card) {
+    grid-template-columns: repeat(2, 1fr);
+    gap: var(--spacing-xs);
+  }
+}

libs/blocks/fragment/fragment.js

@@ -63,7 +63,7 @@ function replaceDotMedia(path, doc) {
 }
 
 export default async function init(a) {
-  const { decorateArea, mep } = getConfig();
+  const { decorateArea, mep, placeholders } = getConfig();
   let relHref = localizeLink(a.href);
   let inline = false;
 
@@ -125,13 +125,16 @@ export default async function init(a) {
   }
 
   updateFragMap(fragment, a, relHref);
-  if (a.dataset.manifestId || a.dataset.adobeTargetTestid) {
-    const { updateFragDataProps } = await import('../../features/personalization/personalization.js');
-    updateFragDataProps(a, inline, sections, fragment);
-  }
-  if (mep?.commands?.length) {
-    const { handleCommands } = await import('../../features/personalization/personalization.js');
-    handleCommands(mep?.commands, fragment, false, true);
+  if (a.dataset.manifestId
+    || a.dataset.adobeTargetTestid
+    || mep?.commands?.length
+    || placeholders) {
+    const { updateFragDataProps, handleCommands, replacePlaceholders } = await import('../../features/personalization/personalization.js');
+    if (a.dataset.manifestId || a.dataset.adobeTargetTestid) {
+      updateFragDataProps(a, inline, sections, fragment);
+    }
+    if (mep?.commands?.length) handleCommands(mep?.commands, fragment, false, true);
+    if (placeholders) fragment.innerHTML = replacePlaceholders(fragment.innerHTML, placeholders);
   }
   if (inline) {
     insertInlineFrag(sections, a, relHref, mep);

libs/blocks/global-footer/global-footer.css

@@ -11,6 +11,10 @@
   list-style-type: none;
 }
 
+.global-footer a {
+  text-decoration: unset;
+}
+
 .global-footer a:hover {
   text-decoration: none;
 }

libs/blocks/library-config/library-config.js

@@ -1,4 +1,4 @@
-import { createTag } from '../../utils/utils.js';
+import { createTag, SLD } from '../../utils/utils.js';
 
 const LIBRARY_PATH = '/docs/library/library.json';
 
@@ -129,7 +129,7 @@ async function getSuppliedLibrary() {
   const owner = searchParams.get('owner');
   const library = searchParams.get('library');
   if (!repo || !owner) return null;
-  return fetchLibrary(`https://main--${repo}--${owner}.hlx.live`, library);
+  return fetchLibrary(`https://main--${repo}--${owner}.${SLD}.live`, library);
 }
 
 async function fetchAssetsData(path) {

libs/blocks/marketo/marketo.js

@@ -20,6 +20,7 @@ import {
   localizeLink,
   createTag,
   createIntersectionObserver,
+  SLD,
 } from '../../utils/utils.js';
 
 const ROOT_MARGIN = 50;
@@ -56,7 +57,7 @@ export const decorateURL = (destination, baseURL = window.location) => {
       throw new Error('URL does not have a valid host');
     }
 
-    if (destinationUrl.hostname.includes('.hlx.')) {
+    if (destinationUrl.hostname.includes(`.${SLD}.`)) {
       destinationUrl = new URL(`${pathname}${search}${hash}`, baseURL.origin);
     }
 

libs/blocks/marquee-anchors/marquee-anchors.css

@@ -74,6 +74,7 @@ html {
   cursor: pointer;
   position: relative;
   color: var(--text-color);
+  text-decoration: none;
 }
 
 .marquee-anchors .links .anchor-link .heading-xs {

libs/blocks/merch/merch.js

@@ -1,5 +1,5 @@
 import {
-  createTag, getConfig, loadArea, loadScript, loadStyle, localizeLink,
+  createTag, getConfig, loadArea, loadScript, loadStyle, localizeLink, SLD,
 } from '../../utils/utils.js';
 import { replaceKey } from '../../features/placeholders.js';
 
@@ -240,7 +240,7 @@ export function getMasBase(hostname, maslibs) {
       baseUrl = 'http://localhost:9001';
     } else if (maslibs) {
       const extension = /.page$/.test(hostname) ? 'page' : 'live';
-      baseUrl = `https://${maslibs}.hlx.${extension}`;
+      baseUrl = `https://${maslibs}.${SLD}.${extension}`;
     } else {
       baseUrl = 'https://www.adobe.com/mas';
     }
@@ -493,7 +493,7 @@ export async function openModal(e, url, offerType, hash, extraOptions) {
     }, { once: true });
   }
   if (isInternalModal(url)) {
-    const fragmentPath = url.split(/hlx.(page|live)/).pop();
+    const fragmentPath = url.split(/(hlx|aem).(page|live)/).pop();
     modal = await openFragmentModal(fragmentPath, getModal);
   } else {
     modal = await openExternalModal(url, getModal, extraOptions);

libs/blocks/modal/modal.css

@@ -289,18 +289,24 @@
     height: 100%;
   }
 
-  .dialog-modal.commerce-frame .milo-iframe {
+  .dialog-modal.dynamic-height > .fragment,
+  .dialog-modal.dynamic-height > .section,
+  .dialog-modal.dynamic-height > .fragment > .section {
+    height: 100%;
+  }
+
+  .dialog-modal.commerce-frame .milo-iframe, .dialog-modal.dynamic-height .milo-iframe  {
     padding-bottom: 0;
     height: 100%;
   }
 
-  .dialog-modal.commerce-frame.height-fit-content {
+  .dialog-modal.commerce-frame.height-fit-content, .dialog-modal.dynamic-height.height-fit-content {
     height: auto;
     max-height: 850px;
     min-width: 1000px;
   }
 
-  .dialog-modal.commerce-frame.height-fit-content .milo-iframe {
+  .dialog-modal.commerce-frame.height-fit-content .milo-iframe, .dialog-modal.dynamic-height.height-fit-content .milo-iframe {
     height: 100%;
     max-height: 845px;
   }
@@ -317,6 +323,12 @@
   }
 }
 
+@media (min-width: 1500px) {
+  .dialog-modal.dynamic-height .milo-iframe {
+    min-width: 1200px;
+  }
+}
+
 .disable-scroll {
   overflow: hidden;
 }

libs/blocks/modal/modal.js

@@ -203,12 +203,13 @@ export async function getModal(details, custom) {
 
   const iframe = dialog.querySelector('iframe');
   if (iframe) {
-    if (dialog.classList.contains('commerce-frame')) {
+    if (dialog.classList.contains('commerce-frame') || dialog.classList.contains('dynamic-height')) {
       const { default: enableCommerceFrameFeatures } = await import('./modal.merch.js');
       await enableCommerceFrameFeatures({ dialog, iframe });
     } else {
       /* Initially iframe height is set to 0% in CSS for the height auto adjustment feature.
-      For modals without the 'commerce-frame' class height auto adjustment is not applicable */
+      The height auto adjustment feature is applicable only to dialogs
+      with the `commerce-frame` or `dynamic-height` classes */
       iframe.style.height = '100%';
     }
   }

libs/blocks/modal/modal.merch.js

@@ -13,7 +13,7 @@ window.addEventListener('pageshow', (event) => {
 export function adjustModalHeight(contentHeight) {
   if (!(window.location.hash || document.getElementById('checkout-link-modal'))) return;
   let selector = '#checkout-link-modal';
-  if (!/=/.test(window.location.hash)) selector = `${selector},div.dialog-modal.commerce-frame${window.location.hash}`;
+  if (!/=/.test(window.location.hash)) selector = `${selector},div.dialog-modal.commerce-frame${window.location.hash},div.dialog-modal.dynamic-height${window.location.hash}`;
   const dialog = document.querySelector(selector);
   const iframe = dialog?.querySelector('iframe');
   const iframeWrapper = dialog?.querySelector('.milo-iframe');
@@ -65,7 +65,8 @@ function reactToMessage({ data, source }) {
 }
 
 export function adjustStyles({ dialog, iframe }) {
-  const isAutoHeightAdjustment = /\/mini-plans\/.*mid=ft.*web=1/.test(iframe.src); // matches e.g. https://www.adobe.com/mini-plans/photoshop.html?mid=ft&web=1
+  // matches e.g. https://www.adobe.com/mini-plans/photoshop.html?mid=ft&web=1 or https://www.adobe.com/creativecloud/whats-included/plans/*
+  const isAutoHeightAdjustment = /\/mini-plans\/.*mid=ft.*web=1/.test(iframe.src) || /\/creativecloud\/whats-included\/plans\//.test(iframe.src);
   if (isAutoHeightAdjustment) {
     dialog.classList.add('height-fit-content');
     // fail safe.

libs/blocks/ost/README.md

@@ -22,7 +22,7 @@ perform the following:
 - navigate to adobe.com,
 - open devtools console,
 - execute `copy(adobeIMS.getAccessToken().token)`,
-- add token to OST URL querystring, e.g.: `https://mwpw-127984--milo--vladen.hlx.page/tools/ost?token=eyJhb...`
+- add token to OST URL querystring, e.g.: `https://mwpw-127984--milo--vladen.aem.page/tools/ost?token=eyJhb...`
 
 ## Settings
 

libs/blocks/pdf-viewer/README.md

@@ -1,7 +1,7 @@
 # PDF Viewer
 
 ## Feature Branch Testing
-The client ids are specific to the origin (no wildcards), so the stage **pdfViewerClientId** only works for **main--milo--adobecom.hlx.page**. If you want to test the pdf on a feature branch, you need to create a new temporary client id. Alternatively, you can name your branch **pdf-viewsdk** and use the existing client id that's set up for **pdf-viewsdk--milo--adobecom.hlx.page**. You can find it in the [developer console](https://developer.adobe.com/console/) under "Milo PDF Viewer Branch".
+The client ids are specific to the origin (no wildcards), so the stage **pdfViewerClientId** only works for **main--milo--adobecom.aem.page**. If you want to test the pdf on a feature branch, you need to create a new temporary client id. Alternatively, you can name your branch **pdf-viewsdk** and use the existing client id that's set up for **pdf-viewsdk--milo--adobecom.aem.page**. You can find it in the [developer console](https://developer.adobe.com/console/) under "Milo PDF Viewer Branch".
 
 How to create a new client id:
 1. Got to https://acrobatservices.adobe.com/dc-integration-creation-app-cdn/main.html?api=pdf-embed-api.

libs/blocks/pdf-viewer/pdf-viewer.js

@@ -1,6 +1,6 @@
 /* global AdobeDC */
 
-import { createTag, getConfig, loadScript } from '../../utils/utils.js';
+import { createTag, getConfig, loadScript, SLD } from '../../utils/utils.js';
 
 const API_SOURCE_URL = 'https://acrobatservices.adobe.com/view-sdk/viewer.js';
 const PDF_RENDER_DIV_ID = 'adobe-dc-view';
@@ -14,7 +14,7 @@ export const getPdfConfig = () => {
   let clientId = env.consumer?.pdfViewerClientId || env.pdfViewerClientId;
   let reportSuiteId = env.consumer?.pdfViewerReportSuite || env.pdfViewerReportSuite;
 
-  if (host.includes('hlx.live') || query === 'live') {
+  if (host.includes(`${SLD}.live`) || query === 'live') {
     /* c8 ignore next 2 */
     clientId = live?.pdfViewerClientId || CLIENT_ID_LIVE;
     reportSuiteId = live?.pdfViewerReportSuite || env.pdfViewerReportSuite;

libs/blocks/preflight/panels/seo.js

@@ -227,6 +227,7 @@ async function checkLinks() {
         && !knownBadUrls.some((url) => url === link.hostname) // Is not a known bad url
       ) {
         link.liveHref = link.href.replace('hlx.page', 'hlx.live');
+        link.liveHref = link.href.replace('aem.page', 'aem.live');
         return true;
       }
       return false;
@@ -278,7 +279,7 @@ export async function sendResults() {
   };
 
   await fetch(
-    'https://main--milo--adobecom.hlx.page/seo/preflight',
+    'https://main--milo--adobecom.aem.page/seo/preflight',
     {
       method: 'POST',
       credentials: 'same-origin',