third_party/WebKit/LayoutTests/inspector/elements/edit/edit-style-attribute.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>
   6
   7 function testSetNewValue()
   8 {
   9     document.getElementById("node-set-new-value").style.setProperty("color", "blue");
  10 }
  11
  12 function testSetSameValue()
  13 {
  14     document.getElementById("node-set-same-value").style.setProperty("color", "red");
  15 }
  16
  17 function test()
  18 {
  19     // Save time on style updates.
  20     WebInspector.StylesSidebarPane.prototype.update = function() {};
  21     WebInspector.MetricsSidebarPane.prototype.update = function() {};
  22
  23     InspectorTest.runTestSuite([
  24         function testSetUp(next)
  25         {
  26             InspectorTest.expandElementsTree(next);
  27         },
  28
  29         function testSetNewValue(next)
  30         {
  31             InspectorTest.evaluateInPage("testSetNewValue()");
  32
  33             InspectorTest.domModel.addEventListener(WebInspector.DOMModel.Events.AttrModified, listener);
  34             function listener(event)
  35             {
  36                 InspectorTest.addResult("WebInspector.DOMModel.Events.AttrModified should be issued");
  37                 InspectorTest.domModel.removeEventListener(WebInspector.DOMModel.Events.AttrModified, listener);
  38                 next();
  39             }
  40         },
  41
  42         function testSetSameValue(next)
  43         {
  44             InspectorTest.evaluateInPage("testSetSameValue()", next);
  45
  46             InspectorTest.domModel.addEventListener(WebInspector.DOMModel.Events.AttrModified, listener);
  47             function listener(event)
  48             {
  49                 InspectorTest.addResult("WebInspector.DOMModel.Events.AttrModified should not be issued");
  50                 InspectorTest.domModel.removeEventListener(WebInspector.DOMModel.Events.AttrModified, listener);
  51             }
  52         }
  53     ]);
  54 }
  55
  56 </script>
  57 </head>
  58
  59 <body onload="runTest()">
  60 <p>
  61 Tests that style modification generates attribute updated event only when attribute is actually changed.
  62 </p>
  63
  64 <div id="container">
  65     <div id="node-set-new-value" style="color:red"></div>
  66     <div id="node-set-same-value" style="color:red"></div>
  67 </div>
  68 </body>
  69 </html>