CKEDITOR 4 How to make snapshot before using custom command to use CTRL+Z to undo

Question

Problem is following:

We have custom block element, such as quote.

We want to have a possibility to "CTRL+Z" (Undo) its creation.

How to make snapshot of current state of ckeditor before inserting its html, so CTRL+Z after that would be usable?

Answer 1

To save a snapshot just fire saveSnapshot event on editor instance. You have to do this before and after performing an action which should be recorded as a separate snapshot. For example:

editor.fire( 'saveSnapshot' );
editor.insertHtml( '...' );
editor.fire( 'saveSnapshot' );

Also, if your functionality is a single command, remember that editor records snapshots whenever you execute it. So this wouldn't make sense:

editor.fire( 'saveSnapshot' );
editor.execCommand( 'myCmd' );
editor.fire( 'saveSnapshot' );

Update: If you want to merge some operations which could make their own snapshots (like executed command) then you can lock snapshot before performing them and unlock after.

editor.fire( 'lockSnapshot' );
editor.execCommand( 'myCmd1' );
editor.execCommand( 'myCmd2' );
editor.fire( 'unlockSnapshot' );

While snapshot is locked new snapshots won't be recorder. If snapshot stack was up to date in the moment of locking the snapshot, then unlockSnapshot will update the last snapshot. But if it wasn't then all those changes will not be recorded until next saveSnapshot is fired.

This is a bit tricky and requires some practice and testing to start using this mechanism properly :).