<!DOCTYPE html>
<script src="../../resources/js-test.js"></script>
<script src="../../resources/run-after-layout-and-paint.js"></script>
<style>
#anchor {
display: none;
position: absolute;
width: 60px;
height: 30px;
background-color: #eee;
font: bold 10pt monospace;
padding: 10px;
left: 50vw;
top: 200vh;
}
</style>
<a id="anchor" name="foo">ANCHOR</a>
<script>
description("Tests that the scroll position does not stick to the anchor if " +
"it becomes visible after the page has finished loading.");
var jsTestIsAsync = true;
var anchor = document.querySelector("#anchor");
onhashchange = function() {
if (location.hash != '#foo')
return;
runAfterLayoutAndPaint(function() {
anchor.style.display = 'block';
runAfterLayoutAndPaint(function() {
shouldBe("scrollY", "0");
location.hash = "#";
anchor.style.display = 'none';
finishJSTest();
});
});
};
onload = function() {
runAfterLayoutAndPaint(function() {
location.hash = "#foo";
});
};
</script>