src/third_party/WebKit/LayoutTests/inspector/styles/cached-sync-computed-styles.html

   1 <html>
   2 <head>
   3 <style id="style">
   4 #inspected {
   5     background-color: green;
   6 }
   7 </style>
   8 <script src="../../http/tests/inspector/inspector-test.js"></script>
   9 <script src="../../http/tests/inspector/elements-test.js"></script>
  10 <script>
  11
  12 function updateStyle()
  13 {
  14     document.getElementById("style").textContent = "#inspected { color: red }";
  15 }
  16
  17 function test()
  18 {
  19     WebInspector.showPanel("elements");
  20     InspectorTest.nodeWithId("inspected", step1);
  21     var backendCallCount = 0;
  22     var nodeId;
  23
  24     setTimeout(InspectorTest.completeTest.bind(InspectorTest), 3000);
  25     function onBackendCall(method)
  26     {
  27         if (method === "CSS.getComputedStyleForNode")
  28             ++backendCallCount;
  29     }
  30
  31     function step1(node)
  32     {
  33         var callsLeft = 2;
  34         nodeId = node.id;
  35         InspectorTest.addSniffer(InspectorBackendClass.prototype, "_wrapCallbackAndSendMessageObject", onBackendCall, true);
  36         WebInspector.cssModel.getComputedStyleAsync(nodeId, styleCallback);
  37         WebInspector.cssModel.getComputedStyleAsync(nodeId, styleCallback);
  38         function styleCallback()
  39         {
  40             if (--callsLeft)
  41                 return;
  42             InspectorTest.addResult("# of backend calls sent [2 requests]: " + backendCallCount);
  43             InspectorTest.evaluateInPage("updateStyle()", step2);
  44         }
  45     }
  46
  47     function step2()
  48     {
  49         WebInspector.cssModel.getComputedStyleAsync(nodeId, callback);
  50         function callback()
  51         {
  52             InspectorTest.addResult("# of backend calls sent [style update + another request]: " + backendCallCount);
  53             InspectorTest.completeTest();
  54         }
  55     }
  56 }
  57 </script>
  58 </head>
  59
  60 <body onload="runTest()">
  61 <p>
  62 Tests that computed styles are cached across synchronous requests.
  63 </p>
  64
  65 <div>
  66   <div id="inspected">Test</div>
  67 </div>
  68
  69 </body>
  70 </html>