fix: image ribbon gallery gets unresponsive after successful completion as tag markers are updated

Author: devvaannsh

src/LiveDevelopment/BrowserScripts/RemoteFunctions.js

@@ -3668,6 +3668,7 @@ function RemoteFunctions(config = {}) {
         "finishEditing"         : finishEditing,
         "hasVisibleLivePreviewBoxes" : hasVisibleLivePreviewBoxes,
         "dismissUIAndCleanupState" : dismissUIAndCleanupState,
+        "dismissImageRibbonGallery" : dismissImageRibbonGallery,
         "registerHandlers" : registerHandlers
     };
 }

src/LiveDevelopment/LivePreviewEdit.js

@@ -706,6 +706,13 @@ define(function (require, exports, module) {
                                     // if editor is not available we directly write the image file name as the src value
                                     _updateImageSrcAttribute(tagId, uniqueFilename);
                                 }
+
+                                // after successful update we dismiss the image ribbon gallery
+                                // to ensure that the user doesn't work with image ribbon gallery on a stale DOM
+                                const currLiveDoc = LiveDevMultiBrowser.getCurrentLiveDoc();
+                                if (currLiveDoc && currLiveDoc.protocol && currLiveDoc.protocol.evaluate) {
+                                    currLiveDoc.protocol.evaluate("_LD.dismissImageRibbonGallery()");
+                                }
                             }
                         });
                 })