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>