transformFragment not triggered when pasting stuff via Android/iOS keyboard

[abhi-bc]

I wrote a custom plugin to transformFragment whenever user pastes something into the editor. Basically, I look for @username in the pasted fragment and convert it to the MENTION node. It works fine on desktop, but does not work when user pastes via Android / iOS keyboard.

Infact, createInsertDataPlugin is not invoked at all. My plugin is kinda like this

 createPluginFactory({
        key: KEY_PASTE_MENTIONS_PLUGIN,
        then: (_editor) => ({
            inject: {
                pluginsByKey: {
                    [KEY_DESERIALIZE_HTML]: {
                        editor: {
                                transformFragment: (fragment, { data }) => {
                                    // my custom func transformMentions does the conversion
                                    return transformMentions(fragment)
                                },
                            },
                        },
                    },
                },
            },
        }),
    })

I researched a bit and turns out soft keyboard on mobiles do not trigger paste event for text? Is there a better way to do this or any workaround?

[12joan]

I've never heard of mobile keyboards not sending paste events. I tested pasting HTML into a vanilla contenteditable using the paste button in the iOS balloon toolbar, and I was able to receive a paste event containing the correct text/plain and text/html data.

https://codepen.io/12joan/pen/mdYxbEv

[12joan]

Slate has some complex logic for handling paste events that may be getting in the way of this in some circumstances.

https://github.com/ianstormtaylor/slate/blob/f3be9f12925e85a38f27168419dd78d55784ba51/packages/slate-react/src/components/editable.tsx#L1719-L1745

In any case, you may have more luck overriding insertText in addition to insertFragment. Between those two methods, I think this should cover the majority of cases where the user is inserting content all at once.