Remark: Nested lists without surrounding text lost in remark-rehype

Created on 29 Jun 2017  Ā·  11Comments  Ā·  Source: remarkjs/remark

Stringifying this html to markdown:

<ul>
  <li>
    <ul>
      <li>test</li>
    </ul>
  </li>
</ul>

Expected
Nested list item:

  - test

Actual
Two bullets on list item:

- - test

Then, if that markdown is parsed and stringified back to html through rehype, you get:

<ul>
  <li><li>test</li></li>
</ul>

Runkit:
https://runkit.com/erquhart/59555f3a3798440012757a6c

Most helpful comment

Fixed and released!

All 11 comments

Interesting! Your last code is a bug! So now it’s in mdast-util-to-hast that doesn’t deal with non-paragraphs in list-items.

However, expected and actual is not a bug, that’s what I just proposed in #269. Again, your input HTML is ā€œinvalidā€ according to the HTML spec. There’s no way to handle that invalid HTML, transform it to markdown (proper markdown, which I just added), back to HTML, and expect it to still be ā€œbrokenā€!

The actual HTML output should, in my opinion be:

<ul>
  <li>
     <ul>
       <li>test</li>
     </ul>
  </li>
</ul>

What do you expect?

The input html is valid, the nested list is wrapped in a list item:

<ul>
  <li>
    <ul>
      <li>test</li>
    </ul>
  </li>
</ul>

At first I thought this was related to #269, but that doesn't seem to be the case.

Oh, I misread your input HTML, I though it was still the HTML from the previous issue, sorry.

As your HTML has two list-items, why do you expect one bullet?

The two bullets aren't a problem necessarily, but it doesn't translate back through to html.

If I put that html through rehype and remark to markdown, then take the resulting markdown and put it back through to html through to rehype, the inner ul element is lost in the process. Browsers then take the resulting list item wrapped in a list item and split it into two sibling list items (the first is empty).

So in other words:

Rehype input:

<ul><li><ul><li>test</li></ul></li></ul>

Remark output:

- - test

Remark input (same as previous Remark output):

- - test

Rehype output:

<ul><li><li>test</li></li></ul>

What browsers (or Chrome, at least) do with that:

<ul><li></li><li>test</li></ul>

Oh, yeah, that’s an issue and I’m working on it, but from the issue’s subject line I thought you didn’t expect the two bullets.

That was my thought at first, but it does seem that two bullets is accurate according to the only worthwhile spec out there: http://spec.commonmark.org/0.26/#example-259

Title updated.

Alright! :+1:

Fixed and released!

You, sir, are the man.

Ha, thanks šŸ˜›

Was this page helpful?
0 / 5 - 0 ratings

Related issues

KyleAMathews picture KyleAMathews  Ā·  6Comments

soroushm picture soroushm  Ā·  6Comments

marcojakob picture marcojakob  Ā·  4Comments

ikatyang picture ikatyang  Ā·  7Comments

ryanpcmcquen picture ryanpcmcquen  Ā·  4Comments