adobecom · milo-pr-merge · Jun 9, 2025 · Jun 5, 2025 · Jun 5, 2025 · Jun 5, 2025
@@ -49,7 +49,8 @@ export function hideNavigation(el) {
   const elHasWidth = !!el.clientWidth;
   const scrollWidth = itemWidth * columns + gridGap * (columns - 1) + 2 * padding;
   const screenWidth = window.innerWidth < 1200 ? window.innerWidth : 1200;
-  const horizontalScroll = Math.ceil(el.scrollLeft) === Math.ceil(el.scrollWidth - el.clientWidth);
+  const scrollLeft = Math.ceil(Math.abs(el.scrollLeft));
+  const horizontalScroll = scrollLeft === Math.ceil(el.scrollWidth - el.clientWidth);
 
   return elHasWidth ? horizontalScroll : scrollWidth < screenWidth;
 }
@@ -89,9 +90,10 @@ function handleBtnState(
 }
 
 function handleNavigation(el) {
+  const isRtl = document.documentElement.dir === 'rtl';
   const prev = createTag('div', { class: 'nav-grad previous' }, PREVBUTTON);
   const next = createTag('div', { class: 'nav-grad next' }, NEXTBUTTON);
-  const buttons = [prev, next];
+  const buttons = isRtl ? [next, prev] : [prev, next];
   buttons.forEach((btn) => {
     const button = btn.childNodes[0];
     button.addEventListener('click', () => handleScroll(el, button.classList));

@@ -43,6 +43,7 @@ function decorateContent(block) {
   const headings = content?.querySelectorAll('h1, h2, h3, h4, h5, h6');
   const heading = headings?.[headings.length - 1];
   heading?.classList?.add('heading-xs');
+  heading?.setAttribute('role', 'presentation');
   const paragraphs = content.querySelectorAll(':scope > p');
   paragraphs.forEach((item) => item.classList.add('body-xs'));
   const image = decorateImage(block);

@@ -42,6 +42,7 @@ const addInner = (el, cardType, card) => {
   }
 
   if (cardType === HALF_HEIGHT) {
+    title?.setAttribute('role', 'presentation');
     text?.remove();
   }
 

@@ -132,8 +132,7 @@ header.new-nav .feds-nav > section.feds-navItem > .feds-popup .has-subheader .fe
   display: block;
 }
 
-.feds-navLink-image,
-.feds-navLink-description {
+.feds-navLink-image {
   display: none;
 }
 
@@ -150,6 +149,12 @@ header.global-navigation.ready {
   pointer-events: none;
 }
 
+.feds-navLink-description {
+  display: flex;
+  font-size: 12px;
+  color: var(--feds-color-navLink-description);
+}
+
 /* Desktop styles */
 @media (min-width: 900px) {
   .feds-navLink,
@@ -246,12 +251,6 @@ header.global-navigation.ready {
     max-width: 25px;
   }
 
-  .feds-navLink-description {
-    display: flex;
-    font-size: 12px;
-    color: var(--feds-color-navLink-description);
-  }
-
   .feds-navLink:hover .feds-navLink-description,
   .feds-navLink:focus .feds-navLink-description {
     color: var(--feds-color-navLink-description);

@@ -213,31 +213,22 @@ header.global-navigation.feds--dark,
   background: #1b1b1b;
 }
 
-@media (min-width: 900px) {
-  .feds--dark .feds-promo {
-    border: 1px solid var(--feds-borderColor);
-    background: var(--feds-background-promo);
-  }
-
-  .feds--dark .feds-promo--dark,
-  .feds--dark .feds-promo--dark a:not(.feds-cta) {
-    color: var(--feds-color-headline);
-  }
-
-  .feds--dark .feds-promo-link {
-    color: var(--feds-color-blue-link);
-  }
+.feds--dark .feds-promo {
+  border: 1px solid var(--feds-borderColor);
+  background: var(--feds-background-promo);
+}
 
-  .feds--dark .feds-promo-link:hover {
-    color: var(--feds-color-link--hover);
-  }
+.feds--dark .feds-promo--dark,
+.feds--dark .feds-promo--dark a:not(.feds-cta) {
+  color: var(--feds-color-headline);
 }
 
-@media (min-width: 1200px) {
-  .feds--dark .feds-crossCloudMenu-wrapper {
-    border-top: solid 1px var(--feds-borderColor);
-    background-color: var(--feds-background-popup);
-  }
+.feds--dark .feds-promo-link {
+  color: var(--feds-color-blue-link);
+}
+
+.feds--dark .feds-promo-link:hover {
+  color: var(--feds-color-link--hover);
 }
 
 /* dropdown.css */
@@ -303,4 +294,9 @@ header.global-navigation.feds--dark {
   .global-footer.feds--dark {
     background: var(--feds-background-footer--desktop);
   }
+
+  .feds--dark .feds-crossCloudMenu-wrapper {
+    border-top: solid 1px var(--feds-borderColor);
+    background-color: var(--feds-background-popup);
+  }
 }
@@ -1081,7 +1081,8 @@ header.new-nav .feds-nav > section.feds-navItem > .feds-popup .tab-content .feds
   border-right: 1px solid var(--feds-borderColor-link-v2);
 }
 
-header.new-nav .feds-nav > section.feds-navItem > .feds-popup .tab-content a.feds-navLink {
+header.new-nav .feds-nav > section.feds-navItem > .feds-popup .tab-content a.feds-navLink,
+header.new-nav .feds-nav > section.feds-navItem > .feds-popup .tab-content .feds-navLink--header {
   translate: 0 12px;
   opacity: 0;
   animation: slideup 0.6s ease, fadein 0.8s ease;
@@ -1286,7 +1287,7 @@ header.new-nav .feds-breadcrumbs li:first-child:not(:nth-last-child(-n+3)):after
 
 .feds-localnav .feds-localnav-items .feds-navLink-content .feds-navLink-title,
 .feds-localnav .feds-localnav-items li .feds-navLink {
-    white-space: break-spaces;
+    white-space: normal;
 }
 
 .feds-localnav .feds-localnav-items .feds-navItem--centered {

@@ -513,7 +513,7 @@ class Gnav {
     const localNavBtn = toFragment`<button class="feds-navLink--hoverCaret feds-localnav-title" aria-haspopup="true" aria-expanded="false" daa-ll="${title}_localNav|open"></button>`;
     const localNavCurtain = toFragment` <div class="feds-localnav-curtain"></div>`;
     // Skip keyboard navigation on localnav items if it is closed
-    localNav.append(localNavBtn, localNavCurtain, toFragment` <div class="feds-localnav-items"></div>`, toFragment`<a href="#" class="feds-sr-only feds-localnav-exit">.</a>`);
+    localNav.append(localNavBtn, localNavCurtain, toFragment` <div class="feds-localnav-items" role="list"></div>`, toFragment`<a href="#" class="feds-sr-only feds-localnav-exit">.</a>`);
 
     const itemWrapper = localNav.querySelector('.feds-localnav-items');
     const localNavTitle = document.querySelector('.feds-localnav-title');

@@ -60,7 +60,7 @@ selectors.profileDropdown = `
 `;
 
 selectors.popupItems = `
-  ${selectors.navLink},
+  ${selectors.navLink}:not(.feds-navLink--header),
   ${selectors.promoLink},
   ${selectors.imagePromo},
   ${selectors.cta},

@@ -76,13 +76,23 @@ const decorateLinkGroup = (elem, index) => {
       <div class="feds-navLink-title">${link.textContent}</div>
       ${descriptionElem}
     </div>` : '';
-  const linkGroup = toFragment`<a
+  let linkGroup = toFragment`<a
     href="${link.href}"
     class="feds-navLink${modifierClasses.length ? ` ${modifierClasses.join(' ')}` : ''}"
     daa-ll="${getAnalyticsValue(link.textContent, index)}">
       ${imageElem}
       ${contentElem}
     </a>`;
+  if (linkGroup.classList.contains('feds-navLink--header')) {
+    linkGroup = toFragment`<div
+      role="heading"
+      aria-level="3"
+      class="feds-navLink${modifierClasses.length ? ` ${modifierClasses.join(' ')}` : ''}"
+      daa-ll="${getAnalyticsValue(link.textContent, index)}">
+        ${imageElem}
+        ${contentElem}
+      </div>`;
+  }
   if (link?.target) linkGroup.target = link.target;
 
   return linkGroup;

diff --git a/libs/blocks/global-navigation/utilities/utilities.js b/libs/blocks/global-navigation/utilities/utilities.js
@@ -381,7 +381,6 @@ export function closeAllDropdowns({
 
   if (animatedElement && animationType) {
     animatedElement.addEventListener(`${animationType}end`, closeAllOpenElements, { once: true });
-    animatedElement.setAttribute('aria-expanded', 'false');
   } else {
     closeAllOpenElements();
   }
@@ -532,7 +531,7 @@ const parseTabsFromMenuSection = (section) => {
   const daallTab = headline?.getAttribute('daa-ll');
   const daalhTabContent = section.querySelector('.feds-menu-items')?.getAttribute('daa-lh');
   const content = section.querySelector('.feds-menu-items') ?? section;
-  const links = [...content.querySelectorAll('a.feds-navLink, .feds-cta--secondary')].map((x) => x.outerHTML).join('');
+  const links = [...content.querySelectorAll('a.feds-navLink, .feds-navLink.feds-navLink--header, .feds-cta--secondary')].map((x) => x.outerHTML).join('');
   return { name, links, daallTab, daalhTabContent };
 };
 

@@ -13,6 +13,18 @@ const VALIDATION_STEP = {
   mktoFormsCompanyType: '3',
 };
 
+export function updateTabIndex(formEl, stepToAdd, stepToRemove) {
+  const fieldsToAdd = formEl.querySelectorAll(`.mktoFormRowTop[data-validate="${stepToAdd}"]:not(.mktoHidden) input, 
+    .mktoFormRowTop[data-validate="${stepToAdd}"]:not(.mktoHidden) select, 
+    .mktoFormRowTop[data-validate="${stepToAdd}"]:not(.mktoHidden) textarea`);
+  fieldsToAdd.forEach((f) => { f.tabIndex = 0; });
+
+  const fieldsToRemove = formEl.querySelectorAll(`.mktoFormRowTop[data-validate="${stepToRemove}"]:not(.mktoHidden) input, 
+    .mktoFormRowTop[data-validate="${stepToRemove}"]:not(.mktoHidden) select, 
+    .mktoFormRowTop[data-validate="${stepToRemove}"]:not(.mktoHidden) textarea`);
+  fieldsToRemove.forEach((f) => { f.tabIndex = -1; });
+}
+
 function updateStepDetails(formEl, step, totalSteps) {
   formEl.classList.add('hide-errors');
   formEl.classList.remove('show-warnings');
@@ -31,6 +43,7 @@ function showPreviousStep(formEl, totalSteps) {
   const backBtn = formEl.querySelector('.back-btn');
 
   updateStepDetails(formEl, previousStep, totalSteps);
+  updateTabIndex(formEl, previousStep, currentStep);
   if (previousStep === 1) backBtn?.remove();
 }
 
@@ -46,6 +59,7 @@ const showNextStep = (formEl, currentStep, totalSteps) => {
   }
 
   updateStepDetails(formEl, nextStep, totalSteps);
+  updateTabIndex(formEl, nextStep, currentStep);
 };
 
 export const formValidate = (formEl) => {
@@ -61,11 +75,13 @@ export const formValidate = (formEl) => {
   return currentStep === totalSteps;
 };
 
-function setValidationSteps(formEl, totalSteps) {
+function setValidationSteps(formEl, totalSteps, currentStep) {
   formEl.querySelectorAll('.mktoFormRowTop').forEach((row) => {
     const rowAttr = row.getAttribute('data-mktofield') || row.getAttribute('data-mkto_vis_src');
     const step = VALIDATION_STEP[rowAttr] ? Math.min(VALIDATION_STEP[rowAttr], totalSteps) : 1;
     row.dataset.validate = rowAttr?.startsWith('adobe-privacy') ? totalSteps : step;
+    <
10000
span class='blob-code-inner blob-code-marker ' data-code-marker="+">    const fields = row.querySelectorAll('input, select, textarea');
+    if (fields.length) fields.forEach((f) => { f.tabIndex = step === currentStep ? 0 : -1; });
   });
 }
 
@@ -74,7 +90,7 @@ function onRender(formEl, totalSteps) {
   const submitButton = formEl.querySelector('#mktoButton_new');
   submitButton?.classList.toggle('mktoHidden', currentStep !== totalSteps);
   formEl.querySelector('.step-details .step').textContent = `Step ${currentStep} of ${totalSteps}`;
-  setValidationSteps(formEl, totalSteps);
+  setValidationSteps(formEl, totalSteps, currentStep);
 }
 
 const readyForm = (form, totalSteps) => {
@@ -88,9 +104,13 @@ const readyForm = (form, totalSteps) => {
   const stepDetails = createTag('div', { class: 'step-details' }, stepEl);
   formEl.append(nextContainer, stepDetails);
 
-  const debouncedOnRender = debounce(() => onRender(formEl, totalSteps), 10);
+  const debouncedOnRender = debounce(() => onRender(formEl, totalSteps), 50);
   const observer = new MutationObserver(debouncedOnRender);
+  const fieldLoadTimeOnSlowDevice = 12000;
   observer.observe(formEl, { childList: true, subtree: true });
+  setTimeout(() => {
+    observer.disconnect();
+  }, fieldLoadTimeOnSlowDevice);
   debouncedOnRender();
 };
 

@@ -91,21 +91,35 @@
 
 .marketo .mktoFormRowTop {
   display: contents;
+  visibility: visible;
+  position: static;
+  pointer-events: auto;
 }
 
 .marketo.multi-step .mktoFormRow.mktoFormRowTop[data-validate="2"],
 .marketo.multi-step .mktoFormRow.mktoFormRowTop[data-validate="3"] {
-  display: none;
+  display: block;
+  visibility: hidden;
+  position: absolute;
+  left: -100000px;
+  pointer-events: none;
 }
 
 .marketo.multi-step .mktoForm[data-step="2"] .mktoFormRow.mktoFormRowTop[data-validate="2"],
 .marketo.multi-step .mktoForm[data-step="3"] .mktoFormRow.mktoFormRowTop[data-validate="3"] {
   display: contents;
+  visibility: visible;
+  position: static;
+  pointer-events: auto;
 }
 
 .marketo.multi-step .mktoForm[data-step="2"] .mktoFormRow.mktoFormRowTop[data-validate="1"],
 .marketo.multi-step .mktoForm[data-step="3"] .mktoFormRow.mktoFormRowTop[data-validate="1"] {
-  display: none;
+  display: block;
+  visibility: hidden;
+  position: absolute;
+  left: -100000px;
+  pointer-events: none;
 }
 
 .marketo.multi-step .mktoForm[data-step="1"] .mktoFormRow.mktoFormRowTop.adobe-privacy,
@@ -116,6 +130,9 @@
 .marketo.multi-step .mktoForm[data-step="3"] .mktoFormRow.mktoFormRowTop.adobe-privacy,
 .marketo.multi-step.multi-2 .mktoForm[data-step="2"] .mktoFormRow.mktoFormRowTop.adobe-privacy {
   display: grid;
+  visibility: visible;
+  position: static;
+  pointer-events: auto;
 }
 
 .marketo.multi-step .step-details {

@@ -9,6 +9,7 @@ const NOT_FOUND = {
 };
 const DA_DOMAIN = 'da.live';
 const nonEDSContent = 'Non AEM EDS Content';
+const EXCLUDED_PATHS = ['/tools/caas'];
 
 const content = signal({});
 
@@ -69,12 +70,14 @@ function getUrl(el) {
 }
 
 function findLinks(selector) {
-  const hrefs = [];
+  const hrefs = new Set();
   return [...document.body.querySelectorAll(selector)]
     .reduce((links, el) => {
       const url = getUrl(el);
-      if (!hrefs.includes(url.href)) {
-        hrefs.push(url.href);
+      const baseUrl = `${url.origin}${url.pathname}`;
+      if (EXCLUDED_PATHS.some((path) => url.pathname.includes(path))) return links;
+      if (!hrefs.has(baseUrl)) {
+        hrefs.add(baseUrl);
         links.push({ url, edit: null, preview: 'Fetching', live: 'Fetching' });
       }
       return links;

@@ -94,7 +94,7 @@ p.preflight-content-heading-edit {
 
 .preflight-group-row {
   display: grid;
-  grid-template-columns: 1fr 80px 140px 140px;
+  grid-template-columns: minmax(0, 1fr) 80px 140px 140px;
   padding: 12px 24px;
   align-items: center;
 }
@@ -134,6 +134,14 @@ p.preflight-content-heading-edit {
   cursor: pointer;
 }
 
+.preflight-group-row p:first-child a {
+  display: inline-block;
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  width: 100%;
+}
+
 .preflight-group-row.preflight-group-heading:hover {
   cursor: pointer;
 }

@@ -82,6 +82,10 @@
   margin-right: 8px;
 }
 
+.table .col picture {
+  display: flex;
+}
+
 .section.table-section,
 .section.table-merch-section {
   background: var(--color-white);
-Original file line number
+Diff line change
@@ Expand Up / @@ -42,6 +42,7 @@ const addInner = (el, cardType, card) => { @@
       }
       if (cardType === HALF_HEIGHT) {
+        title?.setAttribute('role', 'presentation');
         text?.remove();
       }
@@ Expand Down @@