collapsed-whitespace-reattach-in-style-recalc.html

<!DOCTYPE html>
<html>
<head>
<style>
div {
    text-align: justify;
}

.inlineBlock {
    display: inline-block;
}

span {
    display: block;
}

div:after {
    content: '';
    display: inline-block;
    width: 100%;
}

</style>
<script src="../../resources/js-test.js"></script>
<script>
description('This test ensures that we properly reattach collapsed whitespace when sibling style changes require. Test passes if the spans below are justified across the page.');
onload = function() {
    spans = document.getElementsByTagName("span");
    for (var i = spans.length - 1; i >= 0; i--)
        spans[i].classList.add('inlineBlock');
    shouldBeGreaterThanOrEqual('spans[spans.length - 1].offsetLeft', "400");
}
</script>
</head>
<body>
<div id="container">
    <span>Item 1</span>
    <span>Item 2</span>
    <span>Item 3</span>
</div>

chromium/third_party/blink/web_tests/fast/css/collapsed-whitespace-reattach-in-style-recalc.html