layout/generic/test/test_overflow_event.html
author L. David Baron <dbaron@dbaron.org>
Sat, 13 Sep 2014 06:17:36 -0700
changeset 228423 c81eb3a1336b2ab5f4e83b8b5df394dfea8be37e
parent 191009 f44d993a20de5675e7bc1b89571a34eccc6d2142
child 374655 7b434711753b98a87603453caaa0945791ffe12b
permissions -rw-r--r--
Bug 977991 patch 1 - Expose variant of RulesMatching on nsHTMLCSSStyleSheet that is less work to call. r=birtles This allows nsStyleSet::RuleNodeWithReplacement to call it without constructing an entire (and unnecessary) ElementRuleProcessorData, which will happen in patch 3.

<!DOCTYPE HTML>
<html>
<head>
  <meta charset="utf-8">
  <title>Test for overflow events</title>
  <script type="application/javascript" src="/tests/SimpleTest/SimpleTest.js"></script>
  <link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css"/>
  <script type="application/javascript">

  SimpleTest.waitForExplicitFinish();

  window.addEventListener("load", function(event) {
      if (event.target == document) {
          test_bug981637();
      }
  }, false);

  /** Test for Bug 981637:  correct overflow event firing in updateOverflow **/

  var overflow_fired = false;
  function overflow_listener(event) {
    overflow_fired = true;
  }

  function test_bug981637() {
    var outerDiv = document.getElementById("bug981637");
    var innerDiv = outerDiv.firstChild;
    innerDiv.offsetWidth; // flush layout
    is(overflow_fired, false, "correct setup");
    outerDiv.addEventListener("overflow", overflow_listener, false);
    innerDiv.style.transform = "scale(1.2)";
    innerDiv.offsetWidth; // flush layout
    // run finish step after the overflow event fires (off the event loop)
    setTimeout(test_bug981637_step2, 0);
  }

  function test_bug981637_step2() {
    is(overflow_fired, true, "overflow event should have fired after updating transform");
    SimpleTest.finish();
  }

  </script>
</head>
<body>
<a target="_blank" href="https://bugzilla.mozilla.org/show_bug.cgi?id=981637">Mozilla Bug 981637</a>
<div id="bug981637" style="overflow: hidden; width: 100px; height: 100px;"><div style="transform: scale(0.8); width: 100px; height: 100px"></div></div>
<pre id="test">
</pre>
</body>
</html>