OffsetHeight not calculated properly #124
Description
Running version 2.36.0.
When I build an HTMLUnit page using the following HTML, the offsetHeight is not properly calculated. It resolves to the height of the inner "title-sizer" element, rather than the full height rendered by the long text in the "title" element.
This code works correctly in the Chrome browser when opened from an .html file.
<!DOCTYPE html>
<html>
<head>
<title>ESS Template Generator</title>
<meta charset="UTF-8" content="" />
<style>
.title-box {
position: absolute;
top: 430px;
left: 75px;
width: 960px;
margin-top: 6px;
font-size: 60px;
}
.title-sizer {
height: 300px;
}
</style>
</head>
<body>
<div class="title-box">
<span class="title-sizer"
><span class="title"
>8oz steak from Good and Gather. 8oz steak from Good and Gather. 8oz
steak from Good and Gather. 8oz steak from Good and Gather. 8oz steak
from Good and Gather. 8oz steak from Good and Gather. 8oz steak from
Good and Gather. 8oz steak from Good and Gather.</span
></span
>
</div>
</body>
<script>
function getAttributeValue(element, attribute) {
if (element) {
return window.getComputedStyle(element)[attribute].split("px")[0];
}
return 0;
}
var titleBox = document.querySelector(".title-sizer");
var title = document.querySelector(".title");
if (titleBox) {
var titleHeight = titleBox.offsetHeight;
alert(titleHeight);
var titleFontSize = getAttributeValue(titleBox, "fontSize");
var titleHeightGoal = getAttributeValue(titleBox, "height");
while (titleHeight > titleHeightGoal) {
titleFontSize -= 1;
if (title) {
title.style.fontSize = titleFontSize + "px";
}
titleHeight = titleBox.offsetHeight;
}
}
</script>
</html>