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