2011-02-15 Pavel Feldman <pfeldman@chromium.org>
authorpfeldman@chromium.org <pfeldman@chromium.org@268f45cc-cd09-0410-ab3c-d52691b4dbfc>
Tue, 15 Feb 2011 17:41:11 +0000 (17:41 +0000)
committerpfeldman@chromium.org <pfeldman@chromium.org@268f45cc-cd09-0410-ab3c-d52691b4dbfc>
Tue, 15 Feb 2011 17:41:11 +0000 (17:41 +0000)
        Reviewed by Yury Semikhatsky.

        Web Inspector: implement DOM agent tests.
        https://bugs.webkit.org/show_bug.cgi?id=54459

        * http/tests/inspector/elements-test.js:
        (initialize_ElementTest.InspectorTest.expandedNodeWithId.callback):
        (initialize_ElementTest.InspectorTest.expandedNodeWithId):
        (initialize_ElementTest.InspectorTest.dumpElementsTree):
        (initialize_ElementTest.InspectorTest.dumpElementsTree.print):
        (initialize_ElementTest.InspectorTest.expandElementsTree):
        (initialize_ElementTest.InspectorTest.expandElementsTree.mycallback):
        (initialize_ElementTest.InspectorTest.dumpDOMAgentTree):
        (initialize_ElementTest):
        * http/tests/inspector/extensions-resources-redirect-expected.txt:
        * http/tests/inspector/inspector-test.js:
        (initialize_InspectorTest.InspectorTest.addResult.clearResults):
        (initialize_InspectorTest.InspectorTest.runTestSuite.runner):
        (initialize_InspectorTest.InspectorTest.runTestSuite):
        (output):
        (clearOutput):
        * inspector/debugger/dom-breakpoints.html:
        * inspector/elements/elements-panel-limited-children-expected.txt:
        * inspector/elements/elements-panel-rewrite-href.html:
        * inspector/elements/elements-panel-structure-expected.txt:
        * inspector/elements/elements-panel-structure.html:
        * inspector/elements/elements-panel-xhtml-structure-expected.txt:
        * inspector/elements/elements-panel-xhtml-structure.xhtml:
        * inspector/elements/insert-node-collapsed-expected.txt: Added.
        * inspector/elements/insert-node-collapsed.html: Added.
        * inspector/elements/insert-node-expected.txt: Added.
        * inspector/elements/insert-node.html: Added.
        * inspector/elements/modify-chardata-expected.txt: Added.
        * inspector/elements/modify-chardata.html: Added.
        * inspector/elements/mutate-unknown-node-expected.txt: Added.
        * inspector/elements/mutate-unknown-node.html: Added.
        * inspector/elements/remove-node-expected.txt: Added.
        * inspector/elements/remove-node.html: Added.
        * inspector/elements/set-attribute.html: Added.
        * inspector/extensions/extensions-expected.txt:

git-svn-id: https://svn.webkit.org/repository/webkit/trunk@78576 268f45cc-cd09-0410-ab3c-d52691b4dbfc

23 files changed:
LayoutTests/ChangeLog
LayoutTests/http/tests/inspector/elements-test.js
LayoutTests/http/tests/inspector/extensions-resources-redirect-expected.txt
LayoutTests/http/tests/inspector/inspector-test.js
LayoutTests/inspector/debugger/dom-breakpoints.html
LayoutTests/inspector/elements/elements-panel-limited-children-expected.txt
LayoutTests/inspector/elements/elements-panel-rewrite-href.html
LayoutTests/inspector/elements/elements-panel-structure-expected.txt
LayoutTests/inspector/elements/elements-panel-structure.html
LayoutTests/inspector/elements/elements-panel-xhtml-structure-expected.txt
LayoutTests/inspector/elements/elements-panel-xhtml-structure.xhtml
LayoutTests/inspector/elements/insert-node-collapsed-expected.txt [new file with mode: 0644]
LayoutTests/inspector/elements/insert-node-collapsed.html [new file with mode: 0644]
LayoutTests/inspector/elements/insert-node-expected.txt [new file with mode: 0644]
LayoutTests/inspector/elements/insert-node.html [new file with mode: 0644]
LayoutTests/inspector/elements/modify-chardata-expected.txt [new file with mode: 0644]
LayoutTests/inspector/elements/modify-chardata.html [new file with mode: 0644]
LayoutTests/inspector/elements/mutate-unknown-node-expected.txt [new file with mode: 0644]
LayoutTests/inspector/elements/mutate-unknown-node.html [new file with mode: 0644]
LayoutTests/inspector/elements/remove-node-expected.txt [new file with mode: 0644]
LayoutTests/inspector/elements/remove-node.html [new file with mode: 0644]
LayoutTests/inspector/elements/set-attribute.html [new file with mode: 0644]
LayoutTests/inspector/extensions/extensions-expected.txt

index 257b640525f9399f9ec3bc8434237fbb7c5a6f63..0a35ecee046c82e352d5e3bd3dbebde4050537f0 100644 (file)
@@ -1,3 +1,46 @@
+2011-02-15  Pavel Feldman  <pfeldman@chromium.org>
+
+        Reviewed by Yury Semikhatsky.
+
+        Web Inspector: implement DOM agent tests.
+        https://bugs.webkit.org/show_bug.cgi?id=54459
+
+        * http/tests/inspector/elements-test.js:
+        (initialize_ElementTest.InspectorTest.expandedNodeWithId.callback):
+        (initialize_ElementTest.InspectorTest.expandedNodeWithId):
+        (initialize_ElementTest.InspectorTest.dumpElementsTree):
+        (initialize_ElementTest.InspectorTest.dumpElementsTree.print):
+        (initialize_ElementTest.InspectorTest.expandElementsTree):
+        (initialize_ElementTest.InspectorTest.expandElementsTree.mycallback):
+        (initialize_ElementTest.InspectorTest.dumpDOMAgentTree):
+        (initialize_ElementTest):
+        * http/tests/inspector/extensions-resources-redirect-expected.txt:
+        * http/tests/inspector/inspector-test.js:
+        (initialize_InspectorTest.InspectorTest.addResult.clearResults):
+        (initialize_InspectorTest.InspectorTest.runTestSuite.runner):
+        (initialize_InspectorTest.InspectorTest.runTestSuite):
+        (output):
+        (clearOutput):
+        * inspector/debugger/dom-breakpoints.html:
+        * inspector/elements/elements-panel-limited-children-expected.txt:
+        * inspector/elements/elements-panel-rewrite-href.html:
+        * inspector/elements/elements-panel-structure-expected.txt:
+        * inspector/elements/elements-panel-structure.html:
+        * inspector/elements/elements-panel-xhtml-structure-expected.txt:
+        * inspector/elements/elements-panel-xhtml-structure.xhtml:
+        * inspector/elements/insert-node-collapsed-expected.txt: Added.
+        * inspector/elements/insert-node-collapsed.html: Added.
+        * inspector/elements/insert-node-expected.txt: Added.
+        * inspector/elements/insert-node.html: Added.
+        * inspector/elements/modify-chardata-expected.txt: Added.
+        * inspector/elements/modify-chardata.html: Added.
+        * inspector/elements/mutate-unknown-node-expected.txt: Added.
+        * inspector/elements/mutate-unknown-node.html: Added.
+        * inspector/elements/remove-node-expected.txt: Added.
+        * inspector/elements/remove-node.html: Added.
+        * inspector/elements/set-attribute.html: Added.
+        * inspector/extensions/extensions-expected.txt:
+
 2011-02-15  Mario Sanchez Prada  <msanchez@igalia.com>
 
         Unreviewed, test crashing because of failing ASSERT on GTK 64-bit debug bot.
index 62486179edcd678bae8d260dcfa7ddffa6cb38b5..e8383fda84d01d6666277ed5c8bd03f504a5d4ed 100755 (executable)
@@ -1,9 +1,5 @@
 var initialize_ElementTest = function() {
 
-InspectorTest.pushAllDOM = function(callback)
-{
-    InspectorTest.nodeWithId(/nonstring/, callback);
-}
 
 InspectorTest.nodeWithId = function(idValue, callback)
 {
@@ -37,6 +33,17 @@ InspectorTest.nodeWithId = function(idValue, callback)
     WebInspector.domAgent.getChildNodesAsync(WebInspector.domAgent.document, processChildren.bind(this, true));
 };
 
+InspectorTest.expandedNodeWithId = function(idValue)
+{
+    var result;
+    function callback(node)
+    {
+        result = node;
+    }
+    InspectorTest.nodeWithId(idValue, callback);
+    return result;
+}
+
 InspectorTest.selectNodeWithId = function(idValue, callback)
 {
     function mycallback(node)
@@ -123,26 +130,77 @@ InspectorTest.dumpStyleTreeItem = function(treeItem, prefix, depth)
     }
 };
 
-InspectorTest.dumpElementsTree = function()
+InspectorTest.dumpElementsTree = function(rootNode)
 {
+    function beautify(element)
+    {
+        return element.textContent.replace(/\u200b/g, "").replace(/\n/g, "").trim();
+    }
+
+    function print(treeItem, prefix)
+    {
+        if (treeItem.listItemElement) {
+            var expander;
+            if (treeItem.hasChildren) {
+                if (treeItem.expanded)
+                    expander = "- ";
+                else
+                    expander = "+ ";
+            } else
+                expander = "  ";
+
+            InspectorTest.addResult(prefix + expander + beautify(treeItem.listItemElement));
+        }
+        
+
+        if (!treeItem.expanded)
+            return;
+
+        var children = treeItem.children;
+        for (var i = 0; children && i < children.length - 1; ++i)
+            print(children[i], prefix + "    ");
+
+        // Closing tag.
+        if (children && children.length)
+            print(children[children.length - 1], prefix);
+    }
+
     WebInspector.panels.elements.updateModifiedNodes();
-    InspectorTest.addResult(WebInspector.panels.elements.treeOutline.element.textContent.replace(/\u200b/g, "").replace(/\n/g, "").replace(/</g, "\n<"));
+    var treeOutline = WebInspector.panels.elements.treeOutline;
+    print(rootNode ? treeOutline.findTreeElement(rootNode) : treeOutline, "");
 };
 
-InspectorTest.dumpLoadedDOM = function()
+InspectorTest.expandElementsTree = function(callback)
 {
-    function expand(treeItem, topLevel)
+    function expand(treeItem)
     {
         var children = treeItem.children;
         for (var i = 0; children && i < children.length; ++i) {
             children[i].expand();
-            expand(children[i], false);
+            expand(children[i]);
         }
-        if (topLevel)
-            InspectorTest.dumpElementsTree();
     }
-    WebInspector.panels.elements.updateModifiedNodes();
-    expand(WebInspector.panels.elements.treeOutline, true);
+
+    function mycallback()
+    {
+        WebInspector.panels.elements.updateModifiedNodes();
+        expand(WebInspector.panels.elements.treeOutline);
+        if (callback)
+            callback();
+    }
+    InspectorTest.nodeWithId(/nonstring/, mycallback);
+};
+
+InspectorTest.dumpDOMAgentTree = function()
+{
+    function dump(node, prefix)
+    {
+        InspectorTest.addResult(prefix + node.nodeName + "[" + node.id + "]");
+        var children = node.children;
+        for (var i = 0; children && i < children.length; ++i)
+            dump(children[i], prefix + "    ");
+    }
+    dump(WebInspector.domAgent.document, "");
 };
 
 };
\ No newline at end of file
index 3d2a271777918c83c45cd17e34926483ad9a1f92..9a4e80e02f618e45f96744ee571c6308354f8006 100644 (file)
@@ -2,10 +2,8 @@ Tests WebInspector extension API
 
 Page reloaded.
 Started extension.
-
 Running tests...
 RUNNING TEST: extension_testGetRedirectResourceContent
-
 content: undefined, encoding: undefined
 RUNNING TEST: extension_testRedirectResourceFinished
 Finished resource: http://127.0.0.1:8000/loading/resources/redirect-methods-result.php?status=302
index d8b061c9e40474b49f283e01c1018da05c95de2a..361621af406dd603175785f61ad17c7ce4db0aca 100644 (file)
@@ -62,7 +62,7 @@ InspectorTest.addResult = function(text)
 
     function clearResults()
     {
-        InspectorTest.evaluateInPage("Array.prototype.forEach.call(document.body.querySelectorAll('div.output'), function(node) { node.parentNode.removeChild(node); })");
+        InspectorTest.evaluateInPage("clearOutput()");
     }
 
     function addResultToPage(text)
@@ -135,45 +135,21 @@ InspectorTest.createKeyEvent = function(keyIdentifier)
     return evt;
 }
 
-InspectorTest.findDOMNode = function(root, filter, callback)
+InspectorTest.runTestSuite = function(testSuite)
 {
-    var found = false;
-    var pendingCalls = 1;
+    var testSuiteTests = testSuite.slice();
 
-    if (root)
-        findDOMNode(root);
-    else
-        waitForDocument();
-
-    function waitForDocument()
+    function runner()
     {
-        root = WebInspector.domAgent.document;
-        if (root)
-            findDOMNode(root);
-        else
-            InspectorTest._addSniffer(WebInspector, setDocument, waitForDocument);
-    }
-
-    function findDOMNode(node)
-    {
-        if (filter(node)) {
-            callback(node);
-            found = true;
-        } else
-            WebInspector.domAgent.getChildNodesAsync(node, processChildren);
-
-        --pendingCalls;
-
-        if (!found && !pendingCalls)
-            setTimeout(findDOMNode.bind(null, root), 0);
-
-        function processChildren(children)
-        {
-            pendingCalls += children ? children.length : 0;
-            for (var i = 0; !found && children && i < children.length; ++i)
-                findDOMNode(children[i]);
+        if (!testSuiteTests.length) {
+            InspectorTest.completeTest();
+            return;
         }
+        var nextTestFunction = testSuiteTests.shift();
+        nextTestFunction(runner);
     }
+
+    runner();
 }
 
 InspectorTest._addSniffer = function(receiver, methodName, override, opt_sticky)
@@ -268,12 +244,24 @@ function didEvaluateForTestInFrontend(callId)
     }, 0);
 }
 
+var outputElement;
+
 function output(text)
 {
-    var outputElement = document.createElement("div");
-    outputElement.className = "output";
-    outputElement.style.whiteSpace = "pre";
+    if (!outputElement) {
+        outputElement = document.createElement("div");
+        outputElement.className = "output";
+        outputElement.style.whiteSpace = "pre";
+        document.body.appendChild(outputElement);
+    }
     outputElement.appendChild(document.createTextNode(text));
     outputElement.appendChild(document.createElement("br"));
-    document.body.appendChild(outputElement);
+}
+
+function clearOutput()
+{
+    if (outputElement) {
+        outputElement.parentNode.removeChild(outputElement);
+        outputElement = null;
+    }
 }
index 71b838dfa6d8147d14c2394a4d20bd5d9da61155..dd7b40b996da0a6604285c2e5ec76193054339c0 100644 (file)
@@ -30,7 +30,7 @@ var test = function()
     testInsertChild.step1 = function()
     {
         InspectorTest.addResult("Test that 'Subtree Modified' breakpoint is hit when appending a child.");
-        findDOMNodeById("rootElement", testInsertChild.step2);
+        InspectorTest.nodeWithId("rootElement", testInsertChild.step2);
     };
     testInsertChild.step2 = function(node)
     {
@@ -103,7 +103,7 @@ var test = function()
     testRemoveNode.step2 = function()
     {
         InspectorTest.addResult("Append elementToRemove to rootElement.");
-        findDOMNodeById("elementToRemove", testRemoveNode.step3);
+        InspectorTest.nodeWithId("elementToRemove", testRemoveNode.step3);
     }
     testRemoveNode.step3 = function(node)
     {
@@ -123,7 +123,7 @@ var test = function()
     testReload.step1 = function()
     {
         InspectorTest.addResult("Test that DOM breakpoints are persisted between page reloads.");
-        findDOMNodeById("rootElement", testReload.step2);
+        InspectorTest.nodeWithId("rootElement", testReload.step2);
     }
     testReload.step2 = function(node)
     {
@@ -143,13 +143,6 @@ var test = function()
         InspectorTest.completeDebuggerTest();
     }
 
-    function findDOMNodeById(id, callback)
-    {
-        InspectorTest.findDOMNode(null, function(node) {
-            return node.getAttribute("id") === id;
-        }, callback);
-    }
-
     function dumpStatus(callFrames)
     {
         InspectorTest.captureStackTrace(callFrames);
index ae676ed3edaef876f159e45e4419cc8d16c7f187..0ab812cf571666ef3e8291375d4387e3b1d166da 100644 (file)
 Tests that src and href element targets are rewritten properly.
 
 =========== Loaded 5 children ===========
-
-<html>
-<head>…
-</head>
-<body onload="runTest()">
-<div id="data">
-<div id="id1">1
-</div>
-<div id="id2">2
-</div>
-<div id="id3">3
-</div>
-<div id="id4">4
-</div>
-<div id="id5">5
-</div>Show All Nodes (5 More)
-</div>
-<p>Tests that src and href element targets are rewritten properly.
-</p>
-</body>
-</html>
+- <html>
+    + <head>…</head>
+    - <body onload="runTest()">
+        - <div id="data">
+              <div id="id1">1</div>
+              <div id="id2">2</div>
+              <div id="id3">3</div>
+              <div id="id4">4</div>
+              <div id="id5">5</div>
+              Show All Nodes (5 More)
+          </div>
+          <p>Tests that src and href element targets are rewritten properly.</p>
+      </body>
+  </html>
 =========== Modified children ===========
-
-<html>
-<head>…
-</head>
-<body onload="runTest()">
-<div id="data">
-<a>
-</a>
-<div id="id1">1
-</div>
-<div id="id3">3
-</div>
-<div id="id4">4
-</div>
-<div id="id5">5
-</div>Show All Nodes (6 More)
-</div>
-<p>Tests that src and href element targets are rewritten properly.
-</p>
-<div class="output" style="white-space: pre; ">…
-</div>
-<div class="output" style="white-space: pre; ">…
-</div>
-</body>
-</html>
+- <html>
+    + <head>…</head>
+    - <body onload="runTest()">
+        - <div id="data">
+              <a></a>
+              <div id="id1">1</div>
+              <div id="id3">3</div>
+              <div id="id4">4</div>
+              <div id="id5">5</div>
+              Show All Nodes (6 More)
+          </div>
+          <p>Tests that src and href element targets are rewritten properly.</p>
+        + <div class="output" style="white-space: pre; ">…</div>
+      </body>
+  </html>
 =========== Loaded all children ===========
-
-<html>
-<head>…
-</head>
-<body onload="runTest()">
-<div id="data">
-<a>
-</a>
-<div id="id1">1
-</div>
-<div id="id3">3
-</div>
-<div id="id4">4
-</div>
-<div id="id5">5
-</div>
-<div id="id6">6
-</div>
-<div id="id7">7
-</div>
-<div id="id8">8
-</div>
-<div id="id9">9
-</div>
-<div id="id10">10
-</div>
-<a>
-</a>
-</div>
-<p>Tests that src and href element targets are rewritten properly.
-</p>
-<div class="output" style="white-space: pre; ">…
-</div>
-<div class="output" style="white-space: pre; ">…
-</div>
-<div class="output" style="white-space: pre; ">…
-</div>
-<div class="output" style="white-space: pre; ">…
-</div>
-</body>
-</html>
+- <html>
+    + <head>…</head>
+    - <body onload="runTest()">
+        - <div id="data">
+              <a></a>
+              <div id="id1">1</div>
+              <div id="id3">3</div>
+              <div id="id4">4</div>
+              <div id="id5">5</div>
+              <div id="id6">6</div>
+              <div id="id7">7</div>
+              <div id="id8">8</div>
+              <div id="id9">9</div>
+              <div id="id10">10</div>
+              <a></a>
+          </div>
+          <p>Tests that src and href element targets are rewritten properly.</p>
+        + <div class="output" style="white-space: pre; ">…</div>
+      </body>
+  </html>
 
index e8162f8935b1d9d2502e7dc29e3b6440f956ab32..b78929234083e1ab723639ccb13133566b120bda 100644 (file)
@@ -9,7 +9,7 @@
 
 function test()
 {
-    InspectorTest.pushAllDOM(step1);
+    InspectorTest.expandElementsTree(step1);
 
     function step1()
     {
index 8ed7df316c68a2a103c81802274ff28e11da6a0d..2b1a235f9eb8b4dad87c0ebd0321da6981058e4b 100644 (file)
@@ -1,26 +1,23 @@
 Tests that elements panel shows dom tree structure.
 
 Text
-
-<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
-<html>
-<head>
-<script src="../../http/tests/inspector/inspector-test.js">
-</script>
-<script src="../../http/tests/inspector/elements-test.js">
-</script>
-<script>function test(){    InspectorTest.pushAllDOM(step1);    function step1()    {        InspectorTest.dumpLoadedDOM();        InspectorTest.completeTest();    }}
-</script>
-</head>
-<body onload="runTest()">
-<p>Tests that elements panel shows dom tree structure.
-</p>
-<div id="level1">
-<div id="level2">"Text        "
-<div id="level3">
-</div>
-</div>
-</div>
-</body>
-</html>
+      <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
+- <html>
+    - <head>
+          <script src="../../http/tests/inspector/inspector-test.js"></script>
+          <script src="../../http/tests/inspector/elements-test.js"></script>
+        - <script>
+              function test(){    InspectorTest.expandElementsTree(step1);    function step1()    {        InspectorTest.dumpElementsTree();        InspectorTest.completeTest();    }}
+          </script>
+      </head>
+    - <body onload="runTest()">
+          <p>Tests that elements panel shows dom tree structure.</p>
+        - <div id="level1">
+            - <div id="level2">
+                  "Text        "
+                  <div id="level3"></div>
+              </div>
+          </div>
+      </body>
+  </html>
 
index 80016e9135a4b6a395bf49907a277c9f50db5576..bce8759a86b055fe6f095dfd7e9d7dc5128e3eb7 100755 (executable)
@@ -7,11 +7,11 @@
 
 function test()
 {
-    InspectorTest.pushAllDOM(step1);
+    InspectorTest.expandElementsTree(step1);
 
     function step1()
     {
-        InspectorTest.dumpLoadedDOM();
+        InspectorTest.dumpElementsTree();
         InspectorTest.completeTest();
     }
 }
index c47c2a9d778c95c4d149772c8d4bec3778f9bc56..ceb2bcfcbcc55b3899d137d597010b16b8f3f6e6 100644 (file)
@@ -4,29 +4,26 @@ Paragraph BR test
 Next line
 
  
-
-<HTML xmlns="http://www.w3.org/1999/xhtml">
-<Head>
-<script src="../../http/tests/inspector/inspector-test.js">
-</script>
-<script src="../../http/tests/inspector/elements-test.js">
-</script>
-<script>
-<![CDATA[function test(){    InspectorTest.pushAllDOM(step1);    function step1()    {        InspectorTest.dumpLoadedDOM();        InspectorTest.completeTest();    }}]]>
-</script>
-</Head>
-<body onload="runTest()">
-<p>"Tests that elements panel shows XML dom tree structure with closing tags for all elements."
-</p>
-<hr>
-</hr>
-<p>"Paragraph BR test"
-<br>
-</br>"Next line"
-</p>
-<![CDATA[ CData Content ]]>
-<img alt="Random Image">
-</img>
-</body>
-</HTML>
+- <HTML xmlns="http://www.w3.org/1999/xhtml">
+    - <Head>
+          <script src="../../http/tests/inspector/inspector-test.js"></script>
+          <script src="../../http/tests/inspector/elements-test.js"></script>
+        - <script>
+              <![CDATA[function test(){    InspectorTest.expandElementsTree(step1);    function step1()    {        InspectorTest.dumpElementsTree();        InspectorTest.completeTest();    }}]]>
+          </script>
+      </Head>
+    - <body onload="runTest()">
+        - <p>
+              "Tests that elements panel shows XML dom tree structure with closing tags for all elements."
+          </p>
+          <hr></hr>
+        - <p>
+              "Paragraph BR test"
+              <br></br>
+              "Next line"
+          </p>
+          <![CDATA[ CData Content ]]>
+          <img alt="Random Image"></img>
+      </body>
+  </HTML>
 
index c7132f407bb71ae9481e2ebde65ac1008005bd73..81f9a88a4eadb62c77870ece86fc6d4d842c868b 100644 (file)
@@ -6,11 +6,11 @@
 <![CDATA[
 function test()
 {
-    InspectorTest.pushAllDOM(step1);
+    InspectorTest.expandElementsTree(step1);
 
     function step1()
     {
-        InspectorTest.dumpLoadedDOM();
+        InspectorTest.dumpElementsTree();
         InspectorTest.completeTest();
     }
 }
diff --git a/LayoutTests/inspector/elements/insert-node-collapsed-expected.txt b/LayoutTests/inspector/elements/insert-node-collapsed-expected.txt
new file mode 100644 (file)
index 0000000..08b5ad9
--- /dev/null
@@ -0,0 +1,7 @@
+Tests that elements panel updates hasChildren flag upon adding children to collapsed nodes.
+
+========= Original ========
+  <div id="container"></div>
+======== Appended =========
++ <div id="container"></div>
+
diff --git a/LayoutTests/inspector/elements/insert-node-collapsed.html b/LayoutTests/inspector/elements/insert-node-collapsed.html
new file mode 100644 (file)
index 0000000..c8b4b62
--- /dev/null
@@ -0,0 +1,56 @@
+<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
+<html>
+<head>
+<script src="../../http/tests/inspector/inspector-test.js"></script>
+<script src="../../http/tests/inspector/elements-test.js"></script>
+<script>
+
+function appendChild()
+{
+    var container = document.getElementById("container");
+    var child = document.createElement("div");
+    child.setAttribute("id", "appended");
+    container.appendChild(child);
+}
+
+function test()
+{
+    var containerNode;
+
+    InspectorTest.runTestSuite([
+        function testDumpInitial(next)
+        {
+            function callback(node)
+            {
+                containerNode = node;
+                InspectorTest.addResult("========= Original ========");
+                InspectorTest.dumpElementsTree(containerNode);
+                next();
+            }
+            InspectorTest.selectNodeWithId("container", callback);
+        },
+
+        function testAppend(next) {
+            function callback()
+            {
+                InspectorTest.addResult("======== Appended =========");
+                InspectorTest.dumpElementsTree(containerNode);
+                next();
+            }
+            InspectorTest.evaluateInPage("appendChild()", callback);
+        }
+    ]);
+}
+
+</script>
+</head>
+
+<body onload="runTest()">
+<p>
+Tests that elements panel updates hasChildren flag upon adding children to collapsed nodes.
+</p>
+
+<div id="container"></div>
+
+</body>
+</html>
diff --git a/LayoutTests/inspector/elements/insert-node-expected.txt b/LayoutTests/inspector/elements/insert-node-expected.txt
new file mode 100644 (file)
index 0000000..bf065f3
--- /dev/null
@@ -0,0 +1,33 @@
+Tests that elements panel updates dom tree structure upon node insertion.
+
+========= Original ========
+- <div id="container">
+      <div id="child1"></div>
+      <div id="child2"></div>
+      <div id="child3"></div>
+  </div>
+===== Inserted before =====
+- <div id="container">
+      <div id="child-before"></div>
+      <div id="child1"></div>
+      <div id="child2"></div>
+      <div id="child3"></div>
+  </div>
+===== Inserted middle =====
+- <div id="container">
+      <div id="child-before"></div>
+      <div id="child1"></div>
+      <div id="child-middle"></div>
+      <div id="child2"></div>
+      <div id="child3"></div>
+  </div>
+======== Appended =========
+- <div id="container">
+      <div id="child-before"></div>
+      <div id="child1"></div>
+      <div id="child-middle"></div>
+      <div id="child2"></div>
+      <div id="child3"></div>
+      <div id="child-after"></div>
+  </div>
+
diff --git a/LayoutTests/inspector/elements/insert-node.html b/LayoutTests/inspector/elements/insert-node.html
new file mode 100644 (file)
index 0000000..c35f9b5
--- /dev/null
@@ -0,0 +1,95 @@
+<html>
+<head>
+<script src="../../http/tests/inspector/inspector-test.js"></script>
+<script src="../../http/tests/inspector/elements-test.js"></script>
+<script>
+
+function insertBeforeFirst()
+{
+    var container = document.getElementById("container");
+    var child = document.createElement("div");
+    child.setAttribute("id", "child-before");
+    container.insertBefore(child, container.firstChild);
+}
+
+function insertNode()
+{
+    var container = document.getElementById("container");
+    var child2 = document.getElementById("child2");
+    var child = document.createElement("div");
+    child.setAttribute("id", "child-middle");
+    container.insertBefore(child, child2);
+}
+
+function appendChild()
+{
+    var container = document.getElementById("container");
+    var child = document.createElement("div");
+    child.setAttribute("id", "child-after");
+    container.appendChild(child);
+}
+
+function test()
+{
+    var containerNode;
+
+    InspectorTest.runTestSuite([
+        function testDumpInitial(next)
+        {
+            function callback(node)
+            {
+                containerNode = InspectorTest.expandedNodeWithId("container");
+
+                InspectorTest.addResult("========= Original ========");
+                InspectorTest.dumpElementsTree(containerNode);
+                next();
+            }
+            InspectorTest.expandElementsTree(callback);
+        },
+
+        function testInsertBefore(next)
+        {
+            function callback()
+            {
+                InspectorTest.addResult("===== Inserted before =====");
+                InspectorTest.dumpElementsTree(containerNode);
+                next();
+            }
+            InspectorTest.evaluateInPage("insertBeforeFirst()", callback);
+        },
+
+        function testInsertMiddle(next)
+        {
+            function callback()
+            {
+                InspectorTest.addResult("===== Inserted middle =====");
+                InspectorTest.dumpElementsTree(containerNode);
+                next();
+            }
+            InspectorTest.evaluateInPage("insertNode()", callback);
+        },
+
+        function testAppend(next) {
+            function callback()
+            {
+                InspectorTest.addResult("======== Appended =========");
+                InspectorTest.dumpElementsTree(containerNode);
+                next();
+            }
+            InspectorTest.evaluateInPage("appendChild()", callback);
+        }
+    ]);
+}
+
+</script>
+</head>
+
+<body onload="runTest()">
+<p>
+Tests that elements panel updates dom tree structure upon node insertion.
+</p>
+
+<div id="container"><div id="child1"></div><div id="child2"></div><div id="child3"></div></div>
+
+</body>
+</html>
diff --git a/LayoutTests/inspector/elements/modify-chardata-expected.txt b/LayoutTests/inspector/elements/modify-chardata-expected.txt
new file mode 100644 (file)
index 0000000..1d4b2f9
--- /dev/null
@@ -0,0 +1,8 @@
+Tests that elements panel updates dom tree structure upon changes to characters.
+
+Bar
+========= Original ========
+  <div id="node">Foo</div>
+===== Mutated text node =====
+  <div id="node">Bar</div>
+
diff --git a/LayoutTests/inspector/elements/modify-chardata.html b/LayoutTests/inspector/elements/modify-chardata.html
new file mode 100644 (file)
index 0000000..6fefeb5
--- /dev/null
@@ -0,0 +1,54 @@
+<html>
+<head>
+<script src="../../http/tests/inspector/inspector-test.js"></script>
+<script src="../../http/tests/inspector/elements-test.js"></script>
+<script>
+
+function modifyChars()
+{
+    var node = document.getElementById("node");
+    node.firstChild.textContent = "Bar";
+}
+
+function test()
+{
+    var targetNode;
+
+    InspectorTest.runTestSuite([
+        function testDumpInitial(next)
+        {
+            function callback(node)
+            {
+                targetNode = node;
+                InspectorTest.addResult("========= Original ========");
+                InspectorTest.dumpElementsTree(targetNode);
+                next();
+            }
+            InspectorTest.selectNodeWithId("node", callback);
+        },
+
+        function testSetAttribute(next)
+        {
+            function callback()
+            {
+                InspectorTest.addResult("===== Mutated text node =====");
+                InspectorTest.dumpElementsTree(targetNode);
+                next();
+            }
+            InspectorTest.evaluateInPage("modifyChars()", callback);
+        }
+    ]);
+}
+
+</script>
+</head>
+
+<body onload="runTest()">
+<p>
+Tests that elements panel updates dom tree structure upon changes to characters.
+</p>
+
+<div id="node">Foo</div>
+
+</body>
+</html>
diff --git a/LayoutTests/inspector/elements/mutate-unknown-node-expected.txt b/LayoutTests/inspector/elements/mutate-unknown-node-expected.txt
new file mode 100644 (file)
index 0000000..a2bb8b3
--- /dev/null
@@ -0,0 +1,15 @@
+Tests that elements panel does not receive events upon changes to the undiscovered nodes.
+
+========= Original ========
+#document[1]
+    HTML[2]
+        HEAD[3]
+        BODY[4]
+            P[5]
+                [6]
+            DIV[7]
+DOMAgent event fired. Should only happen once for output node: DOMNodeInserted DIV#undefined
+Appended
+Removed
+Attribute modified
+
diff --git a/LayoutTests/inspector/elements/mutate-unknown-node.html b/LayoutTests/inspector/elements/mutate-unknown-node.html
new file mode 100644 (file)
index 0000000..8e2ea88
--- /dev/null
@@ -0,0 +1,77 @@
+<html>
+<head>
+<script src="../../http/tests/inspector/inspector-test.js"></script>
+<script src="../../http/tests/inspector/elements-test.js"></script>
+<script>
+
+function appendChild()
+{
+    var hidden = document.getElementById("hidden");
+    var child = document.createElement("div");
+    child.setAttribute("id", "appended");
+    hidden.appendChild(child);
+}
+
+function removeChild()
+{
+    var child = document.getElementById("appended");
+    child.parentNode.removeChild(child);
+}
+
+function modifyAttribute()
+{
+    var hidden = document.getElementById("hidden");
+    hidden.setAttribute("foo", "bar");
+}
+
+function test()
+{
+    function listener(type, event)
+    {
+        InspectorTest.addResult("DOMAgent event fired. Should only happen once for output node: " + type + " " + event.target.nodeName + "#" + event.target.getAttribute("id"));
+    }
+
+    WebInspector.domAgent.document.addEventListener("DOMAttrModified", listener.bind(this, "DOMAttrModified"));
+    WebInspector.domAgent.document.addEventListener("DOMCharacterDataModified", listener.bind(this, "DOMCharacterDataModified"));
+    WebInspector.domAgent.document.addEventListener("DOMNodeInserted", listener.bind(this, "DOMNodeInserted"));
+    WebInspector.domAgent.document.addEventListener("DOMNodeRemoved", listener.bind(this, "DOMNodeRemoved"));
+
+    InspectorTest.addResult("========= Original ========");
+    InspectorTest.dumpDOMAgentTree();
+
+    InspectorTest.evaluateInPage("appendChild()", step1);
+
+    function step1()
+    {
+        InspectorTest.addResult("Appended");
+        InspectorTest.evaluateInPage("removeChild()", step2);
+    }
+
+    function step2()
+    {
+        InspectorTest.addResult("Removed");
+        InspectorTest.evaluateInPage("modifyAttribute()", step3);
+    }
+
+    function step3()
+    {
+        InspectorTest.addResult("Attribute modified");
+        InspectorTest.completeTest();
+    }
+}
+
+</script>
+</head>
+
+<body onload="runTest()">
+<p>
+Tests that elements panel does not receive events upon changes to the undiscovered nodes.
+</p>
+
+<div>
+<div id="hidden">
+</div>
+</div>
+
+</body>
+</html>
diff --git a/LayoutTests/inspector/elements/remove-node-expected.txt b/LayoutTests/inspector/elements/remove-node-expected.txt
new file mode 100644 (file)
index 0000000..9ad857d
--- /dev/null
@@ -0,0 +1,28 @@
+Tests that elements panel updates dom tree structure upon node removal.
+
+========= Original ========
+- <div id="container">
+      <div id="child1"></div>
+      <div id="child2"></div>
+      <div id="child3"></div>
+      <div id="child4"></div>
+  </div>
+===== Removed first =====
+- <div id="container">
+      <div id="child2"></div>
+      <div id="child3"></div>
+      <div id="child4"></div>
+  </div>
+===== Removed middle =====
+- <div id="container">
+      <div id="child2"></div>
+      <div id="child4"></div>
+  </div>
+===== Removed last =====
+- <div id="container">
+      <div id="child2"></div>
+  </div>
+===== Removed the only =====
+- <div id="container">
+  </div>
+
diff --git a/LayoutTests/inspector/elements/remove-node.html b/LayoutTests/inspector/elements/remove-node.html
new file mode 100644 (file)
index 0000000..dc5663c
--- /dev/null
@@ -0,0 +1,88 @@
+<html>
+<head>
+<script src="../../http/tests/inspector/inspector-test.js"></script>
+<script src="../../http/tests/inspector/elements-test.js"></script>
+<script>
+
+function removeNode(id)
+{
+    var child = document.getElementById(id);
+    child.parentNode.removeChild(child);
+}
+
+function test()
+{
+    var containerNode;
+
+    InspectorTest.runTestSuite([
+        function testDumpInitial(next)
+        {
+            function callback(node)
+            {
+                containerNode = InspectorTest.expandedNodeWithId("container");
+
+                InspectorTest.addResult("========= Original ========");
+                InspectorTest.dumpElementsTree(containerNode);
+                next();
+            }
+            InspectorTest.expandElementsTree(callback);
+        },
+
+        function testRemoveFirst(next)
+        {
+            function callback()
+            {
+                InspectorTest.addResult("===== Removed first =====");
+                InspectorTest.dumpElementsTree(containerNode);
+                next();
+            }
+            InspectorTest.evaluateInPage("removeNode('child1')", callback);
+        },
+
+        function testRemoveMiddle(next)
+        {
+            function callback()
+            {
+                InspectorTest.addResult("===== Removed middle =====");
+                InspectorTest.dumpElementsTree(containerNode);
+                next();
+            }
+            InspectorTest.evaluateInPage("removeNode('child3')", callback);
+        },
+
+        function testRemoveLast(next)
+        {
+            function callback()
+            {
+                InspectorTest.addResult("===== Removed last =====");
+                InspectorTest.dumpElementsTree(containerNode);
+                next();
+            }
+            InspectorTest.evaluateInPage("removeNode('child4')", callback);
+        },
+
+        function testRemoveTheOnly(next)
+        {
+            function callback()
+            {
+                InspectorTest.addResult("===== Removed the only =====");
+                InspectorTest.dumpElementsTree(containerNode);
+                next();
+            }
+            InspectorTest.evaluateInPage("removeNode('child2')", callback);
+        }
+    ]);
+}
+
+</script>
+</head>
+
+<body onload="runTest()">
+<p>
+Tests that elements panel updates dom tree structure upon node removal.
+</p>
+
+<div id="container"><div id="child1"></div><div id="child2"></div><div id="child3"></div><div id="child4"></div></div>
+
+</body>
+</html>
diff --git a/LayoutTests/inspector/elements/set-attribute.html b/LayoutTests/inspector/elements/set-attribute.html
new file mode 100644 (file)
index 0000000..183392c
--- /dev/null
@@ -0,0 +1,70 @@
+<html>
+<head>
+<script src="../../http/tests/inspector/inspector-test.js"></script>
+<script src="../../http/tests/inspector/elements-test.js"></script>
+<script>
+
+function setAttribute(name, value)
+{
+    var node = document.getElementById("node");
+    node.setAttribute(name, value);
+}
+
+function removeAttribute(name)
+{
+    var node = document.getElementById("node");
+    node.removeAttribute(name);
+}
+
+function test()
+{
+    var targetNode;
+
+    InspectorTest.runTestSuite([
+        function testDumpInitial(next)
+        {
+            function callback(node)
+            {
+                targetNode = node;
+                InspectorTest.addResult("========= Original ========");
+                InspectorTest.dumpElementsTree(targetNode);
+                next();
+            }
+            InspectorTest.selectNodeWithId("node", callback);
+        },
+
+        function testSetAttribute(next)
+        {
+            function callback()
+            {
+                InspectorTest.addResult("===== Set attribute =====");
+                InspectorTest.dumpElementsTree(targetNode);
+                next();
+            }
+            InspectorTest.evaluateInPage("setAttribute('name', 'value')", callback);
+        },
+
+        function testRemoveAttribute(next) {
+            function callback()
+            {
+                InspectorTest.addResult("=== Removed attribute ===");
+                InspectorTest.dumpElementsTree(targetNode);
+                next();
+            }
+            InspectorTest.evaluateInPage("removeAttribute('name')", callback);
+        }
+    ]);
+}
+
+</script>
+</head>
+
+<body onload="runTest()">
+<p>
+Tests that elements panel updates dom tree structure upon setting attribute.
+</p>
+
+<div id="node"></div>
+
+</body>
+</html>
index 033d69c86d9029949000e97846896c5c5c2f4d41..7871325e203fe163d2a0daadd28b0ef1bb7c246b 100644 (file)
@@ -17,7 +17,7 @@ Sidebar created
     setHeight : <function>
 }
 RUNNING TEST: extension_testExtensionWatchSidebarExpression
-Sidebar content: titlef0: "expression"f1: undefinedf2: nullf3: Objectf4: Array[0]f5: Array[3]f6: Objectf7: 42f8: Locationf9: HTMLCollection[18]f10: function () {}__proto__: Object
+Sidebar content: titlef0: "expression"f1: undefinedf2: nullf3: Objectf4: Array[0]f5: Array[3]f6: Objectf7: 42f8: Locationf9: HTMLCollection[2]f10: function () {}__proto__: Object
 RUNNING TEST: extension_testExtensionWatchSidebarObject
 Watch sidebar created, callback arguments dump follows:
 {