fix: Remove need for timeout to close modal (#8183)

fsbraun · web-flow · commit c37fa0b7eefd · 2025-03-26T14:01:43.000+05:30
* Remove need for timeout to close modal

* remove unneded template tags

* Fix js linting

* Add try catch
diff --git a/cms/static/cms/js/admin.base.js b/cms/static/cms/js/admin.base.js
@@ -18,20 +18,3 @@ const CMS = {
 // in case some data is already attached to the global CMS
 // we must not override it
 window.CMS = CMS.$.extend(window.CMS || {}, CMS);
-
-// Serve the data bridge:
-// We have a special case here cause the CMS namespace
-// can be either inside the current window or the parent
-if (document.querySelector('body.cms-close-frame script#data-bridge')) {
-    (function (Window) {
-        // the dataBridge is used to access plugin information from different resources
-        // Do NOT move this!!!
-        Window.CMS.API.Helpers.dataBridge = JSON.parse(document.getElementById('data-bridge').textContent);
-        // make sure we're doing after the "modal" mechanism kicked in
-        setTimeout(function () {
-            // save current plugin
-            Window.CMS.API.Helpers.onPluginSave();
-        }, 100); // eslint-disable-line no-magic-numbers
-    })(window.parent || window);
-}
-
diff --git a/cms/static/cms/js/modules/cms.modal.js b/cms/static/cms/js/modules/cms.modal.js
@@ -1006,12 +1006,25 @@ class Modal {
                         true
                     );
                 } else {
-                    setTimeout(function() {
+                    // Serve the data bridge:
+                    // We have a special case here cause the CMS namespace
+                    // can be either inside the current window or the parent
+                    const dataBridge = body[0].querySelector('script#data-bridge');
+
+                    if (dataBridge) {
                         // hello ckeditor
                         Helpers.removeEventListener('modal-close.text-plugin');
                         that.close();
-                    // must be more than 100ms
-                    }, 150); // eslint-disable-line
+                        // the dataBridge is used to access plugin information from different resources
+                        // Do NOT move this!!!
+                        try {
+                            CMS.API.Helpers.dataBridge = JSON.parse(dataBridge.textContent);
+                            CMS.API.Helpers.onPluginSave();
+                        } catch (e) {
+                            // istanbul ignore next
+                            Helpers.reloadBrowser();
+                        }
+                    }
                 }
             } else {
                 if (that.ui.modal.hasClass('cms-modal-open')) {
diff --git a/cms/templates/admin/cms/page/close_frame.html b/cms/templates/admin/cms/page/close_frame.html
@@ -1,14 +1,11 @@
-{% load i18n l10n static cms_static %}{% spaceless %}
+{% spaceless %}
 <!DOCTYPE html><html>
     <body class="cms-close-frame">
         {# trick for cms to understand that the plugin was actually correctly saved #}
         <div class="messagelist">
             <div class="success"></div>
         </div>
-        {% if data_bridge %}
-            {{ data_bridge|json_script:"data-bridge" }}
-            <script src="{% static_with_version "cms/js/dist/bundle.admin.base.min.js" %}" type="text/javascript"></script>
-        {% endif %}
+        {% if data_bridge %}{{ data_bridge|json_script:"data-bridge" }}{% endif %}
     </body>
 </html>
 {% endspaceless %}
