registerInsertTextListener?

[diegohaz]

Hi!

I'd like to register a listener only when text has been inserted. That would be equivalent to checking if event.inputType === "insertText" on input events. Maybe something like editor.registerInsertTextListener() or a way to check the reason for the update.

I tried using editor.registerTextContentListener(), but it gets called on any text content change, and not only on text insertion. I also tried editor.registerCommand() with INSERT_TEXT_COMMAND. But if I don't handle the text insertion myself, this will only be called at the beginning of each line, and the editor state will not contain the inserted text. So I'm assuming I should use this command only if I want to take care of the text insertion, and not react to it.

The best I could come up with so far is a combination of editor.registerTextContentListener() and an input event listener that I added to the DOM element. Then I set a flag based on event.inputType that I check inside the text content listener, but this feels really hacky.

Is there a better way to do this?

Edit: another way I found is using registerUpdateListener and comparing the content size:

const contentSize = editorState.read(() => $getRoot().getTextContentSize());
const prevContentSize = prevEditorState.read(() => $getRoot().getTextContentSize());
contentSize <= prevContentSize;

[trueadm]

The way you describe above is correct – comparing the text before and after. The reason why event.inputType is unreliable is because it's not always fired for all text inputs. For example, it's not guaranteed to fire for composition, and in most cases we actually let the browser do the default thing and read the DOM to ensure cross-browser consistency (especially on Android). Another thing to note, is that the text might not have been inserted the same way – if a transform changes the input or blocks it.

So the most consistent way is to use editor.registerTextContentListener() and store the previous value, so you can easily compare. registerTextContentListener will only fire if the text content actually changes internally.

[diegohaz]

Thanks a lot!