<!doctype HTML>
<script src="../../resources/testharness.js"></script>
<script src="../../resources/testharnessreport.js"></script>
<style>
#editable p {
  font-size: 20px;
  line-height: 22px;
  color: red;
}
</style>
<div contenteditable="true" id="editable">
  <ul>
    <li>list item 1</li>
    <li>list item 2</li>
    <li>list item 3</li>
  </ul>
  <p>Paragraph</p>
</div>
<script>
test(function() {
  var editor = document.getElementById('editable');
  var range = document.createRange();
  var selection = window.getSelection();
  range.setStart(editor.childNodes[2], 0);
  range.collapse(true);
  selection.removeAllRanges();
  selection.addRange(range);
  editor.focus();
  document.execCommand('delete');

  var htmlPara = document.getElementsByTagName('li')[2].outerHTML;
  assert_equals(htmlPara, '<li>list item 3Paragraph</li>');
}, 'make a paragraph into a list by backspace');
</script>