src/third_party/WebKit/LayoutTests/inspector/elements/styles/add-new-rule-with-style-after-body.html

   1 <html>
   2 <head>
   3 <script src="../../../http/tests/inspector/inspector-test.js"></script>
   4 <script src="../../../http/tests/inspector/elements-test.js"></script>
   5 <script>
   6 function addStyle()
   7 {
   8     var style = document.createElement("style");
   9     document.documentElement.appendChild(style);
  10     style.sheet.insertRule("foo {display: none;}", 0);
  11 }
  12
  13 function test()
  14 {
  15     WebInspector.showPanel("elements");
  16     InspectorTest.evaluateInPage("addStyle()", step0);
  17
  18     function step0()
  19     {
  20         InspectorTest.selectNodeAndWaitForStyles("inspected", step1);
  21     }
  22
  23     var treeElement;
  24     var hasResourceChanged;
  25
  26     function step1()
  27     {
  28         // Click "Add new rule".
  29         document.getElementById("add-style-button-test-id").click();
  30         var section = WebInspector.panels.elements.sidebarPanes.styles.sections[0][2];
  31         section._selectorElement.textContent = "inspected";
  32         section._selectorElement.dispatchEvent(InspectorTest.createKeyEvent("Enter"));
  33         InspectorTest.runAfterPendingDispatches(step2);
  34     }
  35
  36     function step2()
  37     {
  38         var section = WebInspector.panels.elements.sidebarPanes.styles.sections[0][2];
  39         var newProperty = section.addNewBlankProperty();
  40         newProperty.startEditing();
  41         newProperty.nameElement.textContent = "color";
  42         newProperty.nameElement.dispatchEvent(InspectorTest.createKeyEvent("Enter"));
  43         newProperty.valueElement.textContent = "maroon";
  44         newProperty.valueElement.dispatchEvent(InspectorTest.createKeyEvent("Enter"));
  45         InspectorTest.waitForStyles("inspected", step3);
  46     }
  47
  48     function step3()
  49     {
  50         InspectorTest.addResult("After adding new rule:");
  51         InspectorTest.dumpSelectedElementStyles(true, false, true);
  52         InspectorTest.completeTest();
  53     }
  54 }
  55
  56 </script>
  57 </head>
  58
  59 <body onload="runTest()">
  60 <p>
  61 Tests that adding a new rule works when there is a STYLE element after BODY. TIMEOUT SHOULD NOT OCCUR! <a href="https://bugs.webkit.org/show_bug.cgi?id=111299">Bug 111299</a>
  62 </p>
  63
  64 <div id="inspected" style="font-size: 12px">Text</div>
  65
  66 </body>
  67 </html>