LayoutTests/inspector/styles/styles-computed-trace.html

   1 <html>
   2 <head>
   3 <style>
   4 body {
   5     background-color: rgb(100, 0, 0);
   6     font-family: Arial;
   7 }
   8
   9 div {
  10     text-decoration: underline;
  11 }
  12
  13 #id1 {
  14     background-color: green;
  15     font-family: Times;
  16 }
  17
  18 #id1 {
  19     background-color: black;
  20     font-family: Courier;
  21 }
  22
  23 #id1 {
  24     background: gray;
  25 }
  26
  27 #id2 {
  28     background-color: blue;
  29     font-family: Courier;
  30     text-decoration: invalidvalue;
  31 }
  32
  33 </style>
  34 <script src="../../http/tests/inspector/inspector-test.js"></script>
  35 <script src="../../http/tests/inspector/elements-test.js"></script>
  36 <script>
  37
  38 function test()
  39 {
  40     InspectorTest.selectNodeAndWaitForStylesWithComputed("id1", step1);
  41
  42     function step1()
  43     {
  44         InspectorTest.addResult("==== Computed style for ID1 ====");
  45         InspectorTest.dumpSelectedElementStyles(false, true);
  46         InspectorTest.selectNodeAndWaitForStylesWithComputed("id2", step2);
  47     }
  48
  49     function step2()
  50     {
  51         InspectorTest.addResult("==== Computed style for ID2 ====");
  52         InspectorTest.dumpSelectedElementStyles(false, true);
  53         InspectorTest.selectNodeAndWaitForStylesWithComputed("id3", step3);
  54     }
  55
  56     function step3()
  57     {
  58         InspectorTest.addResult("==== Style for ID3 ====");
  59         // The button[hidden] style specifies "display: none", which should not be /-- overloaded --/.
  60         InspectorTest.dumpSelectedElementStyles(true, true);
  61         InspectorTest.completeTest();
  62     }
  63
  64 }
  65 </script>
  66 </head>
  67
  68 <body onload="runTest()">
  69 <p>
  70 Tests that computed styles expand and allow tracing to style rules.
  71 </p>
  72
  73 <div id="id1">
  74 <div id="id2">
  75 </div>
  76 <button id="id3" hidden />
  77 </div>
  78
  79 </body>
  80 </html>