MWPW-146930 - Rollout Tool Plugin - environment specific miloLibs (#3516

) * Changing logic based on requirement * Removing console log
adobecom · Jan 23, 2025 · e1946bc · e1946bc
1 parent ae939e3
commit e1946bc
Show file tree

Hide file tree

Showing 3 changed files with 70 additions and 11 deletions.
diff --git a/libs/blocks/rollout/rollout.js b/libs/blocks/rollout/rollout.js
@@ -94,7 +94,7 @@ const createRadioButton = (value, checked = false) => {
  * @param {HTMLElement} el - Container element
  * @param {string} previewUrl - Preview URL
  */
-const buildUi = async (el, previewUrl) => {
+const buildUi = async (el, previewUrl, overrideBranch) => {
   try {
     const modal = createTag('div', { class: 'modal' });
     const radioGroup = createTag('div', { class: 'radio-group' });
@@ -113,13 +113,18 @@ const buildUi = async (el, previewUrl) => {
       const selectedEnv = document.querySelector('input[name="deployTarget"]:checked')?.value;
       if (!selectedEnv) return;
 
+      let branch = urlData.urlBranch;
+      if (overrideBranch) {
+        branch = selectedEnv === 'stage' ? `${overrideBranch}-stage` : overrideBranch;
+      }
+
       const locV3ConfigUrl = new URL(
         'tools/locui-create',
-        `https://${urlData.urlBranch}--${urlData.urlRepo}--${urlData.urlOwner}.hlx.page`,
+        `https://${branch}--${urlData.urlRepo}--${urlData.urlOwner}.hlx.page`,
       );
 
       const params = {
-        milolibs: 'milostudio-stage',
+        milolibs: selectedEnv === 'stage' ? 'milostudio-stage' : 'milostudio',
         ref: urlData.urlBranch,
         repo: urlData.urlRepo,
         owner: urlData.urlOwner,
@@ -154,7 +159,7 @@ const buildUi = async (el, previewUrl) => {
  * @param {HTMLElement} el - Container element
  * @param {string} previewUrl - Preview URL
  */
-const setup = async (el, previewUrl) => {
+const setup = async (el, previewUrl, overrideBranch) => {
   if (!el || !previewUrl) return;
 
   const data = setUrlData(previewUrl, true);
@@ -163,7 +168,7 @@ const setup = async (el, previewUrl) => {
     return;
   }
   el.innerHTML = '';
-  await buildUi(el, previewUrl);
+  await buildUi(el, previewUrl, overrideBranch);
 };
 
 /**
@@ -174,13 +179,12 @@ const setup = async (el, previewUrl) => {
  */
 export default async function init(el, search = window.location.search) {
   if (!el) return false;
-
   try {
     const params = new URLSearchParams(search);
+    const overrideBranch = params?.get('overrideBranch')?.trim();
     const referrer = params?.get('referrer')?.trim();
     const host = params?.get('host')?.trim();
     const project = params?.get('project')?.trim();
-
     if (!referrer || !host || !project) {
       el.innerHTML = '<div class="modal">Missing required parameters</div>';
       return false;
@@ -192,7 +196,7 @@ export default async function init(el, search = window.location.search) {
     }
 
     Object.assign(urlData, { referrer, host, project });
-    await setup(el, referrer);
+    await setup(el, referrer, overrideBranch);
     return true;
   } catch (err) {
     el.innerHTML = '<div class="modal">Initialization failed</div>';

diff --git a/test/blocks/rollout/rollout.test.js b/test/blocks/rollout/rollout.test.js
@@ -10,11 +10,13 @@ const createTestParams = (
   referrer = 'https://main--bacom--adobecom.hlx.page/langstore/de/customer-success',
   host = 'milo.adobe.com',
   project = 'Milo',
+  overrideBranch = null,
 ) => {
   const searchParams = new URLSearchParams();
   searchParams.append('referrer', referrer);
   searchParams.append('host', host);
   searchParams.append('project', project);
+  if (overrideBranch) searchParams.append('overrideBranch', overrideBranch);
   return searchParams;
 };
 
@@ -45,15 +47,20 @@ describe('Rollout', () => {
     const result = await init(el, `?${searchParams.toString()}`);
     expect(result).to.be.true;
 
+    // select the radio button stage
+    const radioButtons = el.querySelectorAll('.radio-group input[type="radio"]');
+    radioButtons[0].checked = true;
+
     // Trigger rollout button click
     const rolloutBtn = el.querySelector('.rollout-btn');
     rolloutBtn.click();
 
     expect(windowOpenStub.called).to.be.true;
 
     const lastUrl = new URL(windowOpenStub.firstCall.args[0]);
-    expect(lastUrl.searchParams.get('language')).to.equal('de'); // Changed to 'de' since test URL has /de/
-
+    expect(lastUrl.hostname).to.equal('main--bacom--adobecom.hlx.page');
+    expect(lastUrl.searchParams.get('language')).to.equal('de');
+    expect(lastUrl.searchParams.get('milolibs')).to.equal('milostudio-stage');
     // Restore original window.open
     windowOpenStub.restore();
   });
@@ -71,4 +78,52 @@ describe('Rollout', () => {
     expect(result).to.be.false;
     expect(el.innerHTML).to.equal('<div class="modal">Missing required parameters</div>');
   });
+
+  it('should handle overrideBranch parameter', async () => {
+    const el = document.querySelector('div');
+    const searchParams = createTestParams('https://main--milo--adobecom.hlx.page/langstore/de/customer-success', 'milo.adobe.com', 'Milo', 'milostudio');
+    const windowOpenStub = sinon.stub(window, 'open');
+
+    const result = await init(el, `?${searchParams.toString()}`);
+    expect(result).to.be.true;
+
+    // Trigger rollout button click
+    const rolloutBtn = el.querySelector('.rollout-btn');
+    rolloutBtn.click();
+
+    expect(windowOpenStub.called).to.be.true;
+
+    const lastUrl = new URL(windowOpenStub.firstCall.args[0]);
+    expect(lastUrl.hostname).to.equal('milostudio--milo--adobecom.hlx.page');
+    expect(lastUrl.searchParams.get('milolibs')).to.equal('milostudio');
+
+    // Restore original window.open
+    windowOpenStub.restore();
+  });
+
+  it('should handle overrideBranch parameter for stage', async () => {
+    const el = document.querySelector('div');
+    const searchParams = createTestParams('https://main--milo--adobecom.hlx.page/langstore/de/customer-success', 'milo.adobe.com', 'Milo', 'milostudio');
+    const windowOpenStub = sinon.stub(window, 'open');
+
+    const result = await init(el, `?${searchParams.toString()}`);
+    expect(result).to.be.true;
+
+    // select the radio button stage
+    const radioButtons = el.querySelectorAll('.radio-group input[type="radio"]');
+    radioButtons[0].checked = true;
+
+    // Trigger rollout button click
+    const rolloutBtn = el.querySelector('.rollout-btn');
+    rolloutBtn.click();
+
+    expect(windowOpenStub.called).to.be.true;
+
+    const lastUrl = new URL(windowOpenStub.firstCall.args[0]);
+    expect(lastUrl.hostname).to.equal('milostudio-stage--milo--adobecom.hlx.page');
+    expect(lastUrl.searchParams.get('milolibs')).to.equal('milostudio-stage');
+
+    // Restore original window.open
+    windowOpenStub.restore();
+  });
 });
diff --git a/tools/sidekick/config.json b/tools/sidekick/config.json
@@ -178,7 +178,7 @@
       "isPalette": true,
       "passReferrer": true,
       "passConfig": true,
-      "url": "/tools/rollout",
+      "url": "/tools/rollout?overrideBranch=milostudio",
       "includePaths": [ "**.docx**", "**.xlsx**" ],
       "paletteRect": "top: 40%; left: 50%; transform: translate(-50%,-50%); height: 350px; width: 500px; overflow: hidden; border-radius: 15px; box-shadow: 0 20px 35px 0px rgba(0, 0, 0, 0.5);"
     }