[Release] Stage to Main (#2138)

.github/workflows/fg-sync-repos.yml

@@ -2,6 +2,15 @@ name: Floodgate Repo Sync
 
 on:
   workflow_dispatch:
+    inputs:
+      syncBranch:
+        description: 'Branch to sync'
+        required: true
+        default: 'stage'
+        type: choice
+        options:
+          - 'stage'
+          - 'main'
 
 jobs:
   build:
@@ -20,27 +29,40 @@ jobs:
         uses: actions/checkout@v2
         with:
           persist-credentials: false
+          ref: ${{ inputs.syncBranch }}
 
-      - name: Clone Floodgate Repository
+      - name: Clone Floodgate Repository and Checkout Selected Branch
         run: |
           git clone https://github.com/adobecom/milo-pink.git ../milo-pink
+          cd ../milo-pink
+          git checkout $FG_SYNC_BRANCH
+          echo "milo-pink branch"
+          git branch
+          cd ../milo
+          echo "milo branch"
+          git branch
+        env:
+          FG_SYNC_BRANCH: ${{ inputs.syncBranch }}
 
       - name: Overwrite floodgate repo files with latest from source repo
         run: |
-          rsync -av --exclude='fstab.yaml' --exclude='.github' --exclude='.git' --exclude='.idea' ./ ../milo-pink/
+          rsync -av --exclude='fstab.yaml' --exclude='.github' --exclude='.kodiak' --exclude='.git' --exclude='.idea' --exclude='.husky' --exclude='.vscode' --exclude='tools/sidekick/config.json' ./ ../milo-pink/
 
       - name: Commit and Push Changes to Floodgate Repository
         run: |
           cd ../milo-pink
+          echo "milo-pink branch"
+          git branch
           git config user.email "$FG_SYNC_BOT_EMAIL"
           git config user.name "$FG_SYNC_BOT_NAME"
           git status          
           git remote set-url origin https://oauth2:[email protected]/adobecom/milo-pink.git
           git remote -v
           git add .
           git commit -m "Syncing milo to milo-pink"
-          git push origin main --force
+          git push origin $FG_SYNC_BRANCH --force
         env:
           GITHUB_TOKEN: ${{ steps.generate_token.outputs.token }}
           FG_SYNC_BOT_EMAIL: ${{ secrets.FG_SYNC_BOT_EMAIL }}
           FG_SYNC_BOT_NAME: ${{ secrets.FG_SYNC_BOT_NAME }}
+          FG_SYNC_BRANCH: ${{ inputs.syncBranch }}

libs/blocks/global-footer/global-footer.js

@@ -226,7 +226,20 @@ class Footer {
     if (url.hash !== '') {
       // Hash -> region selector opens a modal
       decorateAutoBlock(regionPickerElem); // add modal-specific attributes
+      // TODO remove logs after finding the root cause for the region picker 404s -> MWPW-143627
+      if (regionPickerElem.classList[0] !== 'modal') {
+        lanaLog({
+          message: `Modal block class missing from region picker pre loading the block; locale: ${locale}; regionPickerElem: ${regionPickerElem.outerHTML}`,
+          tags: 'errorType=warn,module=global-footer',
+        });
+      }
       await loadBlock(regionPickerElem); // load modal logic and styles
+      if (regionPickerElem.classList[0] !== 'modal') {
+        lanaLog({
+          message: `Modal block class missing from region picker post loading the block; locale: ${locale}; regionPickerElem: ${regionPickerElem.outerHTML}`,
+          tags: 'errorType=warn,module=global-footer',
+        });
+      }
       // 'decorateAutoBlock' logic replaces class name entirely, need to add it back
       regionPickerElem.classList.add(regionPickerClass);
       regionPickerElem.addEventListener('click', () => {

libs/blocks/global-navigation/base.css

@@ -222,6 +222,7 @@
   .feds-navLink[class *= '-gradient'] {
     display: flex;
     border-radius: 4px;
+    font-weight: 600;
   }
 
   .feds-menu-column--group .feds-navLink[class *= '-gradient'] {
@@ -281,4 +282,8 @@
   .feds-navLink--ai-gradient {
     background: linear-gradient(90deg, #bce3ff, #ffe9d3, #f8d5e4);
   }
+
+  .feds-navLink--gray-gradient {
+    background: #eaeaea;
+  }
 }

libs/blocks/mobile-app-banner/mobile-app-banner.js

@@ -62,8 +62,8 @@ function branchInit(header, key) {
 export default async function init(el) {
   const header = document.querySelector('.global-navigation');
   if (!header) return;
-  const row = el.querySelector(':scope > div');
-  const product = row.textContent.trim().toLowerCase();
+  const classListArray = Array.from(el.classList);
+  const product = classListArray.find((token) => token.startsWith('product-')).split('-')[1];
   const key = await getKey(product);
   if (key) branchInit(header, key);
 }

libs/blocks/modal/modal.js

@@ -1,7 +1,7 @@
 /* eslint-disable import/no-cycle */
 import { createTag, getMetadata, localizeLink, loadStyle, getConfig } from '../../utils/utils.js';
 
-const FOCUSABLES = 'a, button, input, textarea, select, details, [tabindex]:not([tabindex="-1"]';
+const FOCUSABLES = 'a:not(.hide-video), button, input, textarea, select, details, [tabindex]:not([tabindex="-1"]';
 const CLOSE_ICON = `<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20">
   <g transform="translate(-10500 3403)">
     <circle cx="10" cy="10" r="10" transform="translate(10500 -3403)" fill="#707070"/>

libs/blocks/tabs/tabs.css

@@ -182,10 +182,6 @@
   margin-inline-start: 24px;
 }
 
-.tabs[class*='pill'] {
-  background: unset;
-}
-
 .tabs[class*='pill'] .tab-content {
   border-bottom: none;
 }

libs/utils/utils.js

@@ -1055,6 +1055,8 @@ async function documentPostSectionLoading(config) {
   import('../martech/attributes.js').then((analytics) => {
     document.querySelectorAll('main > div').forEach((section, idx) => analytics.decorateSectionAnalytics(section, idx, config));
   });
+
+  document.body.appendChild(createTag('div', { id: 'page-load-ok-milo', style: 'display: none;' }));
 }
 
 async function processSection(section, config, isDoc) {

test/blocks/mobile-app-banner/mobile-app-banner.test.js

@@ -0,0 +1,67 @@
+import { readFile } from '@web/test-runner-commands';
+import { expect } from '@esm-bundle/chai';
+import sinon from 'sinon';
+import { delay } from '../../helpers/waitfor.js';
+
+const { setConfig } = await import('../../../libs/utils/utils.js');
+
+const mockConfig = { contentRoot: '/test/blocks/mobile-app-banner/mocks' };
+setConfig(mockConfig);
+
+describe('mobile-app-banner', () => {
+  beforeEach(async () => {
+    document.body.innerHTML = await readFile({ path: './mocks/body.html' });
+  });
+  afterEach(() => {
+    sinon.restore();
+  });
+
+  it('should not call branch init if no branch-io-key.json', async () => {
+    sinon.stub(window, 'fetch');
+    const res = new window.Response('Not found', { status: 404 });
+    window.fetch.returns(Promise.resolve(res));
+
+    const module = await import('../../../libs/blocks/mobile-app-banner/mobile-app-banner.js');
+    const banner = document.body.querySelector('.mobile-app-banner.product-test');
+    await module.default(banner);
+    window.dispatchEvent(new CustomEvent('adobePrivacy:PrivacyConsent'));
+    await delay(0);
+
+    const scriptTags = document.querySelectorAll('head > script');
+    const scriptSrcs = [];
+    scriptTags.forEach((scriptTag) => {
+      scriptSrcs.push(scriptTag.getAttribute('src'));
+    });
+    expect(scriptSrcs).to.not.include('https://cdn.branch.io/branch-latest.min.js');
+  });
+
+  it('should not call branch init if product not found in branch-io-key file', async () => {
+    const module = await import('../../../libs/blocks/mobile-app-banner/mobile-app-banner.js');
+    const banner = document.body.querySelector('.mobile-app-banner.product-test1');
+    await module.default(banner);
+    window.dispatchEvent(new CustomEvent('adobePrivacy:PrivacyConsent'));
+    await delay(0);
+
+    const scriptTags = document.querySelectorAll('head > script');
+    const scriptSrcs = [];
+    scriptTags.forEach((scriptTag) => {
+      if (scriptTag.getAttribute('src') !== null) scriptSrcs.push(scriptTag.getAttribute('src'));
+    });
+    expect(scriptSrcs).to.not.include('https://cdn.branch.io/branch-latest.min.js');
+  });
+
+  it('should init by adding branchio script', async () => {
+    window.adobePrivacy = { hasUserProvidedConsent: () => true };
+    const module = await import('../../../libs/blocks/mobile-app-banner/mobile-app-banner.js');
+    const banner = document.body.querySelector('.mobile-app-banner.product-test');
+    await module.default(banner);
+    window.dispatchEvent(new CustomEvent('adobePrivacy:PrivacyConsent'));
+    await delay(0);
+    const scriptTags = document.querySelectorAll('head > script');
+    const scriptSrcs = [];
+    scriptTags.forEach((scriptTag) => {
+      if (scriptTag.getAttribute('src') !== null) scriptSrcs.push(scriptTag.getAttribute('src'));
+    });
+    expect(scriptSrcs).to.include('https://cdn.branch.io/branch-latest.min.js');
+  });
+});

test/blocks/mobile-app-banner/mocks/body.html

@@ -0,0 +1,10 @@
+<header class="global-navigation" daa-im="true" daa-lh="gnav|milo"><div class="feds-curtain"></div><div class="feds-topnav-wrapper">
+</header>
+<div>Hello World</div>
+<div>
+  <div class="mobile-app-banner product-test">
+  </div>
+  <div>
+    <div class="mobile-app-banner product-test1">
+  </div>  
+</div>

test/blocks/mobile-app-banner/mocks/branch-io-key.json

@@ -0,0 +1,8 @@
+{
+  "data": [
+    {
+      "product": "test",
+      "key": "key_test_eaNdoH8nTxeZXfOsgkELrjgpFrhm4q2m"
+    }
+  ]
+}