Resetting the undo/redo history of a Slate.js editor

Slate.js has some wonderful undo/redo history under the hood, by way of the
React hook useMemo. Out of the box is works great, but if you want to reset
your editor back to an empty state (in scenarios where the component is
persistent on the page), the undo/redo history will still be available.

Because I wanted to completely reset the editor as if it was the user’s first
time interacting with it, I had to figure out how to clear out the history.

While I wasn’t able to find a built in command for it, I did figure out that you
can simply reset the history object right on the editor. Said object houses
two arrays, one for undos and one for redos.

To reset the history of your editor, simple run:

editor.history = {
  redos: [],
  undos: [],

Now the editor won’t have any baggage the next time it’s used!

Josh Sherman - The Man, The Myth, The Avatar

About Josh

Husband. Father. Pug dad. Musician. Founder of Holiday API, Head of Engineering and Emoji Specialist at Mailshake, and author of the best damn Lorem Ipsum Library for PHP.

If you found this article helpful, please consider buying me a coffee.