From 4b8bfe2307790d2de689a3d2d88ac48695dbf91d Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Chris=20Ch=C3=A1vez?= <xnpiochv@gmail.com>
Date: Tue, 20 May 2025 20:28:19 -0500
Subject: [PATCH] fix: TinyMCE editor in advanced block editors [FC-0076] 
 (#36754)

* fix: TinyMCE editors in advanced block editors
* Sets baseUrl to avoid an error in: https://github.com/openedx/XBlock/blob/86eee4b05dffa42b009fab2a9050b73766131b9d/xblock/utils/public/studio_edit.js#L52
* Uncouple the listener func of the cancel button (see the comment)
* chore: Add `edx_sga` in `LIBRARY_ENABLED_BLOCKS`
---
 cms/envs/common.py                            |  1 +
 common/templates/xblock_v2/xblock_iframe.html | 26 ++++++++++++++++---
 2 files changed, 24 insertions(+), 3 deletions(-)

diff --git a/cms/envs/common.py b/cms/envs/common.py
index fbe3e67887..b30e245e27 100644
--- a/cms/envs/common.py
+++ b/cms/envs/common.py
@@ -2882,6 +2882,7 @@ LIBRARY_ENABLED_BLOCKS = [
     'openassessment',
     'conditional',
     'done',
+    'edx_sga',
     'freetextresponse',
     'google-calendar',
     'google-document',
diff --git a/common/templates/xblock_v2/xblock_iframe.html b/common/templates/xblock_v2/xblock_iframe.html
index 10fedc3b95..ab635a4af1 100644
--- a/common/templates/xblock_v2/xblock_iframe.html
+++ b/common/templates/xblock_v2/xblock_iframe.html
@@ -40,6 +40,7 @@
     // The minimal RequireJS configuration required for common LMS and CMS building XBlock types to work:
     require = require || RequireJS.require;
     define = define || RequireJS.define;
+    baseUrl = "";
     (function (require, define) {
         if ('{{ view_name | safe }}' === 'studio_view') {
             // Call `require-config.js` of the CMS
@@ -47,9 +48,10 @@
             script.type = 'text/javascript';
             script.src = "{{ cms_root_url }}/static/studio/cms/js/require-config.js";
             document.head.appendChild(script);
+            baseUrl = "{{ cms_root_url }}/static/studio";
 
             require.config({
-                baseUrl: "{{ cms_root_url }}/static/studio",
+                baseUrl,
                 paths: {
                         accessibility: 'js/src/accessibility_tools',
                         draggabilly: 'js/vendor/draggabilly',
@@ -64,8 +66,9 @@
                 "{{ lms_root_url }}/static/dist{{ oa_manifest.oa_editor_textarea_js }}",
             ]);
         } else {
+            baseUrl = "{{ lms_root_url }}/static/";
             require.config({
-                baseUrl: "{{ lms_root_url }}/static/",
+                baseUrl,
                 paths: {
                     accessibility: 'js/src/accessibility_tools',
                     draggabilly: 'js/vendor/draggabilly',
@@ -375,7 +378,6 @@
             if ('{{ view_name | safe }}' === 'studio_view') {
               // Used when rendering the `studio_view`, in order to avoid open a new tab on click cancel or save
               const selectors = [
-                  '.cancel-button',
                   '.save-button',
                   '.action-cancel',
                   '.action-save',
@@ -391,6 +393,24 @@
                       });
                   }
               }
+
+              // This button is used in `StudioEditableXBlockMixin` from the `Xblock` app
+              // That app adds a listener that removes any TinyMCE editors on click cancel.
+              // ref: https://github.com/openedx/XBlock/blob/86eee4b05dffa42b009fab2a9050b73766131b9d/xblock/utils/public/studio_edit.js#L169
+              //
+              // Here that is an issue because we show a confirmation modal when clicking cancel,
+              // if the user stays to edit all TinyMCE editors are no longer there.
+              // 
+              // We uncouple the listener to avoid remove the TinyMCE editors
+              const extraCancelSelector = '.cancel-button';
+              const elements = $(extraCancelSelector).first();
+              if (elements.length) {
+                elements.first().unbind("click");
+                elements.on('click', function() {                    
+                    event.preventDefault();
+                    runtime.notify('cancel', {});
+                });
+              }
             }
         }