Bug: Pasting certain text breaks the editor

[tom-sze]

I tried copying a character from a google search result (as seen in the video), and pasting it into lexical. This creates additional nodes that cannot be removed (in my example, I can't delete the newline, link, or paragraph nodes).

Screen.Recording.2024-09-03.at.12.14.39.AM.mp4

I'm not sure how deep this issue goes, so if someone could guide me in how I could remove paste/drag-drop formatting altogether, that would be very much appreciated.

Also, this is the HTML of the text I copied:
<meta charset='utf-8'><a jsname="UWckNb" href="https://symbl.cc/en/00B2/" data-ved="2ahUKEwjon6Wh2aWIAxV0lokEHbkOEZoQFnoECBsQAQ" style="color: var(--JKqx2); text-decoration: none; -webkit-tap-highlight-color: rgba(0, 0, 0, 0.1); outline: 0px; font-family: Arial, sans-serif; font-size: small; font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; font-weight: 400; letter-spacing: normal; orphans: 2; text-align: left; text-indent: 0px; text-transform: none; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; white-space: normal; background-color: rgb(255, 255, 255);"><h3 class="LC20lb MBeuO DKV0Md" style="font-weight: 400; margin: 18px 0px 3px; padding: 5px 0px 0px; font-size: 22px; line-height: 1.3; font-family: Arial, sans-serif; display: inline-block;">²</h3></a>

[etrepum]

I suspect that the bug has to do with having a heading element inside of a link. To remove formatting you would have to register a PASTE_COMMAND handler at a higher priority than the editor's and modify the event or handle it directly. The way copy and paste work isn't really extensible in an easier way than that.

[tom-sze]

Hi etrepum. Thanks for the tip! Would registering PASTE_COMMAND also override drag-drop?

[etrepum]

No, that would be CONTROLLED_TEXT_INSERTION_COMMAND

[tom-sze]

No, that would be CONTROLLED_TEXT_INSERTION_COMMAND

thanks :)

[tom-sze]

This is the plugin I came up with:

`
function StripFormattingPlugin() {

const handlePaste = (e) => {
	const selection = $getSelection();
	if (e instanceof InputEvent || e instanceof ClipboardEvent) {
		let text = '';
		if (e instanceof InputEvent) {
			text = e.dataTransfer?.getData('text/plain');
		} else {
			text = e.clipboardData?.getData('text/plain');
		}
		e.preventDefault();
		if (selection) {
			selection.insertText(text);
		}
		return true;
	}
	return false;
};

const [editor] = useLexicalComposerContext();

useEffect(() => {
	return mergeRegister(
		editor.registerCommand(PASTE_COMMAND, handlePaste, COMMAND_PRIORITY_CRITICAL),
		editor.registerCommand(CONTROLLED_TEXT_INSERTION_COMMAND, handlePaste, COMMAND_PRIORITY_CRITICAL)
	)
}, [editor]);

}
`