Transforms errors on Firefox about VirtualDOM Hierarchy (validations)

[bekogeko]

Description if I try to move render block to down (for swapping like behavior) it works on chrome but not works in mozilla. I found out it becasue of defaultParagraphSeparator diffrence between two browsers. Mozilla uses <br/> and chrome uses div for new line seperations.

I think that way because the errors are related to hierarchy of the virual DOM for example div element cannot be inside of p or so.

Recording

Sandbox A link to a sandbox where the error can be reproduced. (You can start from the base sandbox here: https://codesandbox.io/s/slate-reproductions-c7gyg or refer to the Slate website too.)

Steps

1. In renderElement callback return div with button and a element for exaple <div> <button>V</button> <p>aaa</p></div>
2. Add onClick callback to button
3. In callback swap current block with next block for instane Transforms.setNodes(editor, { type: "heading", data: { level: 1, }, }); 5.Click the button and See error

Expectation I want to swap the currently editing block with the next block. Just like the editorjs with the toolbar. here is an link and a recording.e https://editorjs.io/

Environment

• Slate Version: 0.81.1
• Operating System: Windows
• Browser: Firefox Mozilla

Context I found a document taht might help a bit about the cross platform defaultParagraphSeparator. we can decide how to seperate paragraph with document.execCommand

[bekogeko]

I figured out its not about validation directly