<!DOCTYPE html>
<script src="../../resources/testharness.js"></script>
<script src="../../resources/testharnessreport.js"></script>
<style>
#div1, #div2 {
height: 200px;
width: 200px;
border: 1px solid black;
}
#div2 {
text-align: center;
}
div:before {
content: "Test";
}
</style>
<div id="div1" contenteditable="true"></div>
<div id="div2" contenteditable="true"></div>
<script>
test (function() {
var div1 = document.getElementById('div1');
div1.focus();
var caretRect1 = internals.absoluteCaretBounds(document);
var div2 = document.getElementById('div2');
div2.focus();
var caretRect2 = internals.absoluteCaretBounds(document);
assert_not_equals(caretRect1.left, caretRect2.left);
}, "Tests if the cursor respects text align property in emtpy div having pseudo content");
</script>