Restrict changes done for MWPW-136057 to commerce modal (#1285)

* fix for MWPW-136656 * Update modal.js * fix lint issue * update css class name * Update css class name
adobecom · Sep 19, 2023 · ee47db4 · ee47db4
1 parent 7ab136d
commit ee47db4
Show file tree

Hide file tree

Showing 2 changed files with 3 additions and 3 deletions.
diff --git a/libs/blocks/modal/modal.css b/libs/blocks/modal/modal.css
@@ -150,7 +150,7 @@
   column-count: 1;
 }
 
-.modal-open {
+.commerce-modal-open {
   overflow: hidden;
 }
 

diff --git a/libs/blocks/modal/modal.js b/libs/blocks/modal/modal.js
@@ -34,7 +34,7 @@ export function sendAnalytics(event) {
 function closeModal(modal) {
   const { id } = modal;
   const closeEvent = new Event('milo:modal:closed');
-  document.body.classList.remove('modal-open');
+  document.body.classList.remove('commerce-modal-open');
   window.dispatchEvent(closeEvent);
   const localeModal = id?.includes('locale-modal') ? 'localeModal' : 'milo';
   const analyticsEventName = window.location.hash ? window.location.hash.replace('#', '') : localeModal;
@@ -108,7 +108,6 @@ export async function sendViewportDimensionsOnRequest(messageInfo) {
 
 export async function getModal(details, custom) {
   if (!(details?.path || custom)) return null;
-  document.body.classList.add('modal-open');
   const { id } = details || custom;
 
   const dialog = createTag('div', { class: 'dialog-modal', id });
@@ -175,6 +174,7 @@ export async function getModal(details, custom) {
       .forEach((element) => element.setAttribute('aria-disabled', 'true'));
   }
   if (dialog.classList.contains('commerce-frame')) {
+    document.body.classList.add('commerce-modal-open');
     if (isInitialPageLoad) {
       window.addEventListener('message', (messageInfo) => {
         sendViewportDimensionsOnRequest(messageInfo);