EvitanRelta/htmlarkdown

Loose list

EvitanRelta opened this issue · 2 comments

Edited on 20/12/2022 to include the edge cases in the comments

Context

If list-items have no blank-lines inbetween:

- Item 1
- Item 2
- Item 3

The list is considered tight, and render like this:

  • Item 1
  • Item 2
  • Item 3


But if there's blank-lines inbetween list-items:

- Item 1

- Item 2

- Item 3

The list is considered loose, and render with each list-items' contents being wrapped in a <p> tag like this:
(visually, it results in larger inbetween-list-item-space)

  • Item 1

  • Item 2

  • Item 3


The improvement

Loose lists (both ordered and unordered) such as:

<!-- All have paragraphs -->
<ul>
  <li><p>Item 1</p></li>
  <li><p>Item 2</p></li>
  <li><p>Item 3</p></li>
</ul>
<!-- Empty list-items have no paragraphs -->
<ul>
  <li><p>Item 1</p></li>
  <li></li>
  <li><p>Item 3</p></li>
</ul>
<!-- List-items with other block elements isn't wrapped in paragraphs -->
<ul>
  <li><p>Item 1</p></li>
  <li><h1>Item 2 (heading)</h1></li>
  <li><p>Item 3</p></li>
</ul>
<!-- List-items with multiple block-elements -->
<ul>
  <li><p>Item 1</p></li>
  <li>
    <p>Item 2</p>
    <h1>Heading in list-item</h1>
  </li>
  <li><p>Item 3</p></li>
</ul>

Should have blank-lines inbetween their converted list-items:

- Item 1

- Item 2

- Item 3
- Item 1

- 

- Item 3
- Item 1

- # Item 2 (heading)

- Item 3
- Item 1

- Item 2
  
  # Heading in list-item

- Item 3

But if the list is tight, with only some list-items have <p> like:

<ul>
  <li>Item 1</li>
  <li><p>Item 2</p></li>
  <li>Item 3</li>
</ul>

Then the output markdown should be:

- Item 1
- <p>Item 2</p>
- Item 3

Turns out that the <li> inner content doesn't need to be fully wrapped in <p>.
The following are also valid loose lists:

<ul>
  <li>
    <p>Item 1</p>
    <pre><code>Codeblock</code></pre>
    <h1>Heading</h1>
  </li>
  <li><p>Item 2</p></li>
</ul>
<ul>
  <li><h1>Heading</h1></li>
  <li><p>Item 2</p></li>
</ul>

Which markdown conversion should be:

- Item 1
  
  ```
  Codeblock
  ```
  
  # Heading

- Item 2
- # Heading

- Item 2

While if the list-items doesn't have paragraphs, like:

<ul>
  <li>
    Item 1
    <pre><code>Codeblock</code></pre>
    <h1>Heading</h1>
  </li>
  <li>Item 2</li>
</ul>

Then the markdown conversion should be without empty-lines at all (including between the codeblock and heading):
(explained in Bug #18 and defined by GFM)

- Item 1
  ```
  Codeblock
  ```
  # Heading
- Item 2

Another edge case.

If a list-item is empty, like:

- Item 1

- 

- Item 3


Then, no <p> tag is added to the rendered HTML:

<ul>
  <li><p>Item 1</p></li>
  <li></li>
  <li><p>Item 3</p></li>
</ul>