<html> 
<head>
<style>
.editing { 
    border: 2px solid red; 
    padding: 12px; 
    font-size: 24px; 
}
p {
    margin: 0;
}
</style>
<script src="../editing.js"></script>
<script src="../../resources/dump-as-markup.js"></script>
<title>Editing Test</title> 
</head> 
<body contenteditable>
<div id="root">
<div id="test" class="editing"><p>foo</p><p>bar</p></div>
</div>
<script>

window.getSelection().setPosition(document.getElementById('test'), 0);

for (i = 0; i < 7; i++)
    extendSelectionForwardByCharacterCommand();
copyCommand();
selectAllCommand();
deleteCommand();
pasteCommand();
insertParagraphCommand();
pasteCommand();

Markup.description('This test copies, deletes, and paste back <div id="test" class="editing"><p>foo</p><p>bar</p></div>\n'
 + 'It then inserts the paragraph and pastes the contents again.');
Markup.dump('root');

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