layout/reftests/details-summary/mouse-click-move-summary-to-different-details.html

   1 <!DOCTYPE html>
   2 <!-- Any copyright is dedicated to the Public Domain.
   3    - http://creativecommons.org/publicdomain/zero/1.0/ -->
   4
   5 <html class="reftest-wait">
   6   <script>
   7   function runTest() {
   8     // Both Chrome and Safari do not add the 'open' attribute to details1
   9     // element, but Firefox does add 'open' to details1 since summary2 had been
  10     // moved to details1 before receiving the 'click' event.
  11     var details1 = document.getElementById("details1");
  12     var summary2 = document.getElementById("summary2");
  13
  14     document.body.addEventListener("click", function () {
  15       // Move summary2 into details1 at capture phase, and summary2 will be the
  16       // main summary of details1 at target phase.
  17       details1.insertBefore(summary2, details1.children[0]);
  18     }, true);
  19
  20     summary2.dispatchEvent(new MouseEvent("click"));
  21
  22     document.documentElement.removeAttribute("class");
  23   }
  24   </script>
  25   <body onload="runTest();">
  26     <details id="details1">
  27       <summary id="summary1">Summary 1</summary>
  28       <p>This is the details 1.</p>
  29     </details>
  30     <details>
  31       <summary id="summary2">Summary 2</summary>
  32       <p>This is the details 2.</p>
  33     </details>
  34   </body>
  35 </html>