From c5f7d0cf3bcddb3bdefdbd9f14cf18eccac08e2e Mon Sep 17 00:00:00 2001
From: Jillian <jill@opencraft.com>
Date: Sat, 24 May 2025 04:21:39 +0930
Subject: [PATCH] fix: set maxHeight on TextEditor TinyMce widget [FC-0090]
 (#2024)
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Sets a max_height=500px for the TinyMCE editor when editing a Text/Html component.
This prevents the autoresize plugin from expanding the editor textarea beyond the bounds of the editor modal.

⚠️ Because the max height can only be a numeric pixel value, we can't use clever settings like vh or %, and so we're forced to limit the height of the editor to a fixed size for all screen sizes in order to address this issue.
---
 .../containers/TextEditor/__snapshots__/index.test.jsx.snap | 6 +++---
 src/editors/containers/TextEditor/index.jsx                 | 2 +-
 src/editors/sharedComponents/TinyMceWidget/hooks.js         | 2 ++
 3 files changed, 6 insertions(+), 4 deletions(-)

diff --git a/src/editors/containers/TextEditor/__snapshots__/index.test.jsx.snap b/src/editors/containers/TextEditor/__snapshots__/index.test.jsx.snap
index d6c6e8161..1f8c21c76 100644
--- a/src/editors/containers/TextEditor/__snapshots__/index.test.jsx.snap
+++ b/src/editors/containers/TextEditor/__snapshots__/index.test.jsx.snap
@@ -50,13 +50,13 @@ exports[`TextEditor snapshots block failed to load, Toast is shown 1`] = `
       }
       editorType="text"
       enableImageUpload={true}
-      height="100%"
       id={null}
       images={{}}
       initializeEditor={[MockFunction args.intializeEditor]}
       isLibrary={null}
       learningContextId="course+org+run"
       lmsEndpointUrl=""
+      maxHeight={500}
       minHeight={500}
       onChange={[Function]}
       setEditorRef={[MockFunction hooks.prepareEditorRef.setEditorRef]}
@@ -226,13 +226,13 @@ exports[`TextEditor snapshots renders as expected with default behavior 1`] = `
       }
       editorType="text"
       enableImageUpload={true}
-      height="100%"
       id={null}
       images={{}}
       initializeEditor={[MockFunction args.intializeEditor]}
       isLibrary={null}
       learningContextId="course+org+run"
       lmsEndpointUrl=""
+      maxHeight={500}
       minHeight={500}
       onChange={[Function]}
       setEditorRef={[MockFunction hooks.prepareEditorRef.setEditorRef]}
@@ -292,13 +292,13 @@ exports[`TextEditor snapshots renders static images with relative paths 1`] = `
       }
       editorType="text"
       enableImageUpload={true}
-      height="100%"
       id={null}
       images={{}}
       initializeEditor={[MockFunction args.intializeEditor]}
       isLibrary={null}
       learningContextId="course+org+run"
       lmsEndpointUrl=""
+      maxHeight={500}
       minHeight={500}
       onChange={[Function]}
       setEditorRef={[MockFunction hooks.prepareEditorRef.setEditorRef]}
diff --git a/src/editors/containers/TextEditor/index.jsx b/src/editors/containers/TextEditor/index.jsx
index 10bab16db..799740a35 100644
--- a/src/editors/containers/TextEditor/index.jsx
+++ b/src/editors/containers/TextEditor/index.jsx
@@ -65,7 +65,7 @@ const TextEditor = ({
         editorContentHtml={editorContent}
         setEditorRef={setEditorRef}
         minHeight={500}
-        height="100%"
+        maxHeight={500}
         initializeEditor={initializeEditor}
         {...{
           images,
diff --git a/src/editors/sharedComponents/TinyMceWidget/hooks.js b/src/editors/sharedComponents/TinyMceWidget/hooks.js
index 5afbba011..3730e809b 100644
--- a/src/editors/sharedComponents/TinyMceWidget/hooks.js
+++ b/src/editors/sharedComponents/TinyMceWidget/hooks.js
@@ -304,6 +304,7 @@ export const editorConfig = ({
   updateContent,
   content,
   minHeight,
+  maxHeight,
   learningContextId,
   staticRootUrl,
   enableImageUpload,
@@ -335,6 +336,7 @@ export const editorConfig = ({
       content_css: false,
       content_style: tinyMCEStyles + a11ycheckerCss,
       min_height: minHeight,
+      max_height: maxHeight,
       contextmenu: 'link table',
       directionality: isLocaleRtl ? 'rtl' : 'ltr',
       document_base_url: baseURL,