state_unsafe_mutation error in svelte 5, and solution

[noy4]

untrack writable mutation in onTransaction, and error has gone.

import { untrack } from 'svelte'
// ...
      onTransaction: () => {
-       editor.update(v => v)
+       untrack(() => editor.update(v => v))
      },

Background

I've been using tiptap with svelte, and updated writable on transaction. like:

// editor.ts
export function createEditor() {
  const editor = store<Editor>() // `store` is writable with get method

  function init(node: HTMLElement) {
    const _editor = new Editor({
      element: node,
      // ...
      onTransaction: () => {
        editor.update(v => v)
      },
    })
    editor.set(_editor)

    return {
      destroy: () => editor.get().destroy(),
    }
  }

  return { editor, init }
}

// Editor.svelte
<script lang='ts'>
  import { createEditor } from './editor'
  const { editor, init } = createEditor()

  function doSomethingWithEditor(){
    editor.get().commands.doSomething()
  }
</script>

<div use:init />

When I updated to svelte 5, state_unsafe_mutation error occurred.

Uncaught Svelte error: state_unsafe_mutation
Updating state inside a derived or a template expression is forbidden. If the value should not be reactive, declare it without $state
https://svelte.dev/e/state_unsafe_mutation
at state_unsafe_mutation (http://localhost:5173/node_modules/.vite/deps/chunk-DZ64SAAO.js?v=3b471dcd:329:19)
at set (http://localhost:5173/node_modules/.vite/deps/chunk-DZ64SAAO.js?v=3b471dcd:859:5)
at Array. (http://localhost:5173/node_modules/.vite/deps/chunk-N6ARXXPE.js?v=3b471dcd:2696:11)
at set (http://localhost:5173/node_modules/.vite/deps/chunk-S7UQMNRS.js?v=3b471dcd:31:35)
at Object.update (http://localhost:5173/node_modules/.vite/deps/chunk-S7UQMNRS.js?v=3b471dcd:39:5)
at NewChatFormEditor.onTransaction (http://localhost:5173/src/xaris-app/lib/chat/ChatPanel/NewChatForm/new-chat-form-editor.ts?t=1735074672647:34:16)

ref.

• Svelte 5: state_unsafe_mutation on trying to mix stores with runes sveltejs/svelte#13840 (comment)
• In onblur handler: state_unsafe_mutation Updating state inside a derived or logic block expression is forbidden [svelte 5 issue] sveltejs/svelte#13684