Cannot find a descendant at path when emptying deeply nested editor value
See original GitHub issueI’m integrating the code examples into our app and I’m hitting an issue that might be a bug, or me not understanding how to correctly reset the editor state.
Here’s a quick summary of the React structure of our Composer component:
const EMPTY = [{ children: [{ text: '' }] }];
const [value, setValue] = useState<Node[]>(EMPTY);
<Slate
editor={editor}
value={value}
onChange={(newValue) => setValue(newValue)}
>
<Editable
onKeyDown={(event) => {
if (event.key === 'Enter') {
event.preventDefault();
sendMessage(value);
// clear the input
Transforms.select(editor, Editor.start(editor, [])); // move the cursor to the beginning of the input before we clear it
setValue(EMPTY);
}
}}
/>
</Slate>
This works fine when the value in the editor is simple, but when the editor has a value that is deeply nested, like a list with one list item:
[
{
"type": "ul",
"children": [
{
"type": "li",
"children": [
{
"text": "list item"
}
]
}
]
}
]
… I get this error in the console after clearing the editor:
Uncaught Error: Cannot find a descendant at path [0,0,0] in node: {“children”:[{“children”:[{“text”:“”}]}],“operations”:[{“type”:“set_selection”,“properties”:{“anchor”:{“path”:[0,0,0],“offset”:4},“focus”:{“path”:[0,0,0],“offset”:4}},“newProperties”:{“anchor”:{“path”:[0,0,0],“offset”:0},“focus”:{“path”:[0,0,0],“offset”:0}}}],“selection”:{“anchor”:{“path”:[0,0,0],“offset”:0},“focus”:{“path”:[0,0,0],“offset”:0}},“marks”:null}
It seems that, even though the selection range was set to empty, it still holds on to the depth information, the fact that the focus was on a node that was 3 levels deep in the value, so I’m guessing either I have to reset the entire path somehow, or this is a bug.
I managed to fix this by changing the clear transform to:
Transforms.select(editor, {
anchor: { path: [0, 0], offset: 0 },
focus: { path: [0, 0], offset: 0 },
})
I’m curious if there’s another, more straightforward way to use the Editor API to get the same result.
Issue Analytics
- State:
- Created 3 years ago
- Reactions:21
- Comments:6 (2 by maintainers)
Top GitHub Comments
I see this issue is still open. Any update about this issue? Do we have a better way to solve this?
We love Slate at Zapier, but run into this issue as well, when a user undo’s pasting a value that results in nodes with an empty leaf text node. This is how we can reproduce:
children
being:Undo e.g. via Cmd+Z on Mac.
You’ll get:
This happens after the 2nd of these
inverseOps
: