Open zignis opened 1 year ago
Lexical version: 0.12.0
Inserting an image node results in the following DOM structure:
<p class="PlaygroundEditorTheme__paragraph"> <span class="editor-image" data-lexical-decorator="true" contenteditable="false"> <div draggable="false"><img src="/assets/yellow-flower.a2a7c7a2.jpg" alt="Yellow flower in tilt shift lens" style="height: inherit; max-width: 500px; width: inherit;" draggable="false"></div> </span> </p>
This markup is invalid as <p> and <span> are inline elements and they cannot contain block elements such as <div>
<p>
<span>
<div>
Invalid DOM nesting. The draggable div can be converted to a span element to fix this.
Hm, good point. This seems like an easy fix
Lexical version: 0.12.0
Steps To Reproduce
The current behavior
Inserting an image node results in the following DOM structure:
This markup is invalid as
<p>
and<span>
are inline elements and they cannot contain block elements such as<div>
The expected behavior
Invalid DOM nesting. The draggable div can be converted to a span element to fix this.