Merge branch 'stage' into mwpw157864locmodals

.github/codeql/codeql-config.yml

@@ -6,3 +6,4 @@ paths-ignore:
   - 'tools/translation/**'
   - node_modules
   - libs/deps/mas
+  - libs/features/mas/dist

.github/workflows/helpers.js

@@ -43,7 +43,11 @@ const RCPDates = [
   },
 ];
 
-const isWithinRCP = (offset = 0) => {
+const isShortRCP = (start, end) => {
+  return ((end - start) / (1000 * 60 * 60)) < 24;
+};
+
+const isWithinRCP = ({ offset = 0, excludeShortRCP = false } = {}) => {
   const now = new Date();
   if (now.getFullYear() !== CURRENT_YEAR) {
     console.log(`ADD NEW RCPs for ${CURRENT_YEAR + 1}`);
@@ -53,7 +57,9 @@ const isWithinRCP = (offset = 0) => {
   if (RCPDates.some(({ start, end }) => {
     const adjustedStart = new Date(start);
     adjustedStart.setDate(adjustedStart.getDate() - offset);
-    return start <= now && now <= end
+    const match = adjustedStart <= now && now <= end;
+    if (!match || (excludeShortRCP && isShortRCP(start, end))) return false;
+    return true;
   })) {
     console.log(
       'Current date is within a RCP (2 days earlier for stage, to keep stage clean & make CSO contributions during an RCP easier). Stopping execution.'
@@ -148,6 +154,7 @@ module.exports = {
   getLocalConfigs,
   slackNotification,
   pulls: { addLabels, addFiles, getChecks, getReviews },
+  isShortRCP,
   isWithinRCP,
   RCPDates,
 };

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

@@ -9,6 +9,7 @@ const {
 const PR_TITLE = '[Release] Stage to Main';
 const STAGE = 'stage';
 const PROD = 'main';
+const MIN_SOT_APPROVALS = process.env.MIN_SOT_APPROVALS ? Number(process.env.MIN_SOT_APPROVALS) : 4;
 
 let github, owner, repo;
 
@@ -40,7 +41,7 @@ const main = async (params) => {
     const stageToMainPR = await getStageToMainPR();
     const signOffs = stageToMainPR?.labels.filter((l) => l.includes('SOT'));
     console.log(`${signOffs.length} SOT labels on PR ${stageToMainPR.number}`);
-    if (signOffs.length >= 4) {
+    if (signOffs.length >= MIN_SOT_APPROVALS) {
       console.log('Stage to Main  PR has all required labels. Merging...');
       await github.rest.pulls.merge({
         owner,

.github/workflows/merge-to-main.yaml

@@ -9,6 +9,7 @@ on:
 
 env:
   MILO_RELEASE_SLACK_WH: ${{ secrets.MILO_RELEASE_SLACK_WH }}
+  MIN_SOT_APPROVALS: ${{ secrets.MIN_SOT_APPROVALS }}
 
 jobs:
   merge-to-main:

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

@@ -231,7 +231,7 @@ const main = async (params) => {
   github = params.github;
   owner = params.context.repo.owner;
   repo = params.context.repo.repo;
-  if (isWithinRCP(process.env.STAGE_RCP_OFFSET_DAYS || 2)) return console.log('Stopped, within RCP period.');
+  if (isWithinRCP({ offset: process.env.STAGE_RCP_OFFSET_DAYS || 2, excludeShortRCP: true })) return console.log('Stopped, within RCP period.');
 
   try {
     const stageToMainPR = await getStageToMainPR();

.github/workflows/rcp-notifier.js

@@ -2,10 +2,13 @@ const {
   slackNotification,
   getLocalConfigs,
   RCPDates,
+  isShortRCP,
 } = require('./helpers.js');
 
-const isWithin24Hours = (targetDate) =>
-  Math.abs(new Date() - targetDate) <= 24 * 60 * 60 * 1000;
+const isWithin24Hours = (targetDate) => {
+  const now = new Date();
+  return now < targetDate && new Date(now.getTime() + 24 * 60 * 60 * 1000) > targetDate;
+};
 
 const calculateDateOffset = (date, offset) => {
   const newDate = new Date(date);
@@ -19,17 +22,18 @@ const main = async () => {
   for (const rcp of RCPDates) {
     const start = new Date(rcp.start);
     const end = new Date(rcp.end);
+    const isShort = isShortRCP(start, end);
     const tenDaysBefore = calculateDateOffset(start, 10);
     const fourDaysBefore = calculateDateOffset(start, 4);
     const stageOffset = Number(process.env.STAGE_RCP_OFFSET_DAYS) || 2;
     const slackText = (days) =>
       `Reminder RCP starts in ${days} days: from ${start.toUTCString()} to ${end.toUTCString()}. Merges to stage will be disabled beginning ${calculateDateOffset(start, stageOffset).toUTCString()}.`;
-    if (isWithin24Hours(tenDaysBefore)) {
+    if (isWithin24Hours(tenDaysBefore) && !isShort) {
       console.log('Is within 24 hours of 10 days before RCP');
       await slackNotification(slackText(10), process.env.MILO_DEV_HOOK);
     }
 
-    if (isWithin24Hours(fourDaysBefore)) {
+    if (isWithin24Hours(fourDaysBefore) && !isShort) {
       console.log('Is within 24 hours of 4 days before RCP');
       await slackNotification(slackText(4), process.env.MILO_DEV_HOOK);
     }

.github/workflows/run-mas-tests.yaml

@@ -34,13 +34,6 @@ jobs:
       - name: Upload commerce coverage to Codecov
         uses: codecov/codecov-action@v4
         with:
-          name: mas-commerce
+          name: mas
           token: ${{ secrets.CODECOV_TOKEN }}
-          files: libs/features/mas/commerce/coverage/lcov.info
-
-      - name: Upload web-components coverage to Codecov
-        uses: codecov/codecov-action@v4
-        with:
-          name: mas-web-components
-          token: ${{ secrets.CODECOV_TOKEN }}
-          files: libs/features/mas/web-components/coverage/lcov.info
+          files: libs/features/mas/coverage/lcov.info

.github/workflows/run-nala-circleci.yml

@@ -1,9 +1,7 @@
 name: Nala Tests on CircleCI
 
 on:
-  push:
-    branches:
-      - stage
+  workflow_dispatch:
 
 jobs:
   trigger-circleci:
@@ -15,4 +13,4 @@ jobs:
           curl -X POST 'https://circle.ci.adobe.com/api/v2/project/gh/wcms/nala/pipeline' \
               -H 'Circle-Token: ${{ secrets.CCI_TOKEN }}' \
               -H 'content-type: application/json' \
-              -d "{\"branch\":\"main\"}"
+              -d "{\"branch\":\"main\"}"

.github/workflows/run-tests.yaml

@@ -22,6 +22,7 @@ jobs:
       uses: actions/setup-node@v4
       with:
         node-version: ${{ matrix.node-version }}
+        cache: 'npm'
 
     - name: Install dependencies
       run: npm install

.hlxignore

@@ -10,3 +10,4 @@ web-test-runner.config.mjs
 codecov.yaml
 libs/features/mas/*
 !libs/features/mas/docs
+!libs/features/mas/dist

README.md

@@ -74,6 +74,8 @@ npm run test:watch
 -----
 
 #### 1. Running Nala Tests
+Make sure you ran `npm run install` in the project root.
+You might need also to run `npx playwright install`.
 Nala tests are run using the `npm run nala <env> [options]` command:
 
 ```sh
@@ -91,8 +93,14 @@ npm run nala <env> [options]
   - config=<config-file>               # Configuration file (default: Playwright default)
   - project=<project-name>             # Project configuration (default: milo-live-chromium)
   - milolibs=<local|prod|feature|any|> # Milolibs?=<env> 
+```
 
+Examples:
+```
+npm run nala local test=masccd.test.js                # Run tests from masccd.test.js file on your local changes. Don't forget `aem up` before running.
+npm run nala MWPW-162385 owner='npeltier' @mas-ccd    # Run tests tagged as 'mas-ccd' in 'npeltier' fork on MWPW-162385 branch
 ```
+
 #### 2. Nala Help Command:
 To view examples of how to use Nala commands with various options, you can run
 ```sh

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

@@ -1,3 +1,4 @@
+import '../merch/merch.js';
 import { overrideUrlOrigin } from '../../utils/helpers.js';
 import {
   createTag, decorateLinks, getConfig, loadBlock, loadStyle, localizeLink,
@@ -131,14 +132,8 @@ export function parsePreferences(elements) {
 }
 
 /** Retrieve cards from query-index  */
-async function fetchCardsData(config, type, el) {
+async function fetchCardsData(config, endpointElement, type, el) {
   let cardsData;
-  const usePreviewIndex = config.env.name === 'stage' && !window.location.host.includes('.live');
-  const endpointElement = el.querySelector(`a[href*="${usePreviewIndex ? PREVIEW_INDEX : PROD_INDEX}"]`)
-                            ?? el.querySelector(`a[href*="${PROD_INDEX}"]`);
-  if (!endpointElement) {
-    throw new Error('No query-index endpoint provided');
-  }
   el.querySelector(`a[href*="${PROD_INDEX}"]`)?.remove();
   el.querySelector(`a[href*="${PREVIEW_INDEX}"]`)?.remove();
   let queryIndexCardPath = localizeLink(endpointElement.getAttribute('href'), config);
@@ -185,28 +180,39 @@ export default async function init(el) {
   }
   const config = getConfig();
   const type = el.classList[1];
-  const cardsDataPromise = fetchCardsData(config, type, el);
-
-  const merchCardCollectionDep = import('../../deps/mas/merch-card-collection.js');
-  const polyfills = import('../merch/merch.js');
-  await polyfills;
-  let deps = [
-    polyfills,
-    merchCardCollectionDep,
-    import('../merch-card/merch-card.js'),
-    import('../../deps/mas/merch-card.js'),
-  ];
-
-  const { base, mep } = getConfig();
-  const merchStyles = new Promise((resolve) => {
-    loadStyle(`${base}/blocks/merch/merch.css`, resolve);
-  });
-  const merchCardStyles = new Promise((resolve) => {
-    loadStyle(`${base}/blocks/merch-card/merch-card.css`, resolve);
-  });
+
+  const usePreviewIndex = config.env.name === 'stage' && !window.location.host.includes('.live');
+  const endpointElement = el.querySelector(`a[href*="${usePreviewIndex ? PREVIEW_INDEX : PROD_INDEX}"]`)
+                            ?? el.querySelector(`a[href*="${PROD_INDEX}"]`);
+  if (!endpointElement) {
+    return fail(el, 'No query-index endpoint provided');
+  }
 
   let cardsData;
+  let deps;
+  let base;
+  let mep;
+  let merchStyles;
+  let merchCardStyles;
+  const merchCardCollectionDep = import(
+    '../../deps/mas/merch-card-collection.js'
+  );
   try {
+    const cardsDataPromise = fetchCardsData(config, endpointElement, type, el);
+    deps = [
+      merchCardCollectionDep,
+      import('../merch-card/merch-card.js'),
+      import('../../deps/mas/merch-card.js'),
+    ];
+
+    ({ base, mep } = config);
+    merchStyles = new Promise((resolve) => {
+      loadStyle(`${base}/blocks/merch/merch.css`, resolve);
+    });
+    merchCardStyles = new Promise((resolve) => {
+      loadStyle(`${base}/blocks/merch-card/merch-card.css`, resolve);
+    });
+
     cardsData = await cardsDataPromise;
   } catch (error) {
     return fail(el, error);
@@ -293,6 +299,9 @@ export default async function init(el) {
       literalEl.remove();
       if (slot) {
         slot.setAttribute('slot', LITERAL_SLOTS[index]);
+        if (LITERAL_SLOTS[index].toLowerCase().includes('result')) {
+          slot.setAttribute('aria-live', 'polite');
+        }
         index += 1;
       }
       literalSlots.push(slot);

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

@@ -77,7 +77,7 @@ export async function loadMnemonicList(foreground) {
   try {
     const { base } = getConfig();
     const stylePromise = new Promise((resolve) => {
-      loadStyle(`${base}/blocks/mnemonic-list/mnemonic-list.css`, resolve);
+      loadStyle(`${base}/blocks/mnemonic-list/merch-mnemonic-list.css`, resolve);
     });
     const loadModule = import(`${base}/blocks/mnemonic-list/mnemonic-list.js`)
       .then(({ decorateMnemonicList }) => decorateMnemonicList(foreground));

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.4';
+const OST_VERSION = '1.19.1';
 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`;