Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Support for nested <ul>/<ol> tags without <li> (not technically valid) #445

Open
wants to merge 4 commits into
base: master
Choose a base branch
from
Open

Support for nested <ul>/<ol> tags without <li> (not technically valid) #445

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
4 commits
Select commit Hold shift + click to select a range
1344a90
Update commonmark-rules.js
dnotes Jul 31, 2023
93dd22f
fix code style
dnotes Jul 31, 2023
eaf8eeb
add tests and fix small issues; revert empty li
dnotes Jul 31, 2023
e7bd2de
remove blank lines and comments from commonmark-rules.js
dnotes Aug 1, 2023
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
8 changes: 7 additions & 1 deletion src/commonmark-rules.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -50,6 +50,12 @@ rules.list = {

replacement: function (content, node) {
var parent = node.parentNode
if (node.parentNode.nodeName.match(/^(UL|OL)$/i)) {
content = ' ' + content
.replace(/^\n+/, '') // remove leading newlines
.replace(/\n+$/, '\n') // replace trailing newlines with just a single one
.replace(/\n/gm, '\n ') // indent
}
if (parent.nodeName === 'LI' && parent.lastElementChild === node) {
return '\n' + content
} else {
Expand All @@ -70,7 +76,7 @@ rules.listItem = {
var parent = node.parentNode
if (parent.nodeName === 'OL') {
var start = parent.getAttribute('start')
var index = Array.prototype.indexOf.call(parent.children, node)
var index = Array.prototype.indexOf.call(Array.prototype.filter.call(parent.children, el => el.nodeName === 'LI'), node)
prefix = (start ? Number(start) + index : index + 1) + '. '
}
return (
Expand Down
92 changes: 92 additions & 0 deletions test/index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -523,6 +523,98 @@
* This is a third item at root level</pre>
</div>


<div class="case" data-name="nested ols and uls as intended">
<div class="input">
<ul>
<li>This is a list item at root level</li>
<li>This is another item at root level
<ol>
<li>This is a nested list item</li>
<li>This is another nested list item
<ul>
<li>This is a deeply nested list item</li>
<li>This is another deeply nested list item</li>
<li>This is a third deeply nested list item</li>
</ul>
</li>
</ol>
</li>
<li>This is a third item at root level</li>
</ul>
</div>
<pre class="expected">* This is a list item at root level
* This is another item at root level
1. This is a nested list item
2. This is another nested list item
* This is a deeply nested list item
* This is another deeply nested list item
* This is a third deeply nested list item
* This is a third item at root level</pre>
</div>

<div class="case" data-name="nested ols and uls outside of li">
<div class="input">
<ul>
<li>This is a list item at root level</li>
<li>This is another item at root level</li>
<ol>
<li>This is a nested list item</li>
<li>This is another nested list item</li>
<ul>
<li>This is a deeply nested list item</li>
<li>This is another deeply nested list item</li>
<li>This is a third deeply nested list item</li>
</ul>
</ol>
<li>This is a third item at root level</li>
</ul>
</div>
<pre class="expected">* This is a list item at root level
* This is another item at root level

1. This is a nested list item
2. This is another nested list item

* This is a deeply nested list item
* This is another deeply nested list item
* This is a third deeply nested list item


* This is a third item at root level</pre>
</div>

<div class="case" data-name="nested ols outside li">
<div class="input">
<ol>
<li>item 1</li>
<li>item 2</li>
<ol>
<li>item 2.1</li>
<li>item 2.2</li>
<ol>
<li>item 2.2.1</li>
<li>item 2.2.2</li>
<li>item 2.2.3</li>
</ol>
</ol>
<li>item 3</li>
</ol>
</div>
<pre class="expected">1. item 1
2. item 2

1. item 2.1
2. item 2.2

1. item 2.2.1
2. item 2.2.2
3. item 2.2.3


3. item 3</pre>
</div>

<div class="case" data-name="ul with blockquote">
<div class="input">
<ul>
Expand Down