I have been trying to understand what happens under the hood of sinkListItem, and I think I get most of it.
There are two cases:
- When the first
<li>doesn’t have any nested children - When the first
<li>already has a nested list, i.e. has already a<ul>as its last child
The first case is very clear to me, but I’ll still elaborate my understanding because this is needed to explain my problem for the second case. Let’s say we want have two <li> elements:
<li>
<p>p1</p>
</li>
<li>
<p>p2</p>
</li>
And by indenting the second list item to make it a child of the first one, we want this:
<li>
<p>p1</p>
<ul>
<li>
<p>p2</p>
</li>
</ul>
</li>
(Here I use <ul>, but the same applies to <ol>)
The function sinkListItem uses a ReplaceAroundStep to replace the content between replace-start and replace-end (as illustrated below) by wrapping the second li in a slice, i.e:
<li>
<p>p1</p>
<!-- {replace-start} -->
</li>
<li>
<p>p2</p>
</li><!-- {replace-end} -->
Slice:
<li><!-- openStart --><ul><!-- insert pos --></ul></li>
The above is what happens when the first <li> doesn’t yet have a <ul> as its last child, and looks very straight forward. The thing that puzzles me is when the first <li> already has a <ul> as its last child.
For example, before the indenting:
<li>
<p>p1</p>
<ul>
<li><p>p11</p></li>
</ul>
</li>
<li><p>p2</p></li>
And here is what we want after indenting the last <li>:
<li>
<p>p1</p>
<ul>
<li><p>p11</p></li>
<li><p>p2</p></li>
</ul>
</li>
For the second case, I expect it would be similar to the first case, we can use a ReplaceAroundStep, with a similar slice (with different openStart and insert position:
<li>
<p>p1</p>
<ul>
<li><p>p11</p></li>
<!-- replace-start -->
</ul>
</li>
<li><p>p2</p></li>
<!-- replace-end -->
Slice:
<li><ul><!-- openStart --><!-- insert pos --></ul></li>
However when reading the official implementation, it does something that doesn’t make sense to me: the replace-start is 1 token to the left of my understandings above, and the slice openStart / insert position is also different accordingly:
<li>
<p>p1</p>
<ul>
<li><p>p11</p><!-- replace-start --></li>
</ul>
</li>
<li><p>p2</p></li>
<!-- replace-end -->
Slice:
<li><ul><li><!-- openStart --></li><!-- insert pos --></ul></li>
I tested both versions (my version and the official version) and they both work. But to me it looks like the official versions is not doing it in the best way. May be I’m missing something?