Setting editor content from text & running paste rules

1

I have several paste rules for my editor, some are my own and others are made using others’ plugins (like prosemirror-paste-rules).

I want to programmatically set the editor content from text (a string) and have it run through all the paste rules. Can I do this by simulating a paste without actually dispatching a paste event in the DOM? Or is there a better way?

Thanks, Dan

2

You could run the paste handlers with view.someProp, but since these hooks also take a DOM event, and you cannot create an event with a working dataTransfer property, that might confuse some of the paste handlers (which I assume are what you mean by paste rules). You’ll have the same issue with a scripted DOM event though.

3

Could I just use parseFromClipboard() directly and otherwise copy the logic of doPaste()?

I learned the hard way that handlePaste() doesn’t really chain very well with other methods like clipboardTextParser() and transformPasted() so I’ve avoided using it at all. It seems like since that’s the only method in doPaste() requiring the ClipboardEvent, maybe I can make a modified version of doPaste() that replaces the entire doc with the result of parseFromClipboard()?

4

The pasteHTML method may be what you’re looking for?

5

Ohh interesting, that does sound promising. In my case perhaps pasteText().

6

This is ultimately the approach I took:

/**
 * @param {EditorView} view
 * @param {string|undefined} text
 * */
const setDocText = (view, text = '') => {

	const {state} = view,
	{ doc } = state;

	let slice = text && parseFromClipboard(view, text, null, true, doc.resolve(0));

	const tr = state.tr.replace(0, doc.content.size, slice || Slice.empty);

	view.dispatch( tr );

};