third_party/WebKit/LayoutTests/inspector-protocol/css/css-create-stylesheet-and-add-rule.html

   1 <html>
   2 <head>
   3 <script type="text/javascript" src="../../http/tests/inspector-protocol/inspector-protocol-test.js"></script>
   4 <script type="text/javascript" src="../../http/tests/inspector-protocol/css-protocol-test.js"></script>
   5 <script type="text/javascript" src="../../http/tests/inspector-protocol/dom-protocol-test.js"></script>
   6 <link rel="stylesheet" type="text/css" href="resources/stylesheet.css"></link>
   7 <script type="text/javascript">
   8 function test()
   9 {
  10     var frameId;
  11     var styleSheetHeader;
  12     var documentNodeId;
  13
  14     InspectorTest.requestDocumentNodeId(onDocumentNodeId);
  15
  16     function onDocumentNodeId(nodeId)
  17     {
  18         documentNodeId = nodeId;
  19         InspectorTest.requestMainFrameId(step2);
  20     }
  21
  22     function step2(mainFrameId)
  23     {
  24         frameId = mainFrameId;
  25         InspectorTest.eventHandler["CSS.styleSheetAdded"] = styleSheetAdded;
  26         InspectorTest.sendCommandOrDie("CSS.enable", {}, function() {})
  27     }
  28
  29     function styleSheetAdded(response)
  30     {
  31         var header = response.params.header;
  32         var urlString = header.sourceURL ? " (" + InspectorTest.displayName(header.sourceURL) + ")" : "";
  33         InspectorTest.log("Style sheet added: " + header.origin + urlString);
  34         if (styleSheetHeader)
  35             return;
  36
  37         styleSheetHeader = header;
  38         InspectorTest.loadAndDumpMatchingRules(documentNodeId, "#inspected", step3);
  39     }
  40
  41     function step3()
  42     {
  43         InspectorTest.log("Adding a rule to the existing stylesheet.");
  44         InspectorTest.addRule(styleSheetHeader.styleSheetId, false, {
  45             location: { startLine: 0, startColumn: 0, endLine: 0, endColumn: 0 },
  46             ruleText: "#inspected {}",
  47         }, step4);
  48     }
  49
  50     function step4()
  51     {
  52         InspectorTest.loadAndDumpMatchingRules(documentNodeId, "#inspected", step5);
  53     }
  54
  55     function step5()
  56     {
  57         InspectorTest.log("Creating inspector stylesheet.");
  58         InspectorTest.sendCommandOrDie("CSS.createStyleSheet", { frameId: frameId }, step6);
  59     }
  60
  61     function step6(result)
  62     {
  63         InspectorTest.log("Adding a rule to the inspector stylesheet.");
  64         InspectorTest.addRule(result.styleSheetId, false, {
  65             location: { startLine: 0, startColumn: 0, endLine: 0, endColumn: 0 },
  66             ruleText: "#inspected {}",
  67         }, step7);
  68     }
  69
  70     function step7()
  71     {
  72         InspectorTest.loadAndDumpMatchingRules(documentNodeId, "#inspected", step8);
  73     }
  74
  75     function step8()
  76     {
  77         InspectorTest.completeTest();
  78     }
  79 };
  80
  81 window.addEventListener("DOMContentLoaded", function () {
  82     runTest();
  83 }, false);
  84
  85 </script>
  86 </head>
  87 <body>
  88 <div id="inspected">Inspected contents</div>
  89 </body>
  90 </html>