ExtractContentEvent

Go back to Plugin events

ExtractContentEvent is triggered when Editor.getContent() method is called and passed true for triggerExtractContentEvent parameter (default value).

interface ExtractContentEvent extends PluginEvent {
    content: string;
}

This event provides a chance for plugins to do some modification to the content retrieved from editor, especially if there is any temporary content added by a plugin, it is the best place to remove it.

To modify the content, just simply modify the content property and set it back to ExtractContentEvent. For example, Watermark plugin uses this event to remove watermark element in editor:

const WATERMARK_SPAN_ID = '_rooster_watermarkSpan';
const WATERMARK_REGEX = new RegExp(
    `<span[^>]*id=['"]?${WATERMARK_SPAN_ID}['"]?[^>]*>[^<]*</span>`,
    'ig'
);

private removeWartermarkFromHtml(event: ExtractContentEvent) {
    let content = event.content;
    content = content.replace(WATERMARK_REGEX, '');
    event.content = content;
}

For now we just provide a content string to modify. In the future this may be replaced with a DOM tree.

More info

Package: roosterjs-editor-types

Support from: 6.0.0

Source code: ExtractContentEvent.ts