[Release] Stage to Main

head.html

@@ -1,4 +1,4 @@
 <meta name="viewport" content="width=device-width, initial-scale=1"/>
-<script src="/libs/scripts/scripts.js" type="module" crossorigin="use-credentials"></script>
+<script src="/libs/scripts/scripts.js" type="module"></script>
 <link rel="stylesheet" href="/libs/styles/styles.css"/>
 <link rel="icon" href="data:," size="any"/>

libs/blocks/caas-config/caas-config.js

@@ -1,6 +1,6 @@
 /* eslint-disable compat/compat */
 /* eslint-disable react-hooks/exhaustive-deps */
-/* global ClipboardItem */
+
 import {
   createContext,
   html,
@@ -363,6 +363,7 @@ const UiPanel = () => html`
   <${Input} label="Use Light Text" prop="useLightText" type="checkbox" />
   <${Input} label="Use Overlay Links" prop="useOverlayLinks" type="checkbox" />
   <${Input} label="Show total card count at top" prop="showTotalResults" type="checkbox" />
+  <${Input} label="Hide date for on-demand content" prop="hideDateInterval" type="checkbox" />
   <${Select} label="Card Style" prop="cardStyle" options=${defaultOptions.cardStyle} />
   <${Select} options=${defaultOptions.accessibilityLevel} prop="accessibilityLevel" label="Card Accessibility Title Level" />
   <${Select} label="Layout" prop="container" options=${defaultOptions.container} />

libs/blocks/caas/utils.js

@@ -595,6 +595,7 @@ export const getConfig = async (originalState, strs = {}) => {
         lastModified: strs.lastModified || 'Last modified {date}',
       },
       detailsTextOption: state.detailsTextOption,
+      hideDateInterval: state.hideDateInterval,
       setCardBorders: state.setCardBorders,
       showFooterDivider: state.showFooterDivider,
       useOverlayLinks: state.useOverlayLinks,
@@ -798,6 +799,7 @@ export const defaultState = {
   headers: [],
   hideCtaIds: [],
   hideCtaTags: [],
+  hideDateInterval: false,
   includeTags: [],
   language: 'caas:language/en',
   layoutType: '4up',

libs/blocks/marketo/marketo.css

@@ -534,7 +534,7 @@
   background-color: #123456
 }
 
-.resource-form .marketo {
+.resource-form.section.two-up .marketo {
   margin-left: calc(var(--grid-margins-width) * -1 / 2);
   margin-right: calc(var(--grid-margins-width) * -1 / 2);
 }

libs/blocks/merch/merch.css

@@ -15,7 +15,7 @@ span.placeholder-resolved[data-template="strikethrough"], span.price.price-strik
   visibility: inherit;
 }
 
-a[is='checkout-link'] > span {
+a[is='checkout-link'].con-button > span {
   display: inline-block;
   text-align: center;
   width: 100%;

libs/features/personalization/personalization.js

@@ -111,6 +111,11 @@ export const preloadManifests = ({ targetManifests = [], persManifests = [] }) =
 
 export const getFileName = (path) => path?.split('/').pop();
 
+const isInLcpSection = (el) => {
+  const lcpSection = document.querySelector('body > main > div');
+  return lcpSection === el || lcpSection?.contains(el);
+};
+
 const createFrag = (el, url, manifestId) => {
   let href = url;
   try {
@@ -126,7 +131,9 @@ const createFrag = (el, url, manifestId) => {
   if (isSection) {
     frag = createTag('div', undefined, frag);
   }
-  loadLink(`${localizeLink(a.href)}.plain.html`, { as: 'fetch', crossorigin: 'anonymous', rel: 'preload' });
+  if (isInLcpSection(el)) {
+    loadLink(`${localizeLink(a.href)}.plain.html`, { as: 'fetch', crossorigin: 'anonymous', rel: 'preload' });
+  }
   return frag;
 };
 

libs/features/webapp-prompt/webapp-prompt.css

@@ -182,6 +182,10 @@
     transform: scaleX(0) translateZ(0);
   }
 
+  [dir = "rtl"] .appPrompt-progress {
+    transform-origin: top right;
+  }
+
   @keyframes appPrompt-animate {
     100% {
       transform: scaleX(1);

libs/utils/utils.js

@@ -139,6 +139,7 @@ ENVS.local = {
 export const MILO_EVENTS = { DEFERRED: 'milo:deferred' };
 
 const LANGSTORE = 'langstore';
+const PREVIEW = 'target-preview';
 const PAGE_URL = new URL(window.location.href);
 const SLD = PAGE_URL.hostname.includes('.aem.') ? 'aem' : 'hlx';
 
@@ -168,13 +169,11 @@ export function getLocale(locales, pathname = window.location.pathname) {
   }
   const split = pathname.split('/');
   const localeString = split[1];
-  const locale = locales[localeString] || locales[''];
-  if (localeString === LANGSTORE) {
+  let locale = locales[localeString] || locales[''];
+  if ([LANGSTORE, PREVIEW].includes(localeString)) {
+    const ietf = Object.keys(locales).find((loc) => locales[loc]?.ietf?.startsWith(split[2]));
+    if (ietf) locale = locales[ietf];
     locale.prefix = `/${localeString}/${split[2]}`;
-    if (
-      Object.values(locales)
-        .find((loc) => loc.ietf?.startsWith(split[2]))?.dir === 'rtl'
-    ) locale.dir = 'rtl';
     return locale;
   }
   const isUS = locale.ietf === 'en-US';
@@ -299,8 +298,10 @@ export function localizeLink(
     const isLocalizable = relative || (prodDomains && prodDomains.includes(url.hostname))
       || overrideDomain;
     if (!isLocalizable) return processedHref;
-    const isLocalizedLink = path.startsWith(`/${LANGSTORE}`) || Object.keys(locales)
-      .some((loc) => loc !== '' && (path.startsWith(`/${loc}/`) || path.endsWith(`/${loc}`)));
+    const isLocalizedLink = path.startsWith(`/${LANGSTORE}`)
+      || path.startsWith(`/${PREVIEW}`)
+      || Object.keys(locales).some((loc) => loc !== '' && (path.startsWith(`/${loc}/`)
+      || path.endsWith(`/${loc}`)));
     if (isLocalizedLink) return processedHref;
     const urlPath = `${locale.prefix}${path}${url.search}${hash}`;
     return relative ? urlPath : `${url.origin}${urlPath}`;

test/blocks/caas-config/caas-config.test.html

@@ -316,8 +316,8 @@
         // This does not affect the decoded hash value,
         // so either of these are valid hashes for the same content
 
-        const windowsHash = '~~H4sIAAAAAAAACnVVTY/bNhD9Lzw7Wafb9qDb2ruLGPBm3diLHoqgGJMjiTDFUcmhvUrR/16Q+nacm/TecIbz5oP/ClBKsyYL5iv+E9DzDhxUXmR/fVsIsGAa1tKvyRiU0e4LVCgyISbkwYE8baraofearMhyMB6jgdpSoeUBit5fYFpTsOyaLdhisDwSnSpwp40ku8cYqQ0xxd+snzASnNpzY+JdSjD5hxJ1UXLHHDQbfJAyXuiojeZmi2c0Ivt9IeSQyopt76J2ugLXiCk9ZjpiyfE1uNffB8wyaItOZOLTL8vlC7z/qRWXHYWWD02Nox6y1UJkQgL4rPu9Cz4eCJ6pWoNTnW+GhxROZOJvjyYXC6HoC/EWvjdbAjWoqbSHo8EVWIvOj7CDnB+Pwz9aVZO2UdDL5fIRFB3xo6TqTpa6QgcfoNZ3Y5YinjhrR7ZC21UB36UJClW8ZZdSB4055mDMEeTpaQwnFiJH4OBmJ3NtGN3TefDeAqugjdqBjeVLDVQBaznQW5LQqWIw5wleaCkyQW6AZnH8Ouk7g/YlXZ6qmptBoyIwp2r++i4WokRQg5tSK1wzbNT8f0xc2yslDNgiQIF9ufv/O4ziGmgopP6I4UIdIQL1Qg5vNqolvpousqaJKay6qRnU7ZIhd3WghkLbpN6D1VX6GOJAgUpMTZ5sbKqxy0bmjwCWNafY9gbf5dQBqSAj+ebxUGKF9+NBAxJLMgrdmzNtKzj0wbDfodslAX9bCI/gZPms0fQV8CjJKnDNmOEA7Sk4iT3IUZgVOTWdD1/S5ZmI0T3qs1ax7BOmF9U/p165zb3aueLJZd97E2xzZbNPucygA3FcySntkSDHj8D44OUP2CPeAF9I6VxPqpYIzCGYOGSqP9cSbYl3VId6dqDFv4JVVO2hqo2e7O5kEId2T45n6HM34zOwv9F1Cj3+Qxpt2DmEHt2ZtNsRGZF9Wi6XV0S6JYrsvsXb9+DKcQKvwnVNIkq4nLz4thAMhW+78Oc7MtqIaOoK5LijzzquEDFg16PDseHjwopPFvq4tBQyaOMP+M6vdbfPVFenheB41c8IStuie8lEeR+J2CWp5w4Uxy+KsRDB4za6jt6GoMHj6xmdgWar7Wnsqcl7GJjpxqYJHt3G5hSn57//AaZjTZUyCAAA';
-        const osxHash = '~~H4sIAAAAAAAAA3VVTY/bNhD9Lzw7Wafb9qDb2ruLGPBm3diLHoqgGJMjiTDFUcmhvUrR/16Q+nacm/TecIbz5oP/ClBKsyYL5iv+E9DzDhxUXmR/fVsIsGAa1tKvyRiU0e4LVCgyISbkwYE8baraofearMhyMB6jgdpSoeUBit5fYFpTsOyaLdhisDwSnSpwp40ku8cYqQ0xxd+snzASnNpzY+JdSjD5hxJ1UXLHHDQbfJAyXuiojeZmi2c0Ivt9IeSQyopt76J2ugLXiCk9ZjpiyfE1uNffB8wyaItOZOLTL8vlC7z/qRWXHYWWD02Nox6y1UJkQgL4rPu9Cz4eCJ6pWoNTnW+GhxROZOJvjyYXC6HoC/EWvjdbAjWoqbSHo8EVWIvOj7CDnB+Pwz9aVZO2UdDL5fIRFB3xo6TqTpa6QgcfoNZ3Y5YinjhrR7ZC21UB36UJClW8ZZdSB4055mDMEeTpaQwnFiJH4OBmJ3NtGN3TefDeAqugjdqBjeVLDVQBaznQW5LQqWIw5wleaCkyQW6AZnH8Ouk7g/YlXZ6qmptBoyIwp2r++i4WokRQg5tSK1wzbNT8f0xc2yslDNgiQIF9ufv/O4ziGmgopP6I4UIdIQL1Qg5vNqolvpousqaJKay6qRnU7ZIhd3WghkLbpN6D1VX6GOJAgUpMTZ5sbKqxy0bmjwCWNafY9gbf5dQBqSAj+ebxUGKF9+NBAxJLMgrdmzNtKzj0wbDfodslAX9bCI/gZPms0fQV8CjJKnDNmOEA7Sk4iT3IUZgVOTWdD1/S5ZmI0T3qs1ax7BOmF9U/p165zb3aueLJZd97E2xzZbNPucygA3FcySntkSDHj8D44OUP2CPeAF9I6VxPqpYIzCGYOGSqP9cSbYl3VId6dqDFv4JVVO2hqo2e7O5kEId2T45n6HM34zOwv9F1Cj3+Qxpt2DmEHt2ZtNsRGZF9Wi6XV0S6JYrsvsXb9+DKcQKvwnVNIkq4nLz4thAMhW+78Oc7MtqIaOoK5LijzzquEDFg16PDseHjwopPFvq4tBQyaOMP+M6vdbfPVFenheB41c8IStuie8lEeR+J2CWp5w4Uxy+KsRDB4za6jt6GoMHj6xmdgWar7Wnsqcl7GJjpxqYJHt3G5hSn57//AaZjTZUyCAAA';
+        const windowsHash = '~~H4sIAAAAAAAACnVVTY/bNhD9Lzw7Wafb9qDb2ruLGPBm3diLHoqgGJMjiTDFUcmhvUrR/16Q+nacm/TecL74ZvivAKU0a7JgvuI/AT3vwEHlRfbXt4UAC6ZhLf2ajEEZ7b5AhSITYkIeHMjTpqodeq/JiiwH4zEaqC0VWh6g6P0FpjUFy67Zgi0GyyPRqQJ32kiye4yR2hBT/M36CSPBqT03JuZSgsk/lKiLkjvmoNngg5QxoaM2mpstntGI7PeFkEMpK7a9i9rpClwjpvRY6Yglx9fgXn8fMMugLTqRiU+/LJcv8P6nVlx2FFo+NDWO/ZBtL0QmJIDPut+74OOB4JmqNTjV+WZ4SOFEJv72aHKxEIq+EG/he7MlUEM3lfZwNLgCa9H5EXaQ8+Nx+EeratI2NvRyuXwERUf8KKm6k6Wu0MEHqPXdWKWIJ87aka3QdreA79IEhSpm2ZXUQWONORhzBHl6GsOJhcgROLjZyVwbRvd0Hry3wCpoo3Zg4/UlAVXAWg70liR0XTGY8wQvtBSZIDdAszh+nfo7g/YlXZ6qmpuhR0VgTrf567tYiBJBDW5KrXDNsFHz/7HwCDwC48YyujOYwam2Vy0yYIsABfY66P/vMHbdQEMhCSfmEeoIEagXcnhTwZb4auzImibWturGaWh7lxC5qwM1FNqmtj5YXaWPIQ4UqMTU5MlGtY3yG5k/AljWnGLbG3xXUwekmxrJN4+HEiu8Hw8akFiSUejenGk14tAHw36Hbpca+NtCeAQny2eNpr8aj5KsAteMFQ7QnoKT2IMcG7Mip6aD40u6PBMxukd91irqYcL0TfXPSUS3uVc773hy2Ytygm2ubPaplhl0II67OpU9EuQ4au3Byx+wR7wBvpDSuZ7cWiIwh2Di9Kn+XEu0V7yjOtSzAy3+Fayiag9VbfRkqSeDOM17cjxDn7vhn4F9Rtcl9PgPZbRh5xB6dGfSbkdkRPZpuVxeESlLFNl9i7cPxZXjBF6F60QiSricvPi2EAyFb1X48+UZbUQ0dQVyXN5nHXeLGLDr0eEo+LjJ4luGPm4zhQza+AO+82vdLTrV3dNCcEz1M4LStuieOFHeRyKqJGnuQHH8YjMWInjcRtfR2xA0eHw9ozPQbLU9jZqaPJSBmW5smuDRbWxOcXr++x/O+0/8SwgAAA==';
+        const osxHash = '~~H4sIAAAAAAAAA3VVTY/bNhD9Lzw7Wafb9qDb2ruLGPBm3diLHoqgGJMjiTDFUcmhvUrR/16Q+nacm/TecL74ZvivAKU0a7JgvuI/AT3vwEHlRfbXt4UAC6ZhLf2ajEEZ7b5AhSITYkIeHMjTpqodeq/JiiwH4zEaqC0VWh6g6P0FpjUFy67Zgi0GyyPRqQJ32kiye4yR2hBT/M36CSPBqT03JuZSgsk/lKiLkjvmoNngg5QxoaM2mpstntGI7PeFkEMpK7a9i9rpClwjpvRY6Yglx9fgXn8fMMugLTqRiU+/LJcv8P6nVlx2FFo+NDWO/ZBtL0QmJIDPut+74OOB4JmqNTjV+WZ4SOFEJv72aHKxEIq+EG/he7MlUEM3lfZwNLgCa9H5EXaQ8+Nx+EeratI2NvRyuXwERUf8KKm6k6Wu0MEHqPXdWKWIJ87aka3QdreA79IEhSpm2ZXUQWONORhzBHl6GsOJhcgROLjZyVwbRvd0Hry3wCpoo3Zg4/UlAVXAWg70liR0XTGY8wQvtBSZIDdAszh+nfo7g/YlXZ6qmpuhR0VgTrf567tYiBJBDW5KrXDNsFHz/7HwCDwC48YyujOYwam2Vy0yYIsABfY66P/vMHbdQEMhCSfmEeoIEagXcnhTwZb4auzImibWturGaWh7lxC5qwM1FNqmtj5YXaWPIQ4UqMTU5MlGtY3yG5k/AljWnGLbG3xXUwekmxrJN4+HEiu8Hw8akFiSUejenGk14tAHw36Hbpca+NtCeAQny2eNpr8aj5KsAteMFQ7QnoKT2IMcG7Mip6aD40u6PBMxukd91irqYcL0TfXPSUS3uVc773hy2Ytygm2ubPaplhl0II67OpU9EuQ4au3Byx+wR7wBvpDSuZ7cWiIwh2Di9Kn+XEu0V7yjOtSzAy3+Fayiag9VbfRkqSeDOM17cjxDn7vhn4F9Rtcl9PgPZbRh5xB6dGfSbkdkRPZpuVxeESlLFNl9i7cPxZXjBF6F60QiSricvPi2EAyFb1X48+UZbUQ0dQVyXN5nHXeLGLDr0eEo+LjJ4luGPm4zhQza+AO+82vdLTrV3dNCcEz1M4LStuieOFHeRyKqJGnuQHH8YjMWInjcRtfR2xA0eHw9ozPQbLU9jZqaPJSBmW5smuDRbWxOcXr++x/O+0/8SwgAAA==';
         const hash = copyTextArea.value.split('#')[1].trim();        
         let isCorrectHash = false;
         let osHash = navigator.platform.startsWith('Win') ? windowsHash : osxHash;

test/blocks/caas-config/expectedConfigs/defaultConfig.js

@@ -8,6 +8,7 @@ const defaultConfig = {
     endpoint:
       'https://www.adobe.com/chimera-api/collection?originSelection=hawks&contentTypeTags=&secondSource=&secondaryTags=&collectionTags=&excludeContentWithTags=&language=en&country=us&complexQuery=&excludeIds=&currentEntityId=&featuredCards=&environment=&draft=false&size=10',
     fallbackEndpoint: '',
+    hideDateInterval: false,
     totalCardsToShow: 10,
     cardStyle: 'half-height',
     cardHoverEffect: 'default',

test/blocks/caas/utils.test.js

@@ -168,6 +168,7 @@ describe('getConfig', () => {
         endpoint:
           'https://www.adobe.com/chimera-api/collection/myTargetActivity.json?originSelection=hawks&contentTypeTags=&secondSource=&secondaryTags=&collectionTags=&excludeContentWithTags=&language=en&country=us&complexQuery=((%22caas%3Aproducts%2Findesign%22%2BAND%2B%22caas%3Aproducts%2Freader%22)%2BAND%2B(%22caas%3Acountry%2Fbr%22%2BOR%2B%22caas%3Acountry%2Fca%22))%2BAND%2B((%22caas%3Acontent-type%2Fvideo%22%2BAND%2B%22caas%3Acontent-type%2Fblog%22))&excludeIds=&currentEntityId=&featuredCards=c94ec235-50c2-595e-9fa8-0b4602c08712%2Ce9d71f5e-e7c9-5d6d-89e9-2ffdad17b8bd&environment=&draft=true&size=10&flatFile=false',
         fallbackEndpoint: '',
+        hideDateInterval: false,
         totalCardsToShow: 10,
         cardStyle: 'half-height',
         ctaAction: '_self',
@@ -429,6 +430,7 @@ describe('getConfig', () => {
         endpoint:
           'https://www.adobe.com/chimera-api/collection/myTargetActivity.json?originSelection=hawks&contentTypeTags=&secondSource=&secondaryTags=&collectionTags=&excludeContentWithTags=&language=fr&country=be&complexQuery=((%22caas%3Aproducts%2Findesign%22%2BAND%2B%22caas%3Aproducts%2Freader%22)%2BAND%2B(%22caas%3Acountry%2Fbr%22%2BOR%2B%22caas%3Acountry%2Fca%22))%2BAND%2B((%22caas%3Acontent-type%2Fvideo%22%2BAND%2B%22caas%3Acontent-type%2Fblog%22))&excludeIds=&currentEntityId=&featuredCards=b6aa23a7-f6bf-51f4-a2b6-0a93fc31bd16%2Ce9d71f5e-e7c9-5d6d-89e9-2ffdad17b8bd&environment=&draft=true&size=10&flatFile=false',
         fallbackEndpoint: '',
+        hideDateInterval: false,
         totalCardsToShow: 10,
         cardStyle: 'half-height',
         ctaAction: '_self',
@@ -751,6 +753,7 @@ describe('getFloodgateCaasConfig', () => {
         endpoint:
           'https://www.adobe.com/chimera-api/collection/myTargetActivity.json?originSelection=hawks&contentTypeTags=&secondSource=&secondaryTags=&collectionTags=&excludeContentWithTags=&language=en&country=us&complexQuery=((%22caas%3Aproducts%2Findesign%22%2BAND%2B%22caas%3Aproducts%2Freader%22)%2BAND%2B(%22caas%3Acountry%2Fbr%22%2BOR%2B%22caas%3Acountry%2Fca%22))%2BAND%2B((%22caas%3Acontent-type%2Fvideo%22%2BAND%2B%22caas%3Acontent-type%2Fblog%22))&excludeIds=&currentEntityId=&featuredCards=c94ec235-50c2-595e-9fa8-0b4602c08712%2Ce9d71f5e-e7c9-5d6d-89e9-2ffdad17b8bd&environment=&draft=true&size=10&flatFile=false',
         fallbackEndpoint: '',
+        hideDateInterval: false,
         totalCardsToShow: 10,
         cardStyle: 'half-height',
         ctaAction: '_self',

test/features/personalization/actions.test.js

@@ -263,4 +263,26 @@ describe('custom actions', async () => {
       },
     });
   });
+
+  it('Only fragments in the first section should be preloaded', async () => {
+    document.body.innerHTML = await readFile({ path: './mocks/personalization.html' });
+
+    let manifestJson = await readFile({ path: './mocks/actions/manifestPreloadFrags.json' });
+    manifestJson = JSON.parse(manifestJson);
+    setFetchResponse(manifestJson);
+
+    // This fragment is in the 1st section and should be preloaded
+    const lcpLink = 'link[href^="/test/features/personalization/mocks/fragments/fragmentReplaced"]';
+
+    // This fragment is in the 3rd section and should not be preloaded
+    const notLcpLink = 'link[href^="/test/features/personalization/mocks/fragments/inlineFragReplaced"]';
+
+    expect(document.querySelector(lcpLink)).not.to.exist;
+    expect(document.querySelector(notLcpLink)).not.to.exist;
+
+    await applyPers([{ manifestPath: '/path/to/manifest.json' }]);
+
+    expect(document.querySelector(lcpLink)).to.exist;
+    expect(document.querySelector(notLcpLink)).not.to.exist;
+  });
 });

test/features/personalization/mocks/actions/manifestPreloadFrags.json

@@ -0,0 +1,28 @@
+{
+  "total": 5,
+  "offset": 0,
+  "limit": 5,
+  "data": [
+    {
+      "action": "replace",
+      "selector": ".custom-block",
+      "page filter (optional)": "",
+      "param-newoffer=123": "",
+      "chrome": "/test/features/personalization/mocks/fragments/fragmentReplaced",
+      "firefox": "",
+      "android": "",
+      "ios": ""
+    },
+    {
+      "action": "replace",
+      "selector": ".how-to",
+      "page filter (optional)": "",
+      "param-newoffer=123": "",
+      "chrome": "/test/features/personalization/mocks/fragments/inlineFragReplaced",
+      "firefox": "",
+      "android": "",
+      "ios": ""
+    }
+  ],
+  ":type": "sheet"
+}