third_party/WebKit/LayoutTests/fast/css/dynamic-class-backdrop-pseudo.html

   1 <!DOCTYPE html>
   2 <script src="../../resources/js-test.js"></script>
   3 <style>
   4 .a .b::backdrop { background-color: green; }
   5 </style>
   6 <div id="t">
   7     <dialog class="b" id="dialog"><span></span><span></span><span></span></dialog>
   8 </div>
   9 <script>
  10 description("Change class affecting ::backdrop style");
  11
  12 var dialog = document.getElementById("dialog");
  13
  14 dialog.showModal();
  15
  16 var green = 'rgb(0, 128, 0)';
  17
  18 shouldNotBe("getComputedStyle(dialog, '::backdrop').backgroundColor", "green");
  19
  20 document.body.offsetLeft;
  21 document.getElementById("t").className = "a";
  22
  23 if (window.internals)
  24     shouldBe("internals.updateStyleAndReturnAffectedElementCount()", "2");
  25
  26 shouldBe("getComputedStyle(dialog, '::backdrop').backgroundColor", "green");
  27
  28 dialog.close();
  29 </script>