mouse-click-move-summary-to-different-details.html (1199B)
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>