Commands and Events for the PowerPaste plugin

Commands

The PowerPaste plugin provides the following TinyMCE commands.

Command Description

mceInsertClipboardContent

Triggers a paste event at the cursor location or over the current selection. HTML content will be automatically detected as Word, Google Docs, or standard HTML content and use the relevant paste path. The command requires an object with: html containing the HTML content, or text containing plain text.

mceTogglePlainTextPaste

Toggles paste as plain text.
Example
tinymce.activeEditor.execCommand('mceInsertClipboardContent', false, {
  html: '<p>Hello, World!</p>'
});
tinymce.activeEditor.execCommand('mceTogglePlainTextPaste');

Event Listeners

Custom paste filtering can also be configured at runtime using event listeners.

  • PastePreProcess is equivalent to paste_preprocess

  • PastePostProcess is equivalent to paste_postprocess

The event listeners are passed the same data objects as their equivalent configuration options. The event listener callbacks can be configured or changed at any time as long as you have a reference to the Editor API.

Example TinyMCE configuration:

const yourCustomFilter = function(content) {
  // Implement your custom filtering and return the filtered content
  return content;
};

tinymce.init({
  selector: 'textarea',
  plugins: 'powerpaste',
  setup: function(editor) {
    editor.on('PastePreProcess', function(data) {
      console.log(data.content, data.mode, data.source);
      // Apply custom filtering by mutating data.content
      const content = data.content;
      const newContent = yourCustomFilter(content);
      data.content = newContent;
    });

    editor.on('PastePostProcess', function(data) {
      console.log(data.node, data.mode, data.source);
      // Apply custom filtering by mutating data.node
      // For example:
      const additionalNode = document.createElement('div');
      additionalNode.innerHTML = '<p>This will go before the pasted content.</p>';
      data.node.insertBefore(additionalNode, data.node.firstElementChild);
    });
  }
});