IE creates incorrect list structure when removing list item

[engineering-this]

Type of report

Feature request (workaround)

Provide description of the new feature

Extracted from #2738 (review)

This is request for workaround for an IE upstream issue.

1. Create simple html file with given content:

<div contenteditable="true">
	<ol>
		<li>Foo
			<ol>
				<li>Bar
					<ol>
						<li>Baz</li>
						<li>Faz</li>
					</ol>
				</li>
			</ol>
		</li>
	</ol>
</div>

2. Open with Internet Explorer.
3. Place caret like this: <li>Bar^.
4. Tap Backspace three times.

What happens?

li element is removed, and its content is extracted to ol. Markup looks like this;

<div contenteditable="true">
	<ol>
		<li>Foo
			<ol>
				<ol>
					<li>Baz</li>
					<li>Faz</li>
				</ol>
			</ol>
		</li>
	</ol>
</div>

Note: when selection is in the middle of text, or is followed by inline elements behaviour is works as expected:

Why is it problematic?

We have dedicated logic to merge list items, which fires when Backspace is pressed with selection at the start of li element. But this logic doesn't trigger when IE removes this element with selection at index 1 of text, eg. <li>F^. Workaround should detect all cases when IE removes the element together with text and trigger list item merging logic.