<!doctype html>
<script src="../../resources/testharness.js"></script>
<script src="../../resources/testharnessreport.js"></script>
<script src="../assert_selection.js"></script>
<script>
test(() => assert_selection(
    [
        '<style>.abc {font-size:24px;}</style>',
        '<div contenteditable>',
            '<div class="abc">test|</div>',
        '</div>',
    ].join(''),
    'insertParagraph',
    [
        '<style>.abc {font-size:24px;}</style>',
        '<div contenteditable>',
            '<div class="abc">test</div>',
            '<div class="abc">|<br></div>',
        '</div>',
    ].join('')),
    'insert a paragraph after text');

test(() => assert_selection(
    [
        '<style>.abc {font-size:24px;}</style>',
        '<div contenteditable>',
            '<div class="abc">test|</div>',
        '</div>',
    ].join(''),
    selection => {
        selection.document.execCommand('insertParagraph');
        selection.document.execCommand('insertText', false, 'x');
    },
    [
        '<style>.abc {font-size:24px;}</style>',
        '<div contenteditable>',
            '<div class="abc">test</div>',
            '<div class="abc">x|</div>',
        '</div>',
    ].join('')),
    'insert a paragraph and character after text');

test(() => assert_selection(
    [
        '<style>.abc {font-size:24px;}</style>',
        '<div contenteditable>',
            '<div class="abc">test|test</div>',
        '</div>',
    ].join(''),
    'insertParagraph',
    [
        '<style>.abc {font-size:24px;}</style>',
        '<div contenteditable>',
            '<div class="abc">test</div>',
            '<div class="abc">|test</div>',
        '</div>',
    ].join('')),
    'insert a paragraph in text');

test(() => assert_selection(
    [
        '<style>.abc {font-size:24px;}</style>',
        '<div contenteditable>',
            '<div class="abc">test|</div>',
        '</div>',
    ].join(''),
    selection => {
        selection.document.execCommand('insertParagraph');
        selection.document.execCommand('insertParagraph');
    },
    [
        '<style>.abc {font-size:24px;}</style>',
        '<div contenteditable>',
            '<div class="abc">test</div>',
            '<div class="abc"><br></div>',
            '<div class="abc">|<br></div>',
        '</div>',
    ].join('')),
    'insert two paragraphs after text');

test(() => assert_selection(
    [
        '<style>.abc {font-size:24px;}</style>',
        '<div contenteditable>',
            '<div class="abc">test|</div>',
        '</div>',
    ].join(''),
    selection => {
        selection.document.execCommand('insertParagraph');
        selection.document.execCommand('insertParagraph');
        selection.document.execCommand('insertText', false, 'x');
    },
    [
        '<style>.abc {font-size:24px;}</style>',
        '<div contenteditable>',
            '<div class="abc">test</div>',
            '<div class="abc"><br></div>',
            '<div class="abc">x|</div>',
        '</div>',
    ].join('')),
    'insert two paragraphs and a character after text');

test(() => assert_selection(
    [
        '<style>.abc {font-size:24px;}</style>',
        '<div contenteditable>',
            '<div class="abc">|test</div>',
        '</div>',
    ].join(''),
    'insertParagraph',
    [
        '<style>.abc {font-size:24px;}</style>',
        '<div contenteditable>',
            '<div class="abc"><br></div>',
            '<div class="abc">|test</div>',
        '</div>',
    ].join('')),
    'insert a paragraph before text');

test(() => assert_selection(
    [
        '<style>.abc {font-size:24px;}</style>',
        '<div contenteditable>',
            '<div class="abc">|test</div>',
        '</div>',
    ].join(''),
    selection => {
        selection.document.execCommand('insertParagraph');
        selection.document.execCommand('insertText', false, 'x');
    },
    [
        '<style>.abc {font-size:24px;}</style>',
        '<div contenteditable>',
            '<div class="abc"><br></div>',
            '<div class="abc">x|test</div>',
        '</div>',
    ].join('')),
    'insert a paragraph and character before text');

test(() => assert_selection(
    [
        '<style>.abc {font-size:24px;}</style>',
        '<div contenteditable>',
            '<div class="abc">foo| bar</div>',
        '</div>',
    ].join(''),
    'insertParagraph',
    [
        '<style>.abc {font-size:24px;}</style>',
        '<div contenteditable>',
            '<div class="abc">foo</div>',
            '<div class="abc">|\u{00A0}bar</div>',
        '</div>',
    ].join('')),
    'insert a paragraph after word');
</script>