blob: 0a974e9d6360c3135366944a0f9f17f5beccc7fe [file] [log] [blame]
<!DOCTYPE html>
<script src="../../resources/testharness.js"></script>
<script src="../../resources/testharnessreport.js"></script>
<style>
#container {
font: 10px/1;
}
</style>
<div id=log></div>
<div id=container>
<div>
<div>before</div>
<div><span></span></div>
<div>after</div>
</div>
<div>
<div>before</div>
<div><span style="margin-bottom:1px"></span></div>
<div>after</div>
</div>
<div>
<div>before</div>
<div><span style="border-bottom:1px solid"></span></div>
<div>after</div>
</div>
<div>
<div>before</div>
<div><span style="padding-bottom:1px"></span></div>
<div>after</div>
</div>
<div data-has-height=true>
<div>before</div>
<div><span style="margin-left:1px"></span></div>
<div>after</div>
</div>
<div data-has-height=true>
<div>before</div>
<div><span style="border-left:1px solid"></span></div>
<div>after</div>
</div>
<div data-has-height=true>
<div>before</div>
<div><span style="padding-left:1px"></span></div>
<div>after</div>
</div>
<div data-has-height=true>
<div>before</div>
<div><span style="margin-right:1px"></span></div>
<div>after</div>
</div>
<div data-has-height=true>
<div>before</div>
<div><span style="border-right:1px solid"></span></div>
<div>after</div>
</div>
<div data-has-height=true>
<div>before</div>
<div><span style="padding-right:1px"></span></div>
<div>after</div>
</div>
<div data-has-height=true>
<div>before</div>
<div><span style="margin-left:-1px"></span></div>
<div>after</div>
</div>
<div data-has-height=true>
<div>before</div>
<div><span style="margin-right:-1px"></span></div>
<div>after</div>
</div>
<div data-has-height=true>
<div>before</div>
<div><span style="margin-left:1px;margin-right:-1px"></span></div>
<div>after</div>
</div>
<div data-has-height=true>
<div>before</div>
<div><span style="margin-left:-1px;border-left:1px solid"></span></div>
<div>after</div>
</div>
<div data-has-height=true>
<div>before</div>
<div><span style="margin-left:-1px;padding-left:1px"></span></div>
<div>after</div>
</div>
<div data-has-height=true>
<div>before</div>
<div><span style="margin-right:-1px;border-right:1px solid"></span></div>
<div>after</div>
</div>
<div data-has-height=true>
<div>before</div>
<div><span style="margin-right:-1px;padding-right:1px"></span></div>
<div>after</div>
</div>
<div data-has-height=true>
<div>before</div>
<div><span style="margin-right:1px"></span><span style="margin-left:-1px"></span></div>
<div>after</div>
</div>
</div>
<script>
let tests = container.children;
for (let i = 0; i < tests.length; i++) {
let block = tests[i];
let target = block.children[1];
let name = (block.dataset.hasHeight ? "Has height" : "Zero height") +
" when " + target.innerHTML;
test(() => {
let has_height = target.offsetHeight > 0;
assert_equals(has_height, !!block.dataset.hasHeight);
}, name);
}
</script>