<style>
div {
  overflow:scroll;
  position:absolute;
}

.box {
  display:block;
  background-color:green;
  width:100px;
  height:100px;
}
</style>

<body>
Test that scrollbar width is added to the intrinsic width of different display types.
<div style="top: 100px" data-expected-width=100 data-expected-height=100><span class="box"></span></div>
<div style="display: -webkit-box; top:100px; left: 150px;" data-expected-width=100 data-expected-height=100><span class="box"></span></div>

<script src="../../resources/check-layout.js"></script>
<script>
var dummy = document.createElement('h1');
dummy.style.overflow = 'scroll';
document.body.appendChild(dummy);
var scrollbarWidth = dummy.offsetWidth - dummy.clientWidth;
document.body.removeChild(dummy);

Array.prototype.forEach.call(document.querySelectorAll('div'), function(node) {
    node.setAttribute('data-expected-width', 100 + scrollbarWidth);
    node.setAttribute('data-expected-height', 100 + scrollbarWidth);
});
checkLayout('body');
</script>
</body>