dynamic-grow-width-and-height.html

Enable keyboard shortcuts

<!DOCTYPE html>

<!--

  `reftest-snapshot-all` is necessary to take the screenshot for whole canvas

  when zoom level is changed.

  This is the same as what we do in the case where reftest-async-zoom is

  specified.

-->

<html class="reftest-wait reftest-snapshot-all">

<meta name="viewport" content="width=device-width, minimum-scale=0.5">

<style>

html {

  overflow-x: hidden;

  scrollbar-width: none;

html, body {

  margin: 0;

  width: 100%;

  height: 100%;

div {

  position: absolute;

</style>

<div id="green" style="background: green; width: 100%; height: 100%;"></div>

<div style="background: blue; width: 100%; height: 100%;"></div>

<script>

document.addEventListener('MozReftestInvalidate', () => {

  green.style.width = '200%';

  requestAnimationFrame(() => {

    // At this moment we don't scale down the contents due to bug 1508177.

    green.style.height = '200%';

    requestAnimationFrame(() => {

      // Growing height should make the overflow-x:hidden area visible.

      document.documentElement.classList.remove('reftest-wait');

});

});

});

</script>

</html>