tiptap
tiptap copied to clipboard
Cursor does not follow new line / paragraph when configured with a node view
What’s the bug you are facing?
Following the documentation, I've tried to extend the paragraph extension with a custom node-view. When pressing the Enter
key a new node is created, however the cursor remains in the initial paragraph.
Which browser was this experienced in? Are any special extensions installed?
Desktop / Linux / MacOS / Chrome & Firefox (no extensions)
How can we reproduce the bug on our side?
Minimal Example Code
import * as React from 'react';
import {
EditorContent,
useEditor,
NodeViewWrapper,
NodeViewContent,
ReactNodeViewRenderer,
} from '@tiptap/react';
import { Document } from '@tiptap/extension-document';
import { Text } from '@tiptap/extension-text';
import { Paragraph } from '@tiptap/extension-paragraph';
const NodeView = () => {
return (
<NodeViewWrapper>
<div>
<NodeViewContent />
</div>
</NodeViewWrapper>
);
};
const CustomParagraph = Paragraph.extend({
addNodeView() {
return ReactNodeViewRenderer(NodeView);
},
});
export default function App() {
const editor = useEditor({
extensions: [Document, CustomParagraph, Text],
content: '...',
});
return (
<div>
<EditorContent editor={editor} />
</div>
);
}
- Start typing
- Press
Enter
- Keep typing
Can you provide a CodeSandbox?
https://stackblitz.com/edit/react-ts-gth2ze?file=App.tsx
What did you expect to happen?
I expected the cursor to always jump to the new paragraph.
Anything to add? (optional)
I would also note that sometimes the cursor will jump into the new node if there is a trailing space before pressing Enter
.
https://user-images.githubusercontent.com/2750352/190435761-3c79273f-4916-4967-8483-fdde76611849.mov
Did you update your dependencies?
- [X] Yes, I’ve updated my dependencies to use the latest version of all packages.
Are you sponsoring us?
- [ ] Yes, I’m a sponsor. 💖
Just reading through your backlog, this issue sounds similar to #2534
I'm experiencing same issue after I upgraded to beta-194 (on 194 works ok). From what I can see issue is with queueMicrotask
introduced with: https://github.com/ueberdosis/tiptap/pull/3188/files
If I comment that it starts working again.
Why is this closed? This is clearly not fixed