Merge pull request #2122 from microsoft/u/juliaroldi/remove-max-height

Remove height max-height when editing
microsoft · Oct 4, 2023 · 05fe924 · 05fe924
2 parents 4237327 + a09015e
commit 05fe924
Show file tree

Hide file tree

Showing 3 changed files with 16 additions and 0 deletions.
diff --git a/packages/roosterjs-editor-plugins/lib/plugins/ImageEdit/ImageEdit.ts b/packages/roosterjs-editor-plugins/lib/plugins/ImageEdit/ImageEdit.ts
@@ -427,6 +427,7 @@ export default class ImageEdit implements EditorPlugin {
             this.clonedImage = this.image.cloneNode(true) as HTMLImageElement;
             this.clonedImage.removeAttribute('id');
             this.clonedImage.style.removeProperty('max-width');
+            this.clonedImage.style.removeProperty('max-height');
             this.clonedImage.style.width = this.editInfo.widthPx + 'px';
             this.clonedImage.style.height = this.editInfo.heightPx + 'px';
             this.wrapper = createElement(

diff --git a/packages/roosterjs-editor-plugins/lib/plugins/ImageEdit/editInfoUtils/applyChange.ts b/packages/roosterjs-editor-plugins/lib/plugins/ImageEdit/editInfoUtils/applyChange.ts
@@ -80,5 +80,6 @@ export default function applyChange(
         image.style.removeProperty('width');
         image.style.removeProperty('height');
         image.style.removeProperty('max-width');
+        image.style.removeProperty('max-height');
     }
 }
diff --git a/packages/roosterjs-editor-plugins/test/imageEdit/imageEditTest.ts b/packages/roosterjs-editor-plugins/test/imageEdit/imageEditTest.ts
@@ -362,6 +362,20 @@ describe('ImageEdit | wrapper', () => {
         expect(imageShadow?.style.maxWidth).toBe('');
     });
 
+    it('image selection, remove max-height', () => {
+        const IMG_ID = 'IMAGE_ID_SELECTION';
+        const content = `<img id="${IMG_ID}" src='test'/>`;
+        editor.setContent(content);
+        const image = document.getElementById(IMG_ID) as HTMLImageElement;
+        image.style.maxHeight = '100%';
+        editor.focus();
+        editor.select(image);
+        const imageParent = image.parentElement;
+        const shadowRoot = imageParent?.shadowRoot;
+        const imageShadow = shadowRoot?.querySelector('img');
+        expect(imageShadow?.style.maxHeight).toBe('');
+    });
+
     it('image selection, cloned image should use style width/height attributes', () => {
         const IMG_ID = 'IMAGE_ID_SELECTION_2';
         const content = `<img id="${IMG_ID}" style="width: 300px; height: 300px" src='test'/>`;