<!doctype html>
<script src="../../resources/testharness.js"></script>
<script src="../../resources/testharnessreport.js"></script>
<script src="../assert_selection.js"></script>
<script>
    test(() => assert_selection(
        [
            '<div contenteditable style="font-size: 24px; word-wrap: break-word;">',
                '<div>^There is a tide',
                    '<div>In the affairs of men</div>',
                    'Which taken at the flood|',
                '</div>',
            '</div>',
        ].join(''),
        'fontSizeDelta +1px',
        [
            '<div contenteditable style="font-size: 24px; word-wrap: break-word;">',
                '<div style="font-size: 25px;">^There is a tide',
                    '<div>In the affairs of men</div>',
                    'Which taken at the flood|',
                '</div>',
            '</div>',
        ].join('')),
        'select all characters');

    test(() => assert_selection(
        [
            '<div contenteditable style="font-size: 24px; word-wrap: break-word;">',
                '<div>^There is a tide',
                    '<div>In the| affairs of men</div>',
                    'Which taken at the flood',
                '</div>',
            '</div>',
        ].join(''),
        'fontSizeDelta +1px',
        [
            '<div contenteditable style="font-size: 24px; word-wrap: break-word;">',
                '<div><span style="font-size: 25px;">^There is a tide</span>',
                    '<div><span style="font-size: 25px;">In the|</span> affairs of men</div>',
                    'Which taken at the flood',
                '</div>',
            '</div>',
        ].join('')),
        'select characters crossing DIV');

    test(() => assert_selection(
        [
            '<div contenteditable style="font-size: 24px; word-wrap: break-word;">',
                '<div>There is a tide',
                    '<div style="font-size: 30px;"><span style="font-size: 25px">^In the affairs of men|</span></div>',
                    'Which taken at the flood',
                '</div>',
            '</div>',
        ].join(''),
        'fontSizeDelta -1px',
        [
            '<div contenteditable style="font-size: 24px; word-wrap: break-word;">',
                '<div>There is a tide',
                    '<div style="font-size: 29px;"><span style="font-size: 24px;">^In the affairs of men|</span></div>',
                    'Which taken at the flood',
                '</div>',
            '</div>',
        ].join('')),
        'fontSizeDelta affects enclosing block');

    test(() => assert_selection(
        [
            '<div contenteditable style="font-size: 24px; word-wrap: break-word;">',
                '<div>There is a tide',
                    '<div>^In the affairs of men</div>|',
                    'Which taken at the flood',
                '</div>',
            '</div>',
        ].join(''),
        'fontSizeDelta +1px',
        [
            '<div contenteditable style="font-size: 24px; word-wrap: break-word;">',
                '<div>There is a tide',
                    '<div style="font-size: 25px;">^In the affairs of men</div>',
                    '<span style="font-size: 25px;">|Which taken at the flood</span>',
                '</div>',
            '</div>',
        ].join('')),
        'fontSizeDelta affects following characters');
</script>