<!DOCTYPE html>
<html>
<head>
<style type="text/css">
.NonInheritableProperties {
background-color: yellow;
text-decoration: underline;
}
</style>
</head>
<body>
<div id="test" contenteditable="true">
<div>foo</div>
<span id="spanToMerge" class="NonInheritableProperties">bar</span>
</div>
<script src="../../resources/dump-as-markup.js"></script>
<script>
Markup.description('The span style should be preserved when merging div element.\n'
+ 'The test passes if "bar" contatins the yellow background and it\'s underlined.');

var spanToMerge = document.getElementById("spanToMerge");
spanToMerge.focus();
getSelection().collapse(spanToMerge, 0);
document.execCommand("Delete");
Markup.dump(document.getElementById("test"));
</script>
</body>
</html>