<!DOCTYPE html>
<script src="../../resources/testharness.js"></script>
<script src="../../resources/testharnessreport.js"></script>
<script src="../../resources/assert-selection.js"></script>
<script>
// Tests breaking out of empty list item in case of nested lists.
function insertNewline(selection) {
  selection.document.execCommand('insertText', false, '\n')
}

selection_test(
    [
        '<div contenteditable><ol>',
            '<li>one</li>',
            '<ul><li>1|</li><li>2</li></ul>',
            '<li>two</li>',
        '</ol></div>'
    ],
    insertNewline,
    [
        '<div contenteditable><ol>',
            '<li>one</li>',
            '<ul><li>1</li><li>|<br></li><li>2</li></ul>',
            '<li>two</li>',
        '</ol></div>'
    ],
    'Split the inner list into two');
selection_test(
    [
        '<div contenteditable><ol>',
            '<li>one</li>',
            '<ul><li>1</li><li>|<br></li><li>2</li></ul>',
            '<li>two</li>',
        '</ol></div>'
    ],
    insertNewline,
    [
        '<div contenteditable><ol>',
            '<li>one</li>',
            '<ul><li>1</li></ul>',
            '<li>|<br></li>',
            '<ul><li>2</li></ul>',
            '<li>two</li>',
        '</ol></div>'
    ],
    'Break out of the first inner list');
selection_test(
    [
        '<div contenteditable><ol>',
            '<li>one</li>',
            '<ul><li>1</li></ul>',
            '<li>|<br></li>',
            '<ul><li>2</li></ul>',
            '<li>two</li>',
        '</ol></div>'
    ],
    insertNewline,
    [
        '<div contenteditable><ol>',
            '<li>one</li>',
            '<ul><li>1</li></ul>',
        '</ol>',
        '<div>|<br></div>',
        '<ol>',
            '<ul><li>2</li></ul>',
            '<li>two</li>',
        '</ol></div>'
    ],
    'Break out of the outer list');

selection_test(
    [
        '<div contenteditable><ol>',
            '<li>one</li>',
            '<ul><li>1</li></ul>',
            '<li>|<br></li>',
            '<ul><li>2</li></ul>',
            '<li>two</li>',
        '</ol></div>'
    ],
    'insertText XYZ',
    [
        '<div contenteditable><ol>',
            '<li>one</li>',
            '<ul><li>1</li></ul>',
            '<li>XYZ|</li>',
            '<ul><li>2</li></ul>',
            '<li>two</li>',
        '</ol></div>'
    ],
    'insert XYZ');
</script>
