third_party/WebKit/LayoutTests/inspector/elements/edit/set-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 setAttribute(name, value)
   8 {
   9     var node = document.getElementById("node");
  10     node.setAttribute(name, value);
  11 }
  12
  13 function removeAttribute(name)
  14 {
  15     var node = document.getElementById("node");
  16     node.removeAttribute(name);
  17 }
  18
  19 function test()
  20 {
  21     var targetNode;
  22
  23     InspectorTest.runTestSuite([
  24         function testDumpInitial(next)
  25         {
  26             function callback(node)
  27             {
  28                 targetNode = node;
  29                 InspectorTest.addResult("========= Original ========");
  30                 InspectorTest.dumpElementsTree(targetNode);
  31                 next();
  32             }
  33             InspectorTest.selectNodeWithId("node", callback);
  34         },
  35
  36         function testAttributeUpdated(next)
  37         {
  38             function callback()
  39             {
  40                 InspectorTest.domModel.removeEventListener(WebInspector.DOMModel.Events.AttrModified, callback);
  41                 InspectorTest.addResult("===== On attribute set =====");
  42                 InspectorTest.dumpElementsTree(targetNode);
  43                 next();
  44             }
  45             InspectorTest.domModel.addEventListener(WebInspector.DOMModel.Events.AttrModified, callback);
  46             InspectorTest.evaluateInPage("setAttribute('name', 'value')");
  47         },
  48
  49         function testAttributeSameValueNotUpdated(next)
  50         {
  51             function callback()
  52             {
  53                 InspectorTest.addResult("===== On attribute modified (should be 'newValue') =====");
  54                 InspectorTest.dumpElementsTree(targetNode);
  55                 InspectorTest.domModel.removeEventListener(WebInspector.DOMModel.Events.AttrModified, callback);
  56                 next();
  57             }
  58             InspectorTest.domModel.addEventListener(WebInspector.DOMModel.Events.AttrModified, callback);
  59             // Setting the same property value should not result in the AttrModified event.
  60             InspectorTest.evaluateInPage("setAttribute('name', 'value')");
  61             InspectorTest.evaluateInPage("setAttribute('name', 'value')");
  62             InspectorTest.evaluateInPage("setAttribute('name', 'newValue')");
  63         },
  64
  65         function testAttributeRemoved(next)
  66         {
  67             function callback()
  68             {
  69                 InspectorTest.domModel.removeEventListener(WebInspector.DOMModel.Events.AttrRemoved, callback);
  70                 InspectorTest.addResult("=== On attribute removed ===");
  71                 InspectorTest.dumpElementsTree(targetNode);
  72                 next();
  73             }
  74             InspectorTest.domModel.addEventListener(WebInspector.DOMModel.Events.AttrRemoved, callback);
  75             InspectorTest.evaluateInPage("removeAttribute('name')");
  76         },
  77
  78         function testSetAttributeValue(next)
  79         {
  80             function callback()
  81             {
  82                 InspectorTest.domModel.removeEventListener(WebInspector.DOMModel.Events.AttrModified, callback);
  83                 InspectorTest.addResult("=== Set attribute value ===");
  84                 InspectorTest.dumpElementsTree(targetNode);
  85                 next();
  86             }
  87             InspectorTest.domModel.addEventListener(WebInspector.DOMModel.Events.AttrModified, callback);
  88             targetNode.setAttributeValue("foo", "bar");
  89         },
  90
  91         function testSetAttributeText(next)
  92         {
  93             function callback()
  94             {
  95                 InspectorTest.domModel.removeEventListener(WebInspector.DOMModel.Events.AttrRemoved, callback);
  96                 InspectorTest.addResult("=== Set attribute as text ===");
  97                 InspectorTest.dumpElementsTree(targetNode);
  98                 next();
  99             }
 100             InspectorTest.domModel.addEventListener(WebInspector.DOMModel.Events.AttrRemoved, callback);
 101             targetNode.setAttribute("foo", "foo2='baz2' foo3='baz3'");
 102         },
 103
 104         function testRemoveAttributeAsText(next)
 105         {
 106             function callback()
 107             {
 108                 InspectorTest.domModel.removeEventListener(WebInspector.DOMModel.Events.AttrRemoved, callback);
 109                 InspectorTest.addResult("=== Remove attribute as text ===");
 110                 InspectorTest.dumpElementsTree(targetNode);
 111                 next();
 112             }
 113             InspectorTest.domModel.addEventListener(WebInspector.DOMModel.Events.AttrRemoved, callback);
 114             targetNode.setAttribute("foo3", "");
 115         },
 116
 117         function testSetMalformedAttributeText(next)
 118         {
 119             function callback(error)
 120             {
 121                 InspectorTest.addResult("Error: " + error);
 122                 InspectorTest.domModel.removeEventListener(WebInspector.DOMModel.Events.AttrModified, callback);
 123                 InspectorTest.addResult("=== Set malformed attribute as text ===");
 124                 InspectorTest.dumpElementsTree(targetNode);
 125                 next();
 126             }
 127             targetNode.setAttribute("foo2", "foo2='missingquote", callback);
 128         }
 129     ]);
 130 }
 131
 132 </script>
 133 </head>
 134
 135 <body onload="runTest()">
 136 <p>
 137 Tests that elements panel updates dom tree structure upon setting attribute.
 138 </p>
 139
 140 <div id="node"></div>
 141
 142 </body>
 143 </html>