src/third_party/WebKit/LayoutTests/inspector/styles/css-live-edit.html

   1 <html>
   2 <head>
   3 <script src="../../http/tests/inspector/inspector-test.js"></script>
   4 <script src="../../http/tests/inspector/elements-test.js"></script>
   5 <script src="../../http/tests/inspector/live-edit-test.js"></script>
   6 <script src="../../http/tests/inspector/debugger-test.js"></script>
   7 <link rel="stylesheet" href="resources/css-live-edit.css">
   8 <div id=foo></div>
   9 <script>
  10
  11 function test()
  12 {
  13     WebInspector.showPanel("sources");
  14
  15     InspectorTest.runTestSuite([
  16         function testLiveEdit(next)
  17         {
  18             InspectorTest.showScriptSource("css-live-edit.css", didShowResource);
  19
  20             function didShowResource(sourceFrame)
  21             {
  22                 InspectorTest.addSniffer(WebInspector.CSSStyleModel.prototype, "_fireStyleSheetChanged", didEditResource);
  23                 InspectorTest.replaceInSource(sourceFrame, "font-size: 12px;", "font-size: 20px;");
  24             }
  25
  26             function didEditResource()
  27             {
  28                 InspectorTest.selectNodeAndWaitForStylesWithComputed("foo", didSelectElement);
  29             }
  30
  31             function didSelectElement()
  32             {
  33                 InspectorTest.dumpSelectedElementStyles(false, true);
  34                 next();
  35             }
  36         }
  37     ]);
  38 };
  39
  40 </script>
  41
  42 </head>
  43
  44 <body onload="runTest()">
  45 <p>Tests that styles are updated when live-editing css resource.</p>
  46
  47 </body>
  48 </html>