Importing html with nested lists causes invalid doc structure

[Coding-Kiwi]

See my comment #2 (comment)

If a <li> tag contains a <p> and a sublist <ul>, the ListItem Node wraps the content with an additional <p> tag.

The resulting json doc can be loaded into tiptap but as soon as you edit a list item, an Invalid content for node paragraph is thrown because there is now a <p> tag containing a <p> and <ul> tag which is not valid, because a <p> tag can only contain phrasing content.

[hivokas]

I'm seeing this issue as well.

> (new \Tiptap\Editor(['content' => '<p>List:</p><ul><li><p>bullet</p><ol><li><p>one</p></li></ol></li></ul>']))->getJSON()
= "{"type":"doc","content":[{"type":"paragraph","content":[{"type":"text","text":"List:"}]},{"type":"bulletList","content":[{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"paragraph","content":[{"type":"text","text":"bullet"}]},{"type":"orderedList","content":[{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"one"}]}]}]}]}]}]}]}"

> (new \Tiptap\Editor(['content' => '<p>List:</p><ul><li><p>bullet</p><ol><li><p>one</p></li></ol></li></ul>']))->getHTML()
= "<p>List:</p><ul><li><p><p>bullet</p><ol><li><p>one</p></li></ol></p></li></ul>"

Note how <p>bullet</p> becomes <p><p>bullet</p>.

[hivokas]

Similarly to @Coding-Kiwi, I've also noticed this issue while trying to migrate from HTML to JSON TipTap doc.

[hivokas]

@timoisik if you can take a look at this issue when you have time, it would be great.

[lukasleitsch]

I have the same issue with the sanitize method. Example:

$string = "<p>An example</p><ul><li><p>list item a</p><ul><li><p>list item b</p></li></ul></li></ul>";

$sanitizedHtml = (new Tiptap\Editor)->sanitize($string);

// output: <p>An example</p><ul><li><p><p>list item a</p><ul><li><p>list item b</p></li></ul></p></li></ul>

[lukasleitsch]

The workaround from @Coding-Kiwi in #2 (comment) solves the issue for me at this moment:

class TipTapListItem extends \Tiptap\Nodes\ListItem
{
    public static function wrapper($DOMNode)
    {
        return null;
    }
}

$string = "<p>An example</p><ul><li><p>list item a</p><ul><li><p>list item b</p></li></ul></li></ul>";

$sanitizedHtml = (new Tiptap\Editor([
        'extensions' => [
            new Tiptap\Extensions\StarterKit([
                'listItem' => false,
            ]),
            new TipTapListItem(),
        ],
    ]))->sanitize($string)