From 0f272e7b976eb0c514a33bceea78a37e8a161606 Mon Sep 17 00:00:00 2001 From: "Julia Roldi (from Dev Box)" Date: Fri, 13 Dec 2024 19:08:49 -0300 Subject: [PATCH 1/2] image dataset extract --- .../lib/imageEdit/ImageEditPlugin.ts | 15 ++++++++++++ .../test/imageEdit/ImageEditPluginTest.ts | 23 +++++++++++++++++++ 2 files changed, 38 insertions(+) diff --git a/packages/roosterjs-content-model-plugins/lib/imageEdit/ImageEditPlugin.ts b/packages/roosterjs-content-model-plugins/lib/imageEdit/ImageEditPlugin.ts index ec6dfe6047f..2c14e9898dd 100644 --- a/packages/roosterjs-content-model-plugins/lib/imageEdit/ImageEditPlugin.ts +++ b/packages/roosterjs-content-model-plugins/lib/imageEdit/ImageEditPlugin.ts @@ -174,9 +174,24 @@ export class ImageEditPlugin implements ImageEditor, EditorPlugin { this.onDropHandler(this.editor); } break; + case 'extractContentWithDom': + this.removeImageEditing(event.clonedRoot); + break; } } + private removeImageEditing(clonedRoot: HTMLElement) { + const images = clonedRoot.querySelectorAll('img'); + images.forEach(image => { + if (image.dataset.isEditing) { + delete image.dataset.isEditing; + } + if (image.dataset.editingInfo) { + delete image.dataset.editingInfo; + } + }); + } + private isImageSelection(target: Node): target is HTMLElement { return ( isNodeOfType(target, 'ELEMENT_NODE') && diff --git a/packages/roosterjs-content-model-plugins/test/imageEdit/ImageEditPluginTest.ts b/packages/roosterjs-content-model-plugins/test/imageEdit/ImageEditPluginTest.ts index 9fa5393fe0d..2bcea8bec9c 100644 --- a/packages/roosterjs-content-model-plugins/test/imageEdit/ImageEditPluginTest.ts +++ b/packages/roosterjs-content-model-plugins/test/imageEdit/ImageEditPluginTest.ts @@ -3,6 +3,7 @@ import * as findImage from '../../lib/imageEdit/utils/findEditingImage'; import * as getSelectedImage from '../../lib/imageEdit/utils/getSelectedImage'; import * as normalizeImageSelection from '../../lib/imageEdit/utils/normalizeImageSelection'; import { ChangeSource, createImage, createParagraph } from 'roosterjs-content-model-dom'; +import { ExtractContentWithDomEvent } from 'roosterjs-editor-types'; import { getSelectedImageMetadata } from '../../lib/imageEdit/utils/updateImageEditInfo'; import { ImageEditPlugin } from '../../lib/imageEdit/ImageEditPlugin'; import { initEditor } from '../TestHelper'; @@ -648,6 +649,28 @@ describe('ImageEditPlugin', () => { expect(editor.setEditorStyle).toHaveBeenCalledWith('imageEdit', null); expect(editor.setEditorStyle).toHaveBeenCalledWith('imageEditCaretColor', null); }); + + it('extractContentWithDom', () => { + const plugin = new ImageEditPlugin(); + plugin.initialize(editor); + const clonedRoot = document.createElement('div'); + const image = document.createElement('img'); + clonedRoot.appendChild(image); + image.dataset['editingInfo'] = JSON.stringify({ + src: 'test', + }); + image.dataset['isEditing'] = 'true'; + const event = { + eventType: 'extractContentWithDom', + clonedRoot, + } as any; + plugin.onPluginEvent(event); + const expectedClonedRoot = document.createElement('div'); + const expectedImage = document.createElement('img'); + expectedClonedRoot.appendChild(expectedImage); + expect(event.clonedRoot).toEqual(expectedClonedRoot); + plugin.dispose(); + }); }); class TestPlugin extends ImageEditPlugin { From d78bba2895598ba0666e1ec41c178902c7bf7cb2 Mon Sep 17 00:00:00 2001 From: "Julia Roldi (from Dev Box)" Date: Fri, 13 Dec 2024 19:15:07 -0300 Subject: [PATCH 2/2] refactor --- .../test/imageEdit/ImageEditPluginTest.ts | 1 - 1 file changed, 1 deletion(-) diff --git a/packages/roosterjs-content-model-plugins/test/imageEdit/ImageEditPluginTest.ts b/packages/roosterjs-content-model-plugins/test/imageEdit/ImageEditPluginTest.ts index 2bcea8bec9c..1bc97e1075c 100644 --- a/packages/roosterjs-content-model-plugins/test/imageEdit/ImageEditPluginTest.ts +++ b/packages/roosterjs-content-model-plugins/test/imageEdit/ImageEditPluginTest.ts @@ -3,7 +3,6 @@ import * as findImage from '../../lib/imageEdit/utils/findEditingImage'; import * as getSelectedImage from '../../lib/imageEdit/utils/getSelectedImage'; import * as normalizeImageSelection from '../../lib/imageEdit/utils/normalizeImageSelection'; import { ChangeSource, createImage, createParagraph } from 'roosterjs-content-model-dom'; -import { ExtractContentWithDomEvent } from 'roosterjs-editor-types'; import { getSelectedImageMetadata } from '../../lib/imageEdit/utils/updateImageEditInfo'; import { ImageEditPlugin } from '../../lib/imageEdit/ImageEditPlugin'; import { initEditor } from '../TestHelper';