Autosave

With autosave on, the post is saved to the browser (localStorage) every few seconds. If the tab closes or the browser crashes, the next visit shows a "You have an unsaved draft" bar above the editor with Restore and Discard.

createEditor('#editor', {
  toolbar: 'heading | bold italic | bulletList',
  autosave: { key: 'docs-autosave-demo', interval: 1000 },
});

Behavior

• Saves every interval (default 3 seconds), only when the content changed; also once on destroy().
• The storage key is e82:draft: plus key; without key the page path (location.pathname) is used.
• On load, a draft that differs from the initial content brings up the restore bar. Restoring is an ordinary undoable change.
• Clearing all content removes the draft.
• An editor on a <textarea> clears the draft when the form is submitted.

Clearing the draft after saving

If you save with fetch, call clearAutosave() once the save succeeds, so the next visit does not offer to restore a post that is already saved.

const editor = createEditor('#editor', {
  autosave: { key: 'board-write' },
});

saveButton.addEventListener('click', async () => {
  const res = await fetch('/posts', { method: 'POST', body: editor.getHTML() });
  if (res.ok) {
    editor.clearAutosave();
    editor.markClean();
  }
});

Drafts stay in that browser only: they do not follow the writer to another device, and on a shared PC the next person can see them. To undo bigger mistakes see Revisions; to warn before leaving see Unsaved changes.

Options