<!DOCTYPE html>
<script src="../../resources/testharness.js"></script>
<script src="../../resources/testharnessreport.js"></script>
<script src="../assert_selection.js"></script>
<script>
selection_test(
    [
        '<div contenteditable>',
          '<div>',
            '<span style="font-style: times; color: blue">This text should be blue times</span>',
          '</div>',
          '<span style="font-style: italic; color: green">|This text should be green italic</span>',
        '</div>',
    ],
    'insertOrderedList',
    [
        '<div contenteditable>',
          '<div>',
            '<span style="font-style: times; color: blue">This text should be blue times</span>',
          '</div>',
          '<ol>',
            '<li><span style="font-style: italic; color: green">|This text should be green italic</span></li>',
          '</ol>',
        '</div>',
    ],
    'insertOrderedList - Listify styled paragraph should preserve the style.');

selection_test(
    [
        '<span>',
          '<div contenteditable>',
            '<div>',
              '<span style="font-style: times; color: blue">This text should be blue times</span>',
            '</div>',
            '<span style="font-style: italic; color: green">|This text should be green italic</span>',
          '</div>',
        '</span>',
    ],
    'insertOrderedList',
    [
        '<span>',
          '<div contenteditable>',
            '<div>',
              '<span style="font-style: times; color: blue">This text should be blue times</span>',
            '</div>',
            '<ol>',
              '<li><span style="font-style: italic; color: green">|This text should be green italic</span></li>',
            '</ol>',
          '</div>',
        '</span>',
    ],
    'insertOrderedList - A contaning span outside the editing boundaries shouldn not affect when listifying a styled paragraph.');

selection_test(
    [
        '<div contenteditable>',
          '<ol style="font-style: times; color: blue">',
            '<li>This text should be blue times</li>',
          '</ol>',
          '<span style="font-style: italic; color: green">|This text should be green italic</span>',
        '</div>',
    ],
    'insertOrderedList',
    [
        '<div contenteditable>',
          '<ol style="font-style: times; color: blue">',
            '<li>This text should be blue times</li>',
            '<li><span style="font-style: italic; color: green">|This text should be green italic</span></li>',
          '</ol>',
        '</div>',
    ],
    'insertOrderedList - Listify a paragraph inside an existent styled list should preserve the paragraph style.');
</script>