<!DOCTYPE html>
<html>
<body>
<p id="description">This tests copying and pasting a p element into another p element doesn't end up in a nested p elements.</p>
<div id="editor" style="border: 1px solid black;" contenteditable>
<p style="font-size: 12px; color: blue;"><span id="source">Copy this line</span></p>
<p style="font-size: 12px;"><strong>Paste it below in the empty line below. The font size should be 12px and the text should be in blue.</strong></p>
<p style="font-size: 12px; color: blue;"><br></p>
</div>
<script src="../../resources/dump-as-markup.js"></script>
<script>

var source = document.getElementById('source');
getSelection().collapse(source, 0);
getSelection().modify('extend', 'forward', 'lineboundary');
getSelection().modify('extend', 'forward', 'character');

function serializeAndParseInnerHTML() {
    var editor = document.getElementById('editor');
    editor.innerHTML = editor.innerHTML;
}

if (document.queryCommandEnabled('copy')) {
    Markup.description(document.getElementById('description').textContent);

    document.execCommand('Copy', false, null);
    getSelection().collapse(document.querySelector('br').parentNode, 0);
    document.execCommand('Paste', false, null);

    Markup.dump('editor', 'After paste');

    serializeAndParseInnerHTML();

    Markup.dump('editor', 'After innerHTML = innerHTML');
} else {
    document.onpaste = function () { setTimeout(serializeAndParseInnerHTML); }
    Markup.noAutoDump();
}

</script>
</body>
</html>