Hi everyone!
We’ve run into an issue using Decoration.inline
on Android in combination with GBoard.
The problem occurs when we try to highlight the user’s text selection by applying Decoration.inline
to the selected range. This works perfectly on iOS and desktop browsers. However, on Android, as soon as you start selecting text, the selection handles disappear or get reset while dragging.
We suspect this happens because updating the DOM during an active selection (with Decoration.inline
) causes the browser to lose track of the selection state.
Has anyone else encountered this behavior and found a workaround or a stable solution for Android?
We’d be really grateful for any shared experience or advice — thanks!
Here’s the code where we apply Decoration.inline
, as well as a visual demonstration of the issue:
decorations(state: EditorState): DecorationSet | null {
if (state.selection.empty || 'node' in state.selection) return null;
return DecorationSet.create(state.doc, [
Decoration.inline(state.selection.from, state.selection.to, {
class: constants.class,
nodeName: 'span',
}),
]);
}