question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Unable to overrde editor.insertNode and editor.insertFragment

See original GitHub issue

Do you want to request a feature or report a bug?

Bug

What’s the current behavior?

Unable to override editor.insertNode and editor.insertFragment

const MyEditor = (editor) =>  {
 ...
editor.insertNode = node => {
		insertNode(node)
		console.log(node)
	}
...

return editor

}

Slate: 0.57.1 Browser: Chrome OS: Mac

What’s the expected behavior?

Should be able to extend these two method with custom logic.

Issue Analytics

  • State:open
  • Created 3 years ago
  • Reactions:2
  • Comments:11 (5 by maintainers)

github_iconTop GitHub Comments

2reactions
majelbstoatcommented, May 2, 2020

folks, you can already override insertNode and insertData.

const withMyPlugin = <T extends ReactEditor>(
  e: T,
) => {
  const { insertData, insertNode } = e

  e.insertNode = (node: Node) => {
    console.log("custom stuff")
    return insertNode(node) // do the default action
  }

  e.insertData = (data: DataTransfer) => {
    console.log("custom stuff")
    return insertData(data) // do the default action
  }

  return e
}

// Create the editor with my custom plugin
const editor = useMemo(
  () => withMyPlugin(withReact(createEditor())), []
)
1reaction
zengemcommented, Sep 5, 2020
e.insertNode = (node: Node) => {
    console.log("custom stuff")
    return insertNode(node) // do the default action
  }

Hi @mresposito , I missed your reply. Thank you very much for providing the example.

However, I tried the same code, insertData works, but NOT insertNode.

As @Entkenntnis observed, slate does not seems to be calling editor.insertNode at all, which I think is a bug.

Q.

Read more comments on GitHub >

github_iconTop Results From Across the Web

Editor - Slate
The Editor object stores all the state of a Slate editor. It can be extended by plugins to add helpers and implement new...
Read more >
Slate.js throws an error when inserting a new node at selected ...
The issue is related to rendering when you use useMemo , instead you should use useRef : const editorRef = useRef() if (!editorRef.current) ......
Read more >
AuthorDocumentFilter (Oxygen XML API)
AuthorDocumentFilter , is a filter for the methods which modify the AuthorDocument . When the AuthorDocument is modified through the methods from the ......
Read more >
Slate js Tip - Deep clone nodes recursively - jkrsp.com
insertNodes for example). ... editor.fragment() returns the list of nodes associated with the ... editor.insertFragment(cloneChildren(frag)).
Read more >
tinymce.dev - Waldmonitoring Wiki
insertBefore (element.dom(), marker.dom()); }); }; var after = function (marker, ... setInterval: wrappedSetInterval, setEditorTimeout: function (editor, ...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found