src/third_party/WebKit/LayoutTests/inspector/elements/styles/styles-source-offsets.html

   1 <html>
   2 <head>
   3
   4 <link rel="stylesheet" href="resources/styles-source-offsets.css">
   5
   6 <script src="../../../http/tests/inspector/inspector-test.js"></script>
   7 <script src="../../../http/tests/inspector/elements-test.js"></script>
   8 <script>
   9
  10 function test()
  11 {
  12     function dumpStyleData(ruleOrStyle)
  13     {
  14         var isRule = !!(ruleOrStyle.style);
  15         var style;
  16         var header = "";
  17         if (isRule) {
  18             if (ruleOrStyle.origin !== "regular")
  19                 return;
  20             style = ruleOrStyle.style;
  21             var selectorRanges = [];
  22             var selectors = ruleOrStyle.selectorList.selectors;
  23             var firstRange = selectors[0].range;
  24             var lastRange = selectors[selectors.length - 1].range;
  25             var range = { startLine: firstRange.startLine, startColumn: firstRange.startColumn, endLine: lastRange.endLine, endColumn: lastRange.endColumn };
  26             header = ruleOrStyle.selectorList.text + ": " + (range ? InspectorTest.rangeText(range) : "");
  27         } else {
  28             style = ruleOrStyle;
  29             header = "element.style:";
  30         }
  31         InspectorTest.addResult(header + " " + InspectorTest.rangeText(style.range));
  32         var allProperties = style.cssProperties;
  33         for (var i = 0; i < allProperties.length; ++i) {
  34             var property = allProperties[i];
  35             if (!property.status)
  36                 continue;
  37             InspectorTest.addResult("['" + property.name + "':'" + property.value + "'" + (property.priority ? " !important" : "") + (("parsedOk" in property) ? " non-parsed" : "") +"] @" + InspectorTest.rangeText(property.range));
  38         }
  39     }
  40
  41     InspectorTest.selectNodeWithId("mainBody", step1);
  42
  43     var resultStyles = {};
  44
  45     function inlineCallback(error, inlineStyle)
  46     {
  47         if (error) {
  48              InspectorTest.addResult("error: " + error);
  49              InspectorTest.completeTest();
  50              return;
  51         }
  52
  53         resultStyles.inlineStyle = inlineStyle;
  54     }
  55
  56     function matchedCallback(error, matchedCSSRules)
  57     {
  58         if (error) {
  59              InspectorTest.addResult("error: " + error);
  60              InspectorTest.completeTest();
  61              return;
  62         }
  63         resultStyles.matchedCSSRules = matchedCSSRules;
  64         step2();
  65     }
  66
  67     function step1(node)
  68     {
  69         CSSAgent.getInlineStylesForNode(node.id, inlineCallback);
  70         CSSAgent.getMatchedStylesForNode(node.id, matchedCallback);
  71     }
  72
  73     function step2()
  74     {
  75         var matchedCSSRules = resultStyles.matchedCSSRules;
  76         for (var i = 0; i < matchedCSSRules.length; ++i)
  77             dumpStyleData(matchedCSSRules[i].rule);
  78         dumpStyleData(resultStyles.inlineStyle);
  79         InspectorTest.completeTest();
  80     }
  81 }
  82
  83 </script>
  84
  85 <style>
  86
  87 body.mainpage {
  88     text-decoration: none; /* at least one valid property is necessary for WebCore to match a rule */
  89     badproperty: 1badvalue1;
  90 }
  91
  92 </style>
  93 </head>
  94
  95 <body id="mainBody" class="main1 main2 mainpage" onload="runTest()" style="font-weight: normal; width: 80%">
  96 <p>
  97 Tests that proper data and start/end offset positions are reported for CSS style declarations and properties.
  98 </p>
  99
 100 </body>
 101 </html>