viewport-percentage-height-with-dynamic-container-height.html

<!DOCTYPE html>
<script>
window.onload = function() {
    if (!window.testRunner)
        return;
    // Move the resizer 400 pixels down.
    eventSender.mouseMoveTo(100, 400);
    eventSender.mouseDown();
    eventSender.mouseMoveTo(100, 200);
    eventSender.mouseUp();
};
</script>
<frameset rows="400px,*">
<frame src='data:text/html,
<!DOCTYPE html>
<style>
img {
    height: 5vh;
}
</style>
<div id="container">
    <!-- 100x50 green square -->
    <img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAGQAAAAyCAYAAACqNX6+AAAABmJLR0QA/wD/AP+gvaeTAAAAj0lEQVR4nO3RQQ0AIBDAsAP/nuGNAvZoFSzZmjNnyNi/A3gZEmNIjCExhsQYEmNIjCExhsQYEmNIjCExhsQYEmNIjCExhsQYEmNIjCExhsQYEmNIjCExhsQYEmNIjCExhsQYEmNIjCExhsQYEmNIjCExhsQYEmNIjCExhsQYEmNIjCExhsQYEmNIjCExhsRcpb0CYiXEAt8AAAAASUVORK5CYII=">
</div>
'></frame>
<frame src=""></frame>
</frameset>
</html>

chromium/third_party/blink/web_tests/fast/replaced/viewport-percentage-height-with-dynamic-container-height.html