MWPW-161872: Self host marketo's forms2.min.js (#3215)

* Adds marketo forms2.min.js to dependencies, upates dependency workflow, updates marketo.js to call form from correct location * Adding comment for git change only * Adding comment to hopefully see change * Removing comments * Typo * Updating PR description * Fixing tests
adobecom · Dec 11, 2024 · 6b2d5c6 · 6b2d5c6
1 parent 635c26b
commit 6b2d5c6
Show file tree

Hide file tree

Showing 6 changed files with 89 additions and 38 deletions.
diff --git a/.github/workflows/update-dependencies.yaml b/.github/workflows/update-dependencies.yaml
@@ -13,7 +13,7 @@ jobs:
     - name: Checkout repository
       uses: actions/checkout@v4
 
-    - name: Update file and create PR if needed
+    - name: Update ims lib and create PR if needed
       uses: actions/github-script@v7
       with:
         script: |
@@ -26,5 +26,18 @@ jobs:
             branch: 'update-imslib',
             scriptPath: './libs/deps/imslib.min.js'
           })
+    - name: Update forms2 and create PR if needed
+      uses: actions/github-script@v7
+      with:
+        script: |
+          const updateDependency = require('./.github/workflows/update-script.js')
+          updateDependency({
+            github, 
+            context, 
+            title: '[AUTOMATED-PR] Update forms2.min.js dependency', 
+            path: 'https://engage.adobe.com/js/forms2/js/forms2.min.js',
+            branch: 'update-forms2',
+            scriptPath: './libs/deps/forms2.min.js'
+          })
       env:
         GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
diff --git a/.github/workflows/update-script.js b/.github/workflows/update-script.js
@@ -17,41 +17,67 @@ const localRunConfigs = {
   origin: process.env.LOCAL_RUN_ORIGIN || 'origin',
 };
 
-const getPrDescription = ({ branch, scriptPath }) => `## Description
-Update ${scriptPath} to the latest version
-
-## Related Issue
-Resolves: NO TICKET - AUTOMATED CREATED PR.
-
-## Testing instructions
-1. Signing in should still function
-2. Signing out should still work
-3. Regression tests on all consumers
-
-## Test URLs
-**Acrobat:**
-- Before: https://www.stage.adobe.com/acrobat/online/sign-pdf.html?martech=off
-- After: https://www.stage.adobe.com/acrobat/online/sign-pdf.html?martech=off&milolibs=${branch}--milo--adobecom
-
-**BACOM:**
-- Before: https://business.stage.adobe.com/fr/customer-success-stories.html?martech=off
-- After: https://business.stage.adobe.com/fr/customer-success-stories.html?martech=off&milolibs=${branch}--milo--adobecom
-
-**CC:**
-- Before: https://main--cc--adobecom.hlx.live/?martech=off
-- After: https://main--cc--adobecom.hlx.live/?martech=off&milolibs=${branch}--milo--adobecom
-
-**Homepage:**
-- Before: https://main--homepage--adobecom.hlx.page/homepage/index-loggedout?martech=off
-- After: https://main--homepage--adobecom.hlx.page/homepage/index-loggedout?martech=off&milolibs=${branch}--milo--adobecom
-
-**Blog:**
-- Before: https://main--blog--adobecom.hlx.page/?martech=off
-- After: https://main--blog--adobecom.hlx.page/?martech=off&milolibs=${branch}--milo--adobecom
-
-**Milo:**
-- Before: https://main--milo--adobecom.aem.page/ch_de/drafts/ramuntea/gnav-refactor?martech=off
-- After: https://${branch}--milo--adobecom.aem.page/ch_de/drafts/ramuntea/gnav-refactor?martech=off`;
+const getPrDescription = ({ branch, scriptPath }) => {
+  switch(scriptPath) {
+    case './libs/deps/imslib.min.js':
+      return `## Description
+      Update ${scriptPath} to the latest version
+      
+      ## Related Issue
+      Resolves: NO TICKET - AUTOMATED CREATED PR.
+      
+      ## Testing instructions - IMS Libs
+      1. Signing in should still function
+      2. Signing out should still work
+      3. Regression tests on all consumers
+
+      ## Test URLs - IMS 
+      **Acrobat:**
+      - Before: https://www.stage.adobe.com/acrobat/online/sign-pdf.html?martech=off
+      - After: https://www.stage.adobe.com/acrobat/online/sign-pdf.html?martech=off&milolibs=${branch}--milo--adobecom
+
+      **BACOM:**
+      - Before: https://business.stage.adobe.com/fr/customer-success-stories.html?martech=off
+      - After: https://business.stage.adobe.com/fr/customer-success-stories.html?martech=off&milolibs=${branch}--milo--adobecom
+
+      **CC:**
+      - Before: https://main--cc--adobecom.hlx.live/?martech=off
+      - After: https://main--cc--adobecom.hlx.live/?martech=off&milolibs=${branch}--milo--adobecom
+
+      **Homepage:**
+      - Before: https://main--homepage--adobecom.hlx.page/homepage/index-loggedout?martech=off
+      - After: https://main--homepage--adobecom.hlx.page/homepage/index-loggedout?martech=off&milolibs=${branch}--milo--adobecom
+
+      **Blog:**
+      - Before: https://main--blog--adobecom.hlx.page/?martech=off
+      - After: https://main--blog--adobecom.hlx.page/?martech=off&milolibs=${branch}--milo--adobecom
+
+      **Milo:**
+      - Before: https://main--milo--adobecom.aem.page/ch_de/drafts/ramuntea/gnav-refactor?martech=off
+      - After: https://${branch}--milo--adobecom.aem.page/ch_de/drafts/ramuntea/gnav-refactor?martech=off`
+    case './libs/deps/forms2.min.js':
+      return   `## Description
+      Update ${scriptPath} to the latest version
+      
+      ## Related Issue
+      Resolves: NO TICKET - AUTOMATED CREATED PR.
+      
+      ## Testing instructions - Marketo Forms
+      1. The form should still load 
+      2. The form should still submit 
+      3. The form should redirect you a new page
+      
+      ## Test URLs - Marketo
+
+      **BACOM:**
+      - Before: https://business.stage.adobe.com?martech=off
+      - After: https://business.stage.adobe.com?martech=off&milolibs=${branch}--milo--adobecom
+
+      **Milo:**
+      - Before: https://main--milo--adobecom.hlx.live/drafts/bmarshal/marketo/full
+      - After: https://${branch}--milo--adobecom.hlx.live/drafts/bmarshal/marketo/full`
+  }
+}
 
 const fetchScript = (path) =>
   new Promise((resolve, reject) => {

diff --git a/libs/blocks/marketo/marketo.js b/libs/blocks/marketo/marketo.js
@@ -19,6 +19,7 @@ import {
   loadLink,
   localizeLink,
   createTag,
+  getConfig,
   createIntersectionObserver,
   SLD,
 } from '../../utils/utils.js';
@@ -173,8 +174,9 @@ export const loadMarketo = (el, formData) => {
   const baseURL = formData[BASE_URL];
   const munchkinID = formData[MUNCHKIN_ID];
   const formID = formData[FORM_ID];
+  const { base } = getConfig();
 
-  loadScript(`https://${baseURL}/js/forms2/js/forms2.min.js`)
+  loadScript(`${base}/deps/forms2.min.js`)
     .then(() => {
       const { MktoForms2 } = window;
       if (!MktoForms2) throw new Error('Marketo forms not loaded');

diff --git a/libs/deps/forms2.min.js b/libs/deps/forms2.min.js
diff --git a/test/blocks/marketo/marketo.test.html b/test/blocks/marketo/marketo.test.html
@@ -92,7 +92,7 @@ <h2 id="fill-out-the-form-to-view-the-report">Fill out the form to view the repo
 
         it('loads Marketo script', async () => {
           expect(loadScript.calledOnce).to.be.true;
-          expect(loadScript.calledWith('https://engage.adobe.com/js/forms2/js/forms2.min.js')).to.be.true;
+          expect(loadScript.calledWith('/deps/forms2.min.js')).to.be.true;
         });
 
         it('loads form', () => {

diff --git a/test/blocks/marketo/mocks/marketo-utils.js b/test/blocks/marketo/mocks/marketo-utils.js
@@ -72,3 +72,5 @@ export const customFetch = stub();
 
 const PAGE_URL = new URL(window.location.href);
 export const SLD = PAGE_URL.hostname.includes('.aem.') ? 'aem' : 'hlx';
+
+export const getConfig = () => ({ base: '' });
Original file line number	Diff line number	Diff line change
Expand Up		@@ -72,3 +72,5 @@ export const customFetch = stub();

		const PAGE_URL = new URL(window.location.href);
		export const SLD = PAGE_URL.hostname.includes('.aem.') ? 'aem' : 'hlx';

		export const getConfig = () => ({ base: '' });