third_party/WebKit/LayoutTests/fast/table/caption-in-inline.html

<!DOCTYPE html>
<script src="../../resources/js-test.js"></script>
<p>Test that a table-caption with a table-cell sibling is wrapped inside an inline-table when the parent is inline.</p>
<span>
    <div id="first" style="display:table-caption; width:100%; height:40px; background:blue;">&nbsp;</div>
    <div id="second" style="display:table-cell; width:80px; height:40px; background:blue;">&nbsp;</div>
    <span id="last">There should be a blue square to the left of this line.</span>
</span>
<div id="console"></div>
<script>
    var firstRects = document.getElementById('first').getClientRects();
    var secondRects = document.getElementById('second').getClientRects();
    var lastRects = document.getElementById('last').getClientRects();
    shouldBe("firstRects.length", "1");
    shouldBe("secondRects.length", "1");
    shouldBe("lastRects.length", "1");
    shouldBe("secondRects[0].top", "firstRects[0].top + 40");
    shouldBe("secondRects[0].left", "firstRects[0].left");
    shouldBe("secondRects[0].bottom", "secondRects[0].top + 40");
    shouldBeGreaterThanOrEqual("lastRects[0].right", "secondRects[0].left");
    shouldBeGreaterThanOrEqual("lastRects[0].top", "firstRects[0].top");
    shouldBeGreaterThanOrEqual("secondRects[0].bottom", "lastRects[0].bottom");
</script>