third_party/WebKit/LayoutTests/dialog/removed-element-is-removed-from-top-layer.html

   1 <!DOCTYPE html>
   2 <html>
   3 <head>
   4 <style>
   5 dialog {
   6     height: 100px;
   7     width: 100px;
   8 }
   9
  10 ::backdrop {
  11     display: none;
  12 }
  13
  14 #bottomDialog {
  15     background-color: blue;
  16     top: 100px;
  17 }
  18
  19 #topDialog {
  20     background-color: green;
  21     top: 150px;
  22     left: 50px;
  23 }
  24 </style>
  25 </head>
  26 <body>
  27 <p>Bug <a href="https://bugs.webkit.org/show_bug.cgi?id=105489">105489</a>: Elements must be reattached when inserted/removed from top layer
  28 <p>The test passes if you see a green rectangle stacked on top of a blue rectangle.
  29 <dialog id="bottomDialog"></dialog>
  30 <dialog id="topDialog"></dialog>
  31 <script>
  32 document.getElementById('topDialog').showModal();
  33 var bottomDialog = document.getElementById('bottomDialog');
  34 bottomDialog.showModal();
  35 bottomDialog.offsetTop;  // force a layout
  36 var parent = bottomDialog.parentNode;
  37 parent.removeChild(bottomDialog);
  38 parent.appendChild(bottomDialog);
  39 </script>
  40 </body>
  41 </html>
  42