CKEditor 5 track changes: save suggestions so reviewers can reopen them

Track changes is a premium CKEditor feature. Use the installation and license configuration for your editor version. The standalone integration differs from a real-time collaboration setup; choose the documentation that matches your application.

Keep a proposed change separate from the approved notice

Consider a fictional laboratory notice: “Return the sensor by Tuesday.” The author proposes Wednesday, while a reviewer has not yet approved the extension. The editable document must retain enough information to reopen that proposal, identify its author, and accept or discard it later.

Record three different outcomes in your development fixture:

Use separate fixture copies for the last two cases. Accepting a suggestion changes its review state; a later discard test cannot start from that already accepted state.

Save the content and attached suggestions together

In an already initialized standalone editor, capture the current document and the suggestions attached to it:

const trackChanges = editor.plugins.get('TrackChanges');
const editableSnapshot = {
  content: editor.getData(),
  suggestions: trackChanges.getSuggestions({
    skipNotAttached: true,
    toJSON: true
  })
};

This creates a snapshot in memory. Send it through your application's authorized save path and acknowledge success after the server commits it. If content and suggestion records are stored separately, define how the server keeps them consistent so reopening cannot combine new markers with older metadata.

The integration documentation also explains user initialization and comment-thread persistence. Load those associated records when the feature uses them. A suggestion's author ID needs a corresponding user; saving only the visible display name loses that relationship.

CKEditor places suggestion boundary tags or attributes in its editable HTML. An HTML cleanup step that removes these markers can break future editing even when the remaining words look readable. Preserve the editor's documented suggestion representation in the editable store. Apply your application's separate display policy to reader-facing content.

Choose the adapter when edits need immediate persistence

The standalone feature supports a load-and-save approach and an adapter that persists suggestion changes as they occur. CKEditor recommends the adapter for greater control over data and server validation. Its asynchronous methods return promises; resolve after the requested storage action succeeds and reject on failure.

Keep authorization and authoritative authorship on the server. The integration guide calls out originalSuggestionId: an edit can split an existing suggestion, and the new record may need the original suggestion's author. Blindly attributing every new suggestion record to the current requester can misidentify the person who proposed the text.

Adapter operations and document-content saving still need an application-level consistency strategy. A successfully stored suggestion does not by itself establish that the matching document content was saved. For the sensor notice, interrupt a development save and verify that a failed operation remains visible to the author instead of reporting the notice as ready.

Create a clean reader copy without replacing the review copy

For a preview that treats all proposals as accepted, the separate TrackChangesData plugin provides an asynchronous operation:

const acceptedPreview = await editor.plugins
  .get('TrackChangesData')
  .getDataWithAcceptedSuggestions();

Enable that plugin in the existing build before calling it. The data export documentation explains that it uses a temporary editor and may need configuration for custom initialization.

An accepted preview is useful for checking the proposed final sentence. It should not silently overwrite the editable review record. Likewise, getData({ showSuggestionHighlights: true }) produces a visual preview representation that CKEditor explicitly says cannot be loaded back with setData(). The track changes overview documents that boundary.

For ordinary toolbar placement and document saving, see the CKEditor document editor integration. Finish this integration by reopening the unresolved sensor notice under the intended reviewer account, checking the author's identity, and accepting the date only after the laboratory confirms it.