Tiptap undo and redo: configure local history and choose useful edit groups

A dispatch-note author corrects a destination, then deletes an unrelated paragraph. Undo should help the author reverse the deletion without guessing how much text one action will remove. History grouping determines that experience, so test it with actual editing sequences rather than only checking whether Ctrl+Z responds.

Configure one local history extension

For a Tiptap 3 application using StarterKit, configure its included history support:

import StarterKit from '@tiptap/starter-kit';

const noteExtensions = [
  StarterKit.configure({
    undoRedo: {
      depth: 100,
      newGroupDelay: 750
    }
  })
];

Merge this with the existing editor setup and compatible package versions. The 750-millisecond value is an example choice for this note editor, not a universal recommendation. Tiptap documents defaults of 100 history events and a 500-millisecond grouping delay.

If your application assembles its schema without StarterKit, import UndoRedo from @tiptap/extensions and add its configured extension once. Preserve the document, paragraph, text, and other schema features the editor needs. Avoid adding a separate UndoRedo instance beside StarterKit's enabled copy.

Current StarterKit documentation identifies undoRedo as the relevant option. Match the configuration to the installed major version when adapting older examples.

Understand what the delay changes

newGroupDelay is the time after which changes start a new group. The documentation also says nonadjacent changes always start a new group. A 750-millisecond setting therefore does not mean “everything typed within 750 milliseconds becomes one undo,” regardless of document position.

Use this original fixture in your real development editor:

1. Start with “Deliver to Depot A” and a separate paragraph reading “Telephone the desk on arrival.”
2. Change A to B, pause longer than the configured delay, then remove the telephone paragraph.
3. Undo once and inspect the paragraph and destination separately.
4. Redo the operation, then repeat with adjacent typing and shorter pauses.

Record the actual groups your complete extension setup creates. Formatting commands, custom transactions, and other integrations can influence the editing sequence. Choose a delay that makes sense for the writers' corrections rather than designing the setting around a typing-speed assumption.

depth counts history events, not characters or named document versions. Keeping 100 events does not promise recovery of every sentence written during a long shift.

Connect visible actions to the current editor

After obtaining the live editor instance, these command calls perform the corresponding actions:

editor.commands.undo();
editor.commands.redo();

Treat these as separate handlers for separate controls. To return focus to the editor as part of a button action, use its command chain:

editor.chain().focus().undo().run();

The documented Windows/Linux shortcuts include Ctrl+Z for Undo and Ctrl+Shift+Z or Ctrl+Y for Redo. On macOS, use Command+Z and Command+Shift+Z or Command+Y. Keep usable visible controls when application or platform key handling changes those shortcuts.

Check which editor owns an external toolbar when several notes are open. An active-looking Undo control must not reverse an edit in a different record.

Keep local history apart from collaborative history and saved revisions

For a shared Yjs document, use the Tiptap collaboration setup and its history integration. The ordinary UndoRedo extension is documented for editors that are not collaborative. Combining two history systems can make the intended undo ownership unclear.

Local undo is also different from a saved revision browser. Decide how your application handles moving between records, reloading a document, and reopening a saved note. Do not promise that this extension alone supplies persistent cross-session versions.

Finish the dispatch test by restoring the telephone instruction, confirming Depot B, saving, and reopening the note through the application. The saved instruction should match the final document the author chose after undoing and redoing changes.