I'm working on a customization for the Slate editor where a white space is automatically added to the end of a node named "rr-attribute". While the space gets added successfully, an issue arises after the insertion: pressing backspace doesn't remove the space as expected. Instead, I need to manually move the cursor using the left arrow key before the backspace works. I'm unsure of the underlying cause.
function adjustSpacingRealTime(value: Descendant[], editor: Editor) {
if (!Array.isArray(value) || value.length === 0) return;
const firstDescendant: Descendant = value[0];
if (!Element.isElement(firstDescendant)) return;
let previousNode: Descendant | null = null;
firstDescendant.children.forEach((node: Descendant, index: number) => {
const isPreviousAttribute =
previousNode && Element.isElement(previousNode) && previousNode.type === 'rr-attribute';
const isText = Text.isText(node);
if (isPreviousAttribute && isText && !node.text.startsWith(' ')) {
Transforms.insertText(editor, ' ', { at: [0, index] });
}
previousNode = node;
});
}
I attempted to capture the initial selection and then, after adding the white space, I used Transforms.select. However, it didn't yield the desired result.