<!DOCTYPE html>
<html>
<head>
<style>
div {
    border: 1px solid red;
}
#id {
    border: 1px solid blue;
}
.class {
    border: 1px solid black;
}
</style>
</head>

<body>
<span id="copy" style="display:block" contenteditable="true">
This shouldn't have a border.
<div class="class" id="id">This should have blue border when its pasted.</div>
This shouldn't have a border.</span>
<span id="paste" style="display:block" contenteditable="true"></span>

<script src="../../resources/dump-as-markup.js"></script>
<script>
var sel = window.getSelection();
var copy = document.getElementById("copy");
var paste = document.getElementById("paste");

sel.setPosition(copy, 0);
document.execCommand("SelectAll");
document.execCommand("Copy");
var len = document.styleSheets[0].cssRules.length;
for (var i = 0; i < len; i++)
    document.styleSheets[0].deleteRule(0);

sel.setPosition(paste, 0);
document.execCommand("Paste");
Markup.description("This tests copy.  Non-inheritable styles should be brought down from stylesheets.");
Markup.dump(document.getElementById("paste"));
</script>
</body>
</html>