<!--
@BLINK-ALLOW:next*
@BLINK-ALLOW:prev*
@BLINK-ALLOW:className=*
@BLINK-ALLOW:isLineBreakingObject=true
@BLINK-ALLOW:notUserSelectableStyle*
@WIN-ALLOW:auto-gen*
-->
<style>
/* Make the spans easier to see, for debugging */
/* Each span also has a class name */
span { background-color: rgba(0, 255, 0, .3); }
</style>
<div role="textbox" contenteditable="true">
<p>Beginning</p>
<ol>
<li>A plain list item</li>
<li>
A list item<br>with a br (line break) inside it
</li>
<li><p role="presentation">A list item with an inner p role=presentation</p></li>
<li>
<p role="presentation">A list item with both a br and <br>an inner p role=presentation</p>
</li>
<li>
<span class=a1>A list item with <span class=a2>inner <span class=a3>spans</span> </span>on each line</span><br><span clas=b1>and separated by a br</span>
</li>
<li>
<p role="presentation"><span class=a1>A list item with a role presentation, and two inner spans, </span> <span class=a2>each separated by a space</span>
</p>
</li>
<li>
<p role="presentation"><span class=a1>A list item with a role presentation, and two inner spans, </span><br><span class=b1>each separated by a br</span>
</p>
</li>
<li>
<p role="presentation"><span class=a1>Hello</span><span class=a2><span class=a3 contenteditable="false"></span></span> <span class=b1>world this</span><span class=b2><span class=b3 contenteditable="false"> </span></span><span class=c1>is like docs markup without the weird presentational br</span>
</p>
</li>
<li>
<p role="presentation"><span class=a1>Hello</span><span class=a2><span class=a3 contenteditable="false"> <br role="presentation"></span></span><span class=b1>world this</span><span class=b2><span class=b3 contenteditable="false"> <br role="presentation"></span></span><span class=c1>is just like docs, and your kitchen sink</span>
</p>
</li>
</ol>
<p>The end</p>
</div>