markdown-it-table-of-contents icon indicating copy to clipboard operation
markdown-it-table-of-contents copied to clipboard

Zombie <p></p> before and after the ToC

Open marconae opened this issue 1 year ago • 1 comments

I am using version 0.6.0. The <div...><ul>... is always wrapped in a <p>.

Excerpt of the Markdown file:

Lorem Ipsum Dolor...

[[toc]]

## Headline 1

Lorem Ipsum Dolor...

## Headline 2

Lorem Ipsum Dolor...

Here is the generated HTML:

<p>
  <div class="table-of-contents"><ul>....</ul></div>
</p>

Checked other blogs out there that use the library and I see the wrapping <p> there as well.

How to get rid of the wrapping <p>?

marconae avatar Sep 06 '24 14:09 marconae

@marconae I'm afraid this is actually expected behavior, because of how Markdown works. This plugin doesn't really add the <p> container. The problem is that [[toc]] is on its own paragraph. If you add [[toc]] to the vanilla markdown-it renderer (try here), it turns it into <p>[[toc]]</p>. This plugin now turns [[toc]] into a full table of contents. I haven't looked into markdown-it to see if this behavior can be changed somehow.

If you do this:

Test
[[toc]]

it will be transformed into

<p>Test<div class="table-of-contents">...</div></p>

Not optimal either.

I suppose there is a way to modify the plugin to not add a default paragraph. Maybe I can look into it, but can't promise right now.

cmaas avatar Sep 06 '24 15:09 cmaas

@cmaas Thanks for your feedback. I just discovered the issue, because I would like to have W3C valid HTML in my blog. It would be great if there is a way to modify the plugin to not add the <p>.

marconae avatar Sep 07 '24 15:09 marconae

@marconae New version 0.7.0 fixes this and removes the wrapping <p> tag.

cmaas avatar Sep 09 '24 13:09 cmaas