<!DOCTYPE html>
<style>
#content {
height: 2000px;
width: 2000px;
}
</style>
<div id='console'></div>
<div id='content'></div>
<script src="../../resources/js-test.js"></script>
<script>
jsTestIsAsync = true;
setPrintTestResultsLazily();
description('Test ensures that frame scroll position is only restored during ' +
'the navigation process but does not occur after navigation is ' +
'complete for same document navigations.');
window.scrollTo(100, 100);
history.pushState(null, null, '#test');
window.addEventListener('hashchange', _ => {
// after back navigation scroll position should be restored to 100,100.
debug('Verify that scroll position restored correctly during navigation.');
shouldBe('document.scrollingElement.scrollLeft', '100');
shouldBe('document.scrollingElement.scrollTop', '100');
// trigger a content size change that should cause the scroll position
// to get clamped to 0,0.
document.getElementById('content').style.display = 'none';
shouldBe('document.scrollingElement.scrollLeft', '0');
shouldBe('document.scrollingElement.scrollTop', '0');
// trigger another content size change and verify that scroll position is
// not restored.
debug('Verify that scroll position is not restored again after navigation is complete.');
document.getElementById('content').style.display = 'block';
shouldBe('document.scrollingElement.scrollLeft', '0');
shouldBe('document.scrollingElement.scrollTop', '0');
finishJSTest();
});
setTimeout(_ => {
window.scrollTo(0, 0);
shouldBe('document.scrollingElement.scrollLeft', '0');
shouldBe('document.scrollingElement.scrollTop', '0');
history.back();
}, 0);
</script>