[webkit-changes] [189416] trunk

commit-queue Fri, 04 Sep 2015 19:39:07 -0700

Title: [189416] trunk

Revision: 189416
Author: [email protected]
Date: 2015-09-04 19:38:42 -0700 (Fri, 04 Sep 2015)

Log Message

Web Inspector: Add tests for DOM highlight commands
https://bugs.webkit.org/show_bug.cgi?id=148786


Patch by Joseph Pecoraro <[email protected]> on 2015-09-04
Reviewed by Timothy Hatcher.

Source/WebCore:

Tests: inspector/dom/hideHighlight.html
       inspector/dom/highlightFrame.html
       inspector/dom/highlightNode.html
       inspector/dom/highlightQuad.html
       inspector/dom/highlightRect.html

* inspector/InspectorDOMAgent.cpp:
(WebCore::InspectorDOMAgent::highlightNode):
(WebCore::InspectorDOMAgent::highlightFrame):
Include an error if a frame is not found.

* inspector/InspectorOverlay.cpp:
(WebCore::InspectorOverlay::highlightQuad):
Should have been checking the usePageCoordinates state of the incoming
highlight configuration, not the one that will be replaced.

LayoutTests:

* inspector/dom/hideHighlight-expected.txt: Added.
* inspector/dom/hideHighlight.html: Added.
* inspector/dom/highlightFrame-expected.txt: Added.
* inspector/dom/highlightFrame.html: Added.
* inspector/dom/highlightNode-expected.txt: Added.
* inspector/dom/highlightNode.html: Added.
* inspector/dom/highlightQuad-expected.txt: Added.
* inspector/dom/highlightQuad.html: Added.
* inspector/dom/highlightRect-expected.txt: Added.
* inspector/dom/highlightRect.html: Added.
* inspector/dom/highlightSelector-expected.txt:
* inspector/dom/highlightSelector.html:
* inspector/dom/resources/highlight-iframe.html: Renamed from LayoutTests/inspector/dom/resources/highlightSelector-iframe.html.

Diff

Modified: trunk/LayoutTests/ChangeLog (189415 => 189416)


--- trunk/LayoutTests/ChangeLog	2015-09-05 02:34:22 UTC (rev 189415)
+++ trunk/LayoutTests/ChangeLog	2015-09-05 02:38:42 UTC (rev 189416)
@@ -1,5 +1,26 @@
 2015-09-04  Joseph Pecoraro  <[email protected]>
 
+        Web Inspector: Add tests for DOM highlight commands
+        https://bugs.webkit.org/show_bug.cgi?id=148786
+
+        Reviewed by Timothy Hatcher.
+
+        * inspector/dom/hideHighlight-expected.txt: Added.
+        * inspector/dom/hideHighlight.html: Added.
+        * inspector/dom/highlightFrame-expected.txt: Added.
+        * inspector/dom/highlightFrame.html: Added.
+        * inspector/dom/highlightNode-expected.txt: Added.
+        * inspector/dom/highlightNode.html: Added.
+        * inspector/dom/highlightQuad-expected.txt: Added.
+        * inspector/dom/highlightQuad.html: Added.
+        * inspector/dom/highlightRect-expected.txt: Added.
+        * inspector/dom/highlightRect.html: Added.
+        * inspector/dom/highlightSelector-expected.txt:
+        * inspector/dom/highlightSelector.html:
+        * inspector/dom/resources/highlight-iframe.html: Renamed from LayoutTests/inspector/dom/resources/highlightSelector-iframe.html.
+
+2015-09-04  Joseph Pecoraro  <[email protected]>
+
         Web Inspector: Test Runtime.saveResult and $n values
         https://bugs.webkit.org/show_bug.cgi?id=148837

Added: trunk/LayoutTests/inspector/dom/hideHighlight-expected.txt (0 => 189416)


--- trunk/LayoutTests/inspector/dom/hideHighlight-expected.txt	                        (rev 0)
+++ trunk/LayoutTests/inspector/dom/hideHighlight-expected.txt	2015-09-05 02:38:42 UTC (rev 189416)
@@ -0,0 +1,31 @@
+Tests for the DOM.hideHighlight command.
+
+
+== Running test suite: DOM.hideHighlight
+-- Running test case: CheckEmptyHighlight
+PASS: Should not be a highlight yet.
+
+-- Running test case: HighlightRect
+PASS: Should be one highlight rect.
+Highlight Rect: {"top":0,"right":100,"bottom":100,"left":0,"width":100,"height":100}
+
+-- Running test case: HideHighlight
+PASS: Should be no highlight.
+
+-- Running test case: HighlightQuad
+PASS: Should be one highlight rect.
+Highlight Rect: {"top":100,"right":150,"bottom":200,"left":50,"width":100,"height":100}
+
+-- Running test case: HideHighlight
+PASS: Should be no highlight.
+
+-- Running test case: HighlightNode
+PASS: Should be one highlighted node.
+Highlighted Element Data: {"tagName":"p","idValue":"target","size":{"width":500,"height":100},"role":""}
+
+-- Running test case: HideHighlight
+PASS: Should be no highlight.
+
+-- Running test case: HideHighlight
+PASS: Should be no highlight.
+

Added: trunk/LayoutTests/inspector/dom/hideHighlight.html (0 => 189416)


--- trunk/LayoutTests/inspector/dom/hideHighlight.html	                        (rev 0)
+++ trunk/LayoutTests/inspector/dom/hideHighlight.html	2015-09-05 02:38:42 UTC (rev 189416)
@@ -0,0 +1,130 @@
+<!doctype html>
+<html>
+<head>
+<script src=""
+<script>
+function test()
+{
+    const color = undefined;
+    const outlineColor = undefined;
+
+    function getHighlightRects(callback) {
+        InspectorTest.evaluateInPage("JSON.stringify(Array.from(window.internals.inspectorHighlightRects()))", (error, payload, wasThrown) => {
+            InspectorTest.assert(!error, "Unexpected error dumping highlight: " + error);
+            InspectorTest.assert(!wasThrown, "Unexpected exception when dumping highlight.");
+            callback(JSON.parse(payload.value));
+        });
+    }
+
+    function dumpHighlightRects(callback) {
+        getHighlightRects((highlightRects) => {
+            InspectorTest.expectThat(highlightRects.length === 1, "Should be one highlight rect.");
+            InspectorTest.log("Highlight Rect: " + JSON.stringify(highlightRects[0]));
+            callback();
+        });
+    }
+
+    function getHighlight(callback) {
+        InspectorTest.evaluateInPage("window.internals.inspectorHighlightObject()", (error, payload, wasThrown) => {
+            InspectorTest.assert(!error, "Unexpected error dumping highlight: " + error);
+            InspectorTest.assert(!wasThrown, "Unexpected exception when dumping highlight.");
+            callback(JSON.parse(payload.value));
+        });
+    }
+
+    function dumpHighlight(callback) {
+        getHighlight((highlightObjectPayload) => {
+            InspectorTest.expectThat(highlightObjectPayload.length === 1, "Should be one highlighted node.");
+            InspectorTest.log("Highlighted Element Data: " + JSON.stringify(highlightObjectPayload[0].elementData));
+            callback();
+        });
+    }
+
+    let suite = InspectorTest.createAsyncSuite("DOM.hideHighlight");
+
+    function addHideHighlightTestCase() {
+        suite.addTestCase({
+            name: "HideHighlight",
+            description: "Calling hideHighlight should hide the highlight.",
+            test: (resolve, reject) => {
+                DOMAgent.hideHighlight(() => {
+                    getHighlightRects((highlightRects) => {
+                        InspectorTest.expectThat(highlightRects.length === 0, "Should be no highlight.");
+                        resolve();
+                    });
+                });
+            }
+        });
+    }
+
+    suite.addTestCase({
+        name: "CheckEmptyHighlight",
+        description: "Should not be a highlight yet.",
+        test: (resolve, reject) => {
+            getHighlightRects((highlightRects) => {
+                InspectorTest.expectThat(highlightRects.length === 0, "Should not be a highlight yet.");
+                resolve();
+            });
+        }
+    });
+
+    suite.addTestCase({
+        name: "HighlightRect",
+        description: "Call highlightRect to create a highlight.",
+        test: (resolve, reject) => {
+            let rect = new WebInspector.Rect(0, 0, 100, 100);
+            DOMAgent.highlightRect(rect.origin.x, rect.origin.y, rect.size.width, rect.size.height, color, outlineColor, (error) => {
+                dumpHighlightRects(resolve);
+            });
+        }
+    });
+
+    addHideHighlightTestCase();
+
+    suite.addTestCase({
+        name: "HighlightQuad",
+        description: "Call highlightQuad to create a highlight.",
+        test: (resolve, reject) => {
+            let quad = new WebInspector.Quad([100, 100, 150, 150, 100, 200, 50, 150]);
+            DOMAgent.highlightQuad(quad.toProtocol(), color, outlineColor, (error) => {
+                dumpHighlightRects(resolve);
+            });
+        }
+    });
+
+    addHideHighlightTestCase();
+
+    suite.addTestCase({
+        name: "HighlightNode",
+        description: "Call highlightNode to create a highlight.",
+        test: (resolve, reject) => {
+            const highlightConfig = {
+                showInfo: true,
+                contentColor: {r: 255, g: 255, b: 255},
+                paddingColor: {r: 255, g: 255, b: 255},
+                borderColor: {r: 255, g: 255, b: 255},
+                marginColor: {r: 255, g: 255, b: 255},
+            };
+
+            WebInspector.domTreeManager.requestDocument((documentNode) => {
+                WebInspector.domTreeManager.querySelector(documentNode.id, "#target", (nodeId) => {
+                    DOMAgent.highlightNode(highlightConfig, nodeId, (error) => {
+                        InspectorTest.assert(!error, "Should not have an error.");
+                        dumpHighlight(resolve);
+                    });
+                });
+            });
+        }
+    });
+
+    addHideHighlightTestCase();
+    addHideHighlightTestCase(); // Test that a duplicate hideHighlight is not problematic.
+
+    suite.runTestCasesAndFinish();
+}
+</script>
+</head>
+<body _onload_="runTest()">
+    <p id="target" style="width:500px; height:100px">Tests for the DOM.hideHighlight command.</p>
+</body>
+</html>

Added: trunk/LayoutTests/inspector/dom/highlightFrame-expected.txt (0 => 189416)


--- trunk/LayoutTests/inspector/dom/highlightFrame-expected.txt	                        (rev 0)
+++ trunk/LayoutTests/inspector/dom/highlightFrame-expected.txt	2015-09-05 02:38:42 UTC (rev 189416)
@@ -0,0 +1,21 @@
+Tests for the DOM.highlightFrame command.
+
+  
+
+== Running test suite: DOM.highlightFrame
+-- Running test case: CheckEmptyHighlight
+PASS: Should not be a highlight yet.
+
+-- Running test case: HighlightMainFrame
+PASS: Should not be a highlight for the main frame.
+
+-- Running test case: HighlightChildFrame1
+Highlight Object: [{"scrollOffset":{"x":0,"y":0},"fragments":[{"quads":[[{"x":8,"y":50},{"x":312,"y":50},{"x":312,"y":204},{"x":8,"y":204}],[{"x":8,"y":50},{"x":312,"y":50},{"x":312,"y":204},{"x":8,"y":204}],[{"x":10,"y":52},{"x":310,"y":52},{"x":310,"y":202},{"x":10,"y":202}],[{"x":10,"y":52},{"x":310,"y":52},{"x":310,"y":202},{"x":10,"y":202}]],"contentColor":"rgba(0, 0, 0, 0)","contentOutlineColor":"rgba(0, 0, 0, 0)","paddingColor":"rgba(0, 0, 0, 0)","borderColor":"rgba(0, 0, 0, 0)","marginColor":"rgba(0, 0, 0, 0)&q
 uot;}],"elementData":{"tagName":"iframe","idValue":"frame-1","size":{"width":304,"height":154},"role":"group"}}]
+
+-- Running test case: HighlightChildFrame2
+Highlight Object: [{"scrollOffset":{"x":0,"y":0},"fragments":[{"quads":[[{"x":316,"y":50},{"x":620,"y":50},{"x":620,"y":204},{"x":316,"y":204}],[{"x":316,"y":50},{"x":620,"y":50},{"x":620,"y":204},{"x":316,"y":204}],[{"x":318,"y":52},{"x":618,"y":52},{"x":618,"y":202},{"x":318,"y":202}],[{"x":318,"y":52},{"x":618,"y":52},{"x":618,"y":202},{"x":318,"y":202}]],"contentColor":"rgba(0, 0, 0, 0)","contentOutlineColor":"rgba(0, 0, 0, 0)","paddingColor":"rgba(0, 0, 0, 0)","borderColor":"rgba(0, 0, 0, 0)","marginColor":"rgba(0
 , 0, 0, 0)"}],"elementData":{"tagName":"iframe","idValue":"frame-2","size":{"width":304,"height":154},"role":"group"}}]
+
+-- Running test case: BadFrameId
+PASS: Should produce an error.
+Error: No frame for given id found
+

Added: trunk/LayoutTests/inspector/dom/highlightFrame.html (0 => 189416)


--- trunk/LayoutTests/inspector/dom/highlightFrame.html	                        (rev 0)
+++ trunk/LayoutTests/inspector/dom/highlightFrame.html	2015-09-05 02:38:42 UTC (rev 189416)
@@ -0,0 +1,101 @@
+<!doctype html>
+<html>
+<head>
+<script src=""
+<script>
+function test()
+{
+    InspectorTest.assert(WebInspector.frameResourceManager.mainFrame.childFrames.length === 2, "Page should have subframes.");
+    const mainFrame = WebInspector.frameResourceManager.mainFrame;
+    const childFrame1 = WebInspector.frameResourceManager.mainFrame.childFrames[0];
+    const childFrame2 = WebInspector.frameResourceManager.mainFrame.childFrames[1];
+
+    function getHighlight(callback) {
+        InspectorTest.evaluateInPage("window.internals.inspectorHighlightObject()", (error, payload, wasThrown) => {
+            InspectorTest.assert(!error, "Unexpected error dumping highlight: " + error);
+            InspectorTest.assert(!wasThrown, "Unexpected exception when dumping highlight.");
+            callback(JSON.parse(payload.value));
+        });
+    }
+
+    function dumpHighlight(callback) {
+        getHighlight((highlightObjectPayload) => {
+            InspectorTest.log("Highlight Object: " + JSON.stringify(highlightObjectPayload));
+            callback();
+        });
+    }
+
+    let suite = InspectorTest.createAsyncSuite("DOM.highlightFrame");
+
+    suite.addTestCase({
+        name: "CheckEmptyHighlight",
+        description: "Should not be a highlight yet.",
+        test: (resolve, reject) => {
+            getHighlight((highlightObjectPayload) => {
+                InspectorTest.expectThat(highlightObjectPayload.length === 0, "Should not be a highlight yet.");
+                resolve();
+            });
+        }
+    });
+
+    suite.addTestCase({
+        name: "HighlightMainFrame",
+        description: "Main frame does not have an owner element, so there will be no highlight.",
+        test: (resolve, reject) => {
+            DOMAgent.highlightFrame(mainFrame.id, undefined, undefined, (error) => {
+                getHighlight((highlightObjectPayload) => {
+                    InspectorTest.expectThat(highlightObjectPayload.length === 0, "Should not be a highlight for the main frame.");
+                    resolve();
+                });
+            });
+        }
+    });
+
+    suite.addTestCase({
+        name: "HighlightChildFrame1",
+        description: "Should highlight child frame 1.",
+        test: (resolve, reject) => {
+            DOMAgent.highlightFrame(childFrame1.id, undefined, undefined, (error) => {
+                InspectorTest.assert(!error, "Should not have an error.");
+                dumpHighlight(resolve);
+            });
+        }
+    });
+
+    suite.addTestCase({
+        name: "HighlightChildFrame2",
+        description: "Should highlight child frame 2.",
+        test: (resolve, reject) => {
+            DOMAgent.highlightFrame(childFrame2.id, undefined, undefined, (error) => {
+                InspectorTest.assert(!error, "Should not have an error.");
+                dumpHighlight(resolve);
+            });
+        }
+    });
+
+    // ------
+
+    suite.addTestCase({
+        name: "BadFrameId",
+        description: "Bad frame id should cause an error.",
+        test: (resolve, reject) => {
+            DOMAgent.highlightFrame("bad-frame-id", undefined, undefined, (error) => {
+                InspectorTest.expectThat(error, "Should produce an error.");
+                InspectorTest.log("Error: " + error);
+                resolve();
+            });
+        }
+    });
+
+    suite.runTestCasesAndFinish();
+}
+</script>
+</head>
+<body _onload_="runTest()">
+    <p>Tests for the DOM.highlightFrame command.</p>
+    <div>
+        <iframe id="frame-1" src=""
+        <iframe id="frame-2" src=""
+    </div>
+</body>
+</html>

Added: trunk/LayoutTests/inspector/dom/highlightNode-expected.txt (0 => 189416)


--- trunk/LayoutTests/inspector/dom/highlightNode-expected.txt	                        (rev 0)
+++ trunk/LayoutTests/inspector/dom/highlightNode-expected.txt	2015-09-05 02:38:42 UTC (rev 189416)
@@ -0,0 +1,36 @@
+Tests for the DOM.highlightNode command.
+
+
+
+== Running test suite: DOM.highlightNode
+-- Running test case: CheckEmptyHighlight
+PASS: Should not be a highlight yet.
+
+-- Running test case: MainFrameNodeViaNodeId
+PASS: Should be one highlighted node.
+Highlighted Element Data: {"tagName":"div","idValue":"id-one","className":".class-two","size":{"width":100,"height":200},"role":""}
+
+-- Running test case: ChildFrameNodeViaNodeId
+PASS: Should be one highlighted node.
+Highlighted Element Data: {"tagName":"div","idValue":"id-one","size":{"width":150,"height":250},"role":""}
+
+-- Running test case: MainFrameNodeViaObjectId
+PASS: Should be one highlighted node.
+Highlighted Element Data: {"tagName":"div","idValue":"id-one","className":".class-two","size":{"width":100,"height":200},"role":""}
+
+-- Running test case: ChildFrameNodeViaObjectId
+PASS: Should be one highlighted node.
+Highlighted Element Data: {"tagName":"div","idValue":"id-one","size":{"width":150,"height":250},"role":""}
+
+-- Running test case: MissingNodeAndObjectIdShouldError
+PASS: Should produce an error.
+Error: Either nodeId or objectId must be specified
+
+-- Running test case: BadNodeId
+PASS: Should produce an error.
+Error: Could not find node with given id
+
+-- Running test case: BadObjectId
+PASS: Should produce an error.
+Error: Node for given objectId not found
+

Added: trunk/LayoutTests/inspector/dom/highlightNode.html (0 => 189416)


--- trunk/LayoutTests/inspector/dom/highlightNode.html	                        (rev 0)
+++ trunk/LayoutTests/inspector/dom/highlightNode.html	2015-09-05 02:38:42 UTC (rev 189416)
@@ -0,0 +1,166 @@
+<!doctype html>
+<html>
+<head>
+<script src=""
+<script>
+function test()
+{
+    InspectorTest.assert(WebInspector.frameResourceManager.mainFrame.childFrames.length === 1, "Page should have a subframe.");
+    const mainFrame = WebInspector.frameResourceManager.mainFrame;
+    const childFrame = WebInspector.frameResourceManager.mainFrame.childFrames[0];
+    const highlightConfig = {
+        showInfo: true,
+        contentColor: {r: 255, g: 255, b: 255},
+        paddingColor: {r: 255, g: 255, b: 255},
+        borderColor: {r: 255, g: 255, b: 255},
+        marginColor: {r: 255, g: 255, b: 255},
+    };
+
+    function getHighlight(callback) {
+        InspectorTest.evaluateInPage("window.internals.inspectorHighlightObject()", (error, payload, wasThrown) => {
+            InspectorTest.assert(!error, "Unexpected error dumping highlight: " + error);
+            InspectorTest.assert(!wasThrown, "Unexpected exception when dumping highlight.");
+            callback(JSON.parse(payload.value));
+        });
+    }
+
+    function dumpHighlight(callback) {
+        getHighlight((highlightObjectPayload) => {
+            InspectorTest.expectThat(highlightObjectPayload.length === 1, "Should be one highlighted node.");
+            InspectorTest.log("Highlighted Element Data: " + JSON.stringify(highlightObjectPayload[0].elementData));
+            callback();
+        });
+    }
+
+
+    let mainFrameDocumentNodeId, mainFrameTargetNode;
+    let childFrameDocumentNodeId, childFrameTargetNode;
+
+    let suite = InspectorTest.createAsyncSuite("DOM.highlightNode");
+
+    suite.addTestCase({
+        name: "CheckEmptyHighlight",
+        description: "Should not be a highlight yet.",
+        test: (resolve, reject) => {
+            getHighlight((highlightObjectPayload) => {
+                InspectorTest.expectThat(highlightObjectPayload.length === 0, "Should not be a highlight yet.");
+                resolve();
+            });
+        }
+    });
+
+    suite.addTestCase({
+        name: "MainFrameNodeViaNodeId",
+        description: "Should highlight a node in the main frame using node id.",
+        test: (resolve, reject) => {
+            WebInspector.domTreeManager.querySelector(mainFrameDocumentNodeId, "#id-one", function(nodeId) {
+                mainFrameTargetNode = WebInspector.domTreeManager.nodeForId(nodeId);
+                DOMAgent.highlightNode(highlightConfig, mainFrameTargetNode.id, undefined, (error) => {
+                    InspectorTest.assert(!error, "Should not have an error.");
+                    dumpHighlight(resolve);
+                });
+            });
+        }
+    });
+
+    suite.addTestCase({
+        name: "ChildFrameNodeViaNodeId",
+        description: "Should highlight a node in the child frame using node id.",
+        test: (resolve, reject) => {
+            WebInspector.domTreeManager.querySelector(childFrameDocumentNodeId, "#id-one", function(nodeId) {
+                childFrameTargetNode = WebInspector.domTreeManager.nodeForId(nodeId);
+                DOMAgent.highlightNode(highlightConfig, childFrameTargetNode.id, undefined, (error) => {
+                    InspectorTest.assert(!error, "Should not have an error.");
+                    dumpHighlight(resolve);
+                });
+            });
+        }
+    });
+
+    suite.addTestCase({
+        name: "MainFrameNodeViaObjectId",
+        description: "Should highlight a node in the main frame using object id.",
+        test: (resolve, reject) => {
+            WebInspector.RemoteObject.resolveNode(mainFrameTargetNode, "test", (remoteObject) => {
+                DOMAgent.highlightNode(highlightConfig, undefined, remoteObject.objectId, (error) => {
+                    InspectorTest.assert(!error, "Should not have an error.");
+                    dumpHighlight(resolve);
+                });
+            });
+        }
+    });
+
+    suite.addTestCase({
+        name: "ChildFrameNodeViaObjectId",
+        description: "Should highlight a node in the child frame using object id.",
+        test: (resolve, reject) => {
+            WebInspector.RemoteObject.resolveNode(childFrameTargetNode, "test", (remoteObject) => {
+                DOMAgent.highlightNode(highlightConfig, undefined, remoteObject.objectId, (error) => {
+                    InspectorTest.assert(!error, "Should not have an error.");
+                    dumpHighlight(resolve);
+                });
+            });
+        }
+    });
+
+    // ------
+
+    suite.addTestCase({
+        name: "MissingNodeAndObjectIdShouldError",
+        description: "Missing identifiers should cause an error.",
+        test: (resolve, reject) => {
+            DOMAgent.highlightNode(highlightConfig, undefined, undefined, (error) => {
+                InspectorTest.expectThat(error, "Should produce an error.");
+                InspectorTest.log("Error: " + error);
+                resolve();
+            });
+        }
+    });
+
+    suite.addTestCase({
+        name: "BadNodeId",
+        description: "Bad node id should cause an error.",
+        test: (resolve, reject) => {
+            DOMAgent.highlightNode(highlightConfig, 9999999, undefined, (error) => {
+                InspectorTest.expectThat(error, "Should produce an error.");
+                InspectorTest.log("Error: " + error);
+                resolve();
+            });
+        }
+    });
+
+    suite.addTestCase({
+        name: "BadObjectId",
+        description: "Bad object id should cause an error.",
+        test: (resolve, reject) => {
+            DOMAgent.highlightNode(highlightConfig, undefined, "bad-object-id", (error) => {
+                InspectorTest.expectThat(error, "Should produce an error.");
+                InspectorTest.log("Error: " + error);
+                resolve();
+            });
+        }
+    });
+
+    WebInspector.domTreeManager.requestDocument((documentNode) => {
+        mainFrameDocumentNodeId = documentNode.id;
+        RuntimeAgent.evaluate.invoke({_expression_: "document", objectGroup: "test", contextId: childFrame.pageExecutionContext.id}, (error, remoteObjectPayload) => {
+            let remoteObject = WebInspector.RemoteObject.fromPayload(remoteObjectPayload)
+            remoteObject.pushNodeToFrontend((documentNodeId) => {
+                childFrameDocumentNodeId = documentNodeId
+
+                suite.runTestCasesAndFinish();
+            });
+        })
+    });
+}
+</script>
+</head>
+<body _onload_="runTest()">
+    <p>Tests for the DOM.highlightNode command.</p>
+    <div style="width: 500px; height: 500px">
+        <div class="class-one" style="width: 10px; height: 20px"></div>
+        <div id="id-one" class="class-two" style="width:100px; height: 200px"></div>
+        <iframe class="class-one" src=""
+    </div>
+</body>
+</html>

Added: trunk/LayoutTests/inspector/dom/highlightQuad-expected.txt (0 => 189416)


--- trunk/LayoutTests/inspector/dom/highlightQuad-expected.txt	                        (rev 0)
+++ trunk/LayoutTests/inspector/dom/highlightQuad-expected.txt	2015-09-05 02:38:42 UTC (rev 189416)
@@ -0,0 +1,35 @@
+Tests for the DOM.highlightQuad command.
+
+
+== Running test suite: DOM.highlightQuad
+-- Running test case: CheckEmptyHighlight
+PASS: Should not be a highlight yet.
+
+-- Running test case: HighlightSmallRectWithQuad
+PASS: Should be one highlight rect.
+Highlight Rect: {"top":0,"right":100,"bottom":100,"left":0,"width":100,"height":100}
+
+-- Running test case: HighlightSmallQuadViewportCoordinates
+PASS: Should be one highlight rect.
+Highlight Rect: {"top":100,"right":150,"bottom":200,"left":50,"width":100,"height":100}
+
+-- Running test case: HighlightSmallQuadPageCoordinates
+PASS: Should be one highlight rect.
+Highlight Rect: {"top":90,"right":140,"bottom":190,"left":40,"width":100,"height":100}
+
+-- Running test case: HighlightSmallUnspecifiedCoordinatesUsesViewportCoordinates
+PASS: Should be one highlight rect.
+Highlight Rect: {"top":100,"right":150,"bottom":200,"left":50,"width":100,"height":100}
+
+-- Running test case: HighlightLargeQuadViewportCoordinates
+PASS: Should be one highlight rect.
+Highlight Rect: {"top":0,"right":1000,"bottom":2000,"left":0,"width":1000,"height":2000}
+
+-- Running test case: HighlightLargeQuadPageCoordinates
+PASS: Should be one highlight rect.
+Highlight Rect: {"top":-10,"right":990,"bottom":1990,"left":-10,"width":1000,"height":2000}
+
+-- Running test case: BadQuadShouldError
+PASS: Should produce an error.
+Error: Invalid Quad format
+

Added: trunk/LayoutTests/inspector/dom/highlightQuad.html (0 => 189416)


--- trunk/LayoutTests/inspector/dom/highlightQuad.html	                        (rev 0)
+++ trunk/LayoutTests/inspector/dom/highlightQuad.html	2015-09-05 02:38:42 UTC (rev 189416)
@@ -0,0 +1,134 @@
+<!doctype html>
+<html>
+<head>
+<script src=""
+<script>
+function test()
+{
+    const color = undefined;
+    const outlineColor = undefined;
+    const useViewportCoordinates = false;
+    const usePageCoordinates = true;
+
+    function getHighlightRects(callback) {
+        InspectorTest.evaluateInPage("JSON.stringify(Array.from(window.internals.inspectorHighlightRects()))", (error, payload, wasThrown) => {
+            InspectorTest.assert(!error, "Unexpected error dumping highlight: " + error);
+            InspectorTest.assert(!wasThrown, "Unexpected exception when dumping highlight.");
+            callback(JSON.parse(payload.value));
+        });
+    }
+
+    function dumpHighlightRects(callback) {
+        getHighlightRects((highlightRects) => {
+            InspectorTest.expectThat(highlightRects.length === 1, "Should be one highlight rect.");
+            InspectorTest.log("Highlight Rect: " + JSON.stringify(highlightRects[0]));
+            callback();
+        });
+    }
+
+    let suite = InspectorTest.createAsyncSuite("DOM.highlightQuad");
+
+    suite.addTestCase({
+        name: "CheckEmptyHighlight",
+        description: "Should not be a highlight yet.",
+        test: (resolve, reject) => {
+            getHighlightRects((highlightRects) => {
+                InspectorTest.expectThat(highlightRects.length === 0, "Should not be a highlight yet.");
+                resolve();
+            });
+        }
+    });
+
+    suite.addTestCase({
+        name: "HighlightSmallRectWithQuad",
+        description: "Should create a highlight using viewport coordinates.",
+        test: (resolve, reject) => {
+            let quad = new WebInspector.Quad([0, 0, 100, 0, 100, 100, 100, 0]);
+            DOMAgent.highlightQuad(quad.toProtocol(), color, outlineColor, (error) => {
+                dumpHighlightRects(resolve);
+            });
+        }
+    });
+
+    suite.addTestCase({
+        name: "HighlightSmallQuadViewportCoordinates",
+        description: "Should create a highlight using viewport coordinates.",
+        test: (resolve, reject) => {
+            let quad = new WebInspector.Quad([100, 100, 150, 150, 100, 200, 50, 150]);
+            DOMAgent.highlightQuad(quad.toProtocol(), color, outlineColor, useViewportCoordinates, (error) => {
+                dumpHighlightRects(resolve);
+            });
+        }
+    });
+
+    suite.addTestCase({
+        name: "HighlightSmallQuadPageCoordinates",
+        description: "Should create a highlight using page coordinates.",
+        test: (resolve, reject) => {
+            let quad = new WebInspector.Quad([100, 100, 150, 150, 100, 200, 50, 150]);
+            DOMAgent.highlightQuad(quad.toProtocol(), color, outlineColor, usePageCoordinates, (error) => {
+                dumpHighlightRects(resolve);
+            });
+        }
+    });
+
+    suite.addTestCase({
+        name: "HighlightSmallUnspecifiedCoordinatesUsesViewportCoordinates",
+        description: "Should create a highlight using page coordinates.",
+        test: (resolve, reject) => {
+            let quad = new WebInspector.Quad([100, 100, 150, 150, 100, 200, 50, 150]);
+            DOMAgent.highlightQuad(quad.toProtocol(), color, outlineColor, (error) => {
+                dumpHighlightRects(resolve);
+            });
+        }
+    });
+
+    suite.addTestCase({
+        name: "HighlightLargeQuadViewportCoordinates",
+        description: "Should create a highlight using viewport coordinates.",
+        test: (resolve, reject) => {
+            let quad = new WebInspector.Quad([0, 0, 500, 0, 1000, 1000, 0, 2000]);
+            DOMAgent.highlightQuad(quad.toProtocol(), color, outlineColor, useViewportCoordinates, (error) => {
+                dumpHighlightRects(resolve);
+            });
+        }
+    });
+
+    suite.addTestCase({
+        name: "HighlightLargeQuadPageCoordinates",
+        description: "Should create a highlight using viewport coordinates.",
+        test: (resolve, reject) => {
+            let quad = new WebInspector.Quad([0, 0, 500, 0, 1000, 1000, 0, 2000]);
+            DOMAgent.highlightQuad(quad.toProtocol(), color, outlineColor, usePageCoordinates, (error) => {
+                dumpHighlightRects(resolve);
+            });
+        }
+    });
+
+    // ------
+
+    suite.addTestCase({
+        name: "BadQuadShouldError",
+        description: "Should get an error when specifying a quad with too few points.",
+        test: (resolve, reject) => {
+            let badQuadArray = [1, 2, 3, 4];
+            DOMAgent.highlightQuad(badQuadArray, color, outlineColor, usePageCoordinates, (error) => {
+                InspectorTest.expectThat(error, "Should produce an error.");
+                InspectorTest.log("Error: " + error);
+                resolve();
+            });
+        }
+    });
+
+    InspectorTest.evaluateInPage("window.scrollTo(10, 10)", () => {
+        suite.runTestCasesAndFinish();
+    });
+}
+</script>
+</head>
+<body _onload_="runTest()">
+    <p>Tests for the DOM.highlightQuad command.</p>
+    <!-- Ensure the page is scrollable so we can test highlight rects relative to a scroll page -->
+    <div style="height:2000px; width: 2000px; background:blue"></div>
+</body>
+</html>

Added: trunk/LayoutTests/inspector/dom/highlightRect-expected.txt (0 => 189416)


--- trunk/LayoutTests/inspector/dom/highlightRect-expected.txt	                        (rev 0)
+++ trunk/LayoutTests/inspector/dom/highlightRect-expected.txt	2015-09-05 02:38:42 UTC (rev 189416)
@@ -0,0 +1,31 @@
+Tests for the DOM.highlightRect command.
+
+
+== Running test suite: DOM.highlightRect
+-- Running test case: CheckEmptyHighlight
+PASS: Should not be a highlight yet.
+
+-- Running test case: HighlightSmallRectViewportCoordinates
+PASS: Should be one highlight rect.
+Highlight Rect: {"top":0,"right":100,"bottom":200,"left":0,"width":100,"height":200}
+
+-- Running test case: HighlightSmallRectPageCoordinates
+PASS: Should be one highlight rect.
+Highlight Rect: {"top":-10,"right":90,"bottom":190,"left":-10,"width":100,"height":200}
+
+-- Running test case: HighlightSmallRectUnspecifiedCoordinatesUsesViewportCoordinates
+PASS: Should be one highlight rect.
+Highlight Rect: {"top":0,"right":100,"bottom":200,"left":0,"width":100,"height":200}
+
+-- Running test case: HighlightLargeRectViewportCoordinates
+PASS: Should be one highlight rect.
+Highlight Rect: {"top":0,"right":100000,"bottom":200000,"left":0,"width":100000,"height":200000}
+
+-- Running test case: HighlightLargeRectPageCoordinates
+PASS: Should be one highlight rect.
+Highlight Rect: {"top":-10,"right":99990,"bottom":199990,"left":-10,"width":100000,"height":200000}
+
+-- Running test case: HighlightEmptyRect
+PASS: Should be one highlight rect.
+Highlight Rect: {"top":0,"right":0,"bottom":0,"left":0,"width":0,"height":0}
+

Added: trunk/LayoutTests/inspector/dom/highlightRect.html (0 => 189416)


--- trunk/LayoutTests/inspector/dom/highlightRect.html	                        (rev 0)
+++ trunk/LayoutTests/inspector/dom/highlightRect.html	2015-09-05 02:38:42 UTC (rev 189416)
@@ -0,0 +1,119 @@
+<!doctype html>
+<html>
+<head>
+<script src=""
+<script>
+function test()
+{
+    const color = undefined;
+    const outlineColor = undefined;
+    const useViewportCoordinates = false;
+    const usePageCoordinates = true;
+
+    function getHighlightRects(callback) {
+        InspectorTest.evaluateInPage("JSON.stringify(Array.from(window.internals.inspectorHighlightRects()))", (error, payload, wasThrown) => {
+            InspectorTest.assert(!error, "Unexpected error dumping highlight: " + error);
+            InspectorTest.assert(!wasThrown, "Unexpected exception when dumping highlight.");
+            callback(JSON.parse(payload.value));
+        });
+    }
+
+    function dumpHighlightRects(callback) {
+        getHighlightRects((highlightRects) => {
+            InspectorTest.expectThat(highlightRects.length === 1, "Should be one highlight rect.");
+            InspectorTest.log("Highlight Rect: " + JSON.stringify(highlightRects[0]));
+            callback();
+        });
+    }
+
+    let suite = InspectorTest.createAsyncSuite("DOM.highlightRect");
+
+    suite.addTestCase({
+        name: "CheckEmptyHighlight",
+        description: "Should not be a highlight yet.",
+        test: (resolve, reject) => {
+            getHighlightRects((highlightRects) => {
+                InspectorTest.expectThat(highlightRects.length === 0, "Should not be a highlight yet.");
+                resolve();
+            });
+        }
+    });
+
+    suite.addTestCase({
+        name: "HighlightSmallRectViewportCoordinates",
+        description: "Should create a highlight using viewport coordinates.",
+        test: (resolve, reject) => {
+            let rect = new WebInspector.Rect(0, 0, 100, 200);
+            DOMAgent.highlightRect(rect.origin.x, rect.origin.y, rect.size.width, rect.size.height, color, outlineColor, useViewportCoordinates, (error) => {
+                dumpHighlightRects(resolve);
+            });
+        }
+    });
+
+    suite.addTestCase({
+        name: "HighlightSmallRectPageCoordinates",
+        description: "Should create a highlight using page coordinates.",
+        test: (resolve, reject) => {
+            let rect = new WebInspector.Rect(0, 0, 100, 200);
+            DOMAgent.highlightRect(rect.origin.x, rect.origin.y, rect.size.width, rect.size.height, color, outlineColor, usePageCoordinates, (error) => {
+                dumpHighlightRects(resolve);
+            });
+        }
+    });
+
+    suite.addTestCase({
+        name: "HighlightSmallRectUnspecifiedCoordinatesUsesViewportCoordinates",
+        description: "Should create a highlight using viewport coordinates if unspecificed.",
+        test: (resolve, reject) => {
+            let rect = new WebInspector.Rect(0, 0, 100, 200);
+            DOMAgent.highlightRect(rect.origin.x, rect.origin.y, rect.size.width, rect.size.height, color, outlineColor, (error) => {
+                dumpHighlightRects(resolve);
+            });
+        }
+    });
+
+    suite.addTestCase({
+        name: "HighlightLargeRectViewportCoordinates",
+        description: "Should create a large highlight using viewport coordinates.",
+        test: (resolve, reject) => {
+            let rect = new WebInspector.Rect(0, 0, 100000, 200000);
+            DOMAgent.highlightRect(rect.origin.x, rect.origin.y, rect.size.width, rect.size.height, color, outlineColor, useViewportCoordinates, (error) => {
+                dumpHighlightRects(resolve);
+            });
+        }
+    });
+
+    suite.addTestCase({
+        name: "HighlightLargeRectPageCoordinates",
+        description: "Should create a large highlight using page coordinates.",
+        test: (resolve, reject) => {
+            let rect = new WebInspector.Rect(0, 0, 100000, 200000);
+            DOMAgent.highlightRect(rect.origin.x, rect.origin.y, rect.size.width, rect.size.height, color, outlineColor, usePageCoordinates, (error) => {
+                dumpHighlightRects(resolve);
+            });
+        }
+    });
+
+    suite.addTestCase({
+        name: "HighlightEmptyRect",
+        description: "Should create an empty highlight.",
+        test: (resolve, reject) => {
+            let rect = new WebInspector.Rect(0, 0, 0, 0);
+            DOMAgent.highlightRect(rect.origin.x, rect.origin.y, rect.size.width, rect.size.height, color, outlineColor, false, (error) => {
+                dumpHighlightRects(resolve);
+            });
+        }
+    });
+
+    InspectorTest.evaluateInPage("window.scrollTo(10, 10)", () => {
+        suite.runTestCasesAndFinish();
+    });
+}
+</script>
+</head>
+<body _onload_="runTest()">
+    <p>Tests for the DOM.highlightRect command.</p>
+    <!-- Ensure the page is scrollable so we can test highlight rects relative to a scroll page -->
+    <div style="height:2000px; width: 2000px; background:blue"></div>
+</body>
+</html>

Modified: trunk/LayoutTests/inspector/dom/highlightSelector-expected.txt (189415 => 189416)


--- trunk/LayoutTests/inspector/dom/highlightSelector-expected.txt	2015-09-05 02:34:22 UTC (rev 189415)
+++ trunk/LayoutTests/inspector/dom/highlightSelector-expected.txt	2015-09-05 02:38:42 UTC (rev 189416)
@@ -1,1350 +1,75 @@
+Tests for the DOM.highlightSelector command.
 
-SELECTOR: div
-FRAMEID: <main-frame-id>
-FOUND: 3
-[
-  {
-    "scrollOffset": {
-      "x": 0,
-      "y": 0
-    },
-    "fragments": [
-      {
-        "quads": [
-          [
-            {
-              "x": 8,
-              "y": 8
-            },
-            {
-              "x": 792,
-              "y": 8
-            },
-            {
-              "x": 792,
-              "y": 162
-            },
-            {
-              "x": 8,
-              "y": 162
-            }
-          ],
-          [
-            {
-              "x": 8,
-              "y": 8
-            },
-            {
-              "x": 792,
-              "y": 8
-            },
-            {
-              "x": 792,
-              "y": 162
-            },
-            {
-              "x": 8,
-              "y": 162
-            }
-          ],
-          [
-            {
-              "x": 8,
-              "y": 8
-            },
-            {
-              "x": 792,
-              "y": 8
-            },
-            {
-              "x": 792,
-              "y": 162
-            },
-            {
-              "x": 8,
-              "y": 162
-            }
-          ],
-          [
-            {
-              "x": 8,
-              "y": 8
-            },
-            {
-              "x": 792,
-              "y": 8
-            },
-            {
-              "x": 792,
-              "y": 162
-            },
-            {
-              "x": 8,
-              "y": 162
-            }
-          ]
-        ],
-        "contentColor": "#ffffff",
-        "contentOutlineColor": "rgba(0, 0, 0, 0)",
-        "paddingColor": "#ffffff",
-        "borderColor": "#ffffff",
-        "marginColor": "#ffffff"
-      }
-    ],
-    "elementData": {
-      "tagName": "div",
-      "idValue": "",
-      "size": {
-        "width": 784,
-        "height": 154
-      },
-      "role": ""
-    }
-  },
-  {
-    "scrollOffset": {
-      "x": 0,
-      "y": 0
-    },
-    "fragments": [
-      {
-        "quads": [
-          [
-            {
-              "x": 8,
-              "y": 8
-            },
-            {
-              "x": 792,
-              "y": 8
-            },
-            {
-              "x": 792,
-              "y": 8
-            },
-            {
-              "x": 8,
-              "y": 8
-            }
-          ],
-          [
-            {
-              "x": 8,
-              "y": 8
-            },
-            {
-              "x": 792,
-              "y": 8
-            },
-            {
-              "x": 792,
-              "y": 8
-            },
-            {
-              "x": 8,
-              "y": 8
-            }
-          ],
-          [
-            {
-              "x": 8,
-              "y": 8
-            },
-            {
-              "x": 792,
-              "y": 8
-            },
-            {
-              "x": 792,
-              "y": 8
-            },
-            {
-              "x": 8,
-              "y": 8
-            }
-          ],
-          [
-            {
-              "x": 8,
-              "y": 8
-            },
-            {
-              "x": 792,
-              "y": 8
-            },
-            {
-              "x": 792,
-              "y": 8
-            },
-            {
-              "x": 8,
-              "y": 8
-            }
-          ]
-        ],
-        "contentColor": "#ffffff",
-        "contentOutlineColor": "rgba(0, 0, 0, 0)",
-        "paddingColor": "#ffffff",
-        "borderColor": "#ffffff",
-        "marginColor": "#ffffff"
-      }
-    ],
-    "elementData": {
-      "tagName": "div",
-      "idValue": "",
-      "className": ".class-one",
-      "size": {
-        "width": 784,
-        "height": 0
-      },
-      "role": ""
-    }
-  },
-  {
-    "scrollOffset": {
-      "x": 0,
-      "y": 0
-    },
-    "fragments": [
-      {
-        "quads": [
-          [
-            {
-              "x": 8,
-              "y": 8
-            },
-            {
-              "x": 792,
-              "y": 8
-            },
-            {
-              "x": 792,
-              "y": 8
-            },
-            {
-              "x": 8,
-              "y": 8
-            }
-          ],
-          [
-            {
-              "x": 8,
-              "y": 8
-            },
-            {
-              "x": 792,
-              "y": 8
-            },
-            {
-              "x": 792,
-              "y": 8
-            },
-            {
-              "x": 8,
-              "y": 8
-            }
-          ],
-          [
-            {
-              "x": 8,
-              "y": 8
-            },
-            {
-              "x": 792,
-              "y": 8
-            },
-            {
-              "x": 792,
-              "y": 8
-            },
-            {
-              "x": 8,
-              "y": 8
-            }
-          ],
-          [
-            {
-              "x": 8,
-              "y": 8
-            },
-            {
-              "x": 792,
-              "y": 8
-            },
-            {
-              "x": 792,
-              "y": 8
-            },
-            {
-              "x": 8,
-              "y": 8
-            }
-          ]
-        ],
-        "contentColor": "#ffffff",
-        "contentOutlineColor": "rgba(0, 0, 0, 0)",
-        "paddingColor": "#ffffff",
-        "borderColor": "#ffffff",
-        "marginColor": "#ffffff"
-      }
-    ],
-    "elementData": {
-      "tagName": "div",
-      "idValue": "id-one",
-      "className": ".class-two",
-      "size": {
-        "width": 784,
-        "height": 0
-      },
-      "role": ""
-    }
-  }
-]
 
 
-SELECTOR: .class-one
-FRAMEID: <main-frame-id>
-FOUND: 2
-[
-  {
-    "scrollOffset": {
-      "x": 0,
-      "y": 0
-    },
-    "fragments": [
-      {
-        "quads": [
-          [
-            {
-              "x": 8,
-              "y": 8
-            },
-            {
-              "x": 777,
-              "y": 8
-            },
-            {
-              "x": 777,
-              "y": 8
-            },
-            {
-              "x": 8,
-              "y": 8
-            }
-          ],
-          [
-            {
-              "x": 8,
-              "y": 8
-            },
-            {
-              "x": 777,
-              "y": 8
-            },
-            {
-              "x": 777,
-              "y": 8
-            },
-            {
-              "x": 8,
-              "y": 8
-            }
-          ],
-          [
-            {
-              "x": 8,
-              "y": 8
-            },
-            {
-              "x": 777,
-              "y": 8
-            },
-            {
-              "x": 777,
-              "y": 8
-            },
-            {
-              "x": 8,
-              "y": 8
-            }
-          ],
-          [
-            {
-              "x": 8,
-              "y": 8
-            },
-            {
-              "x": 777,
-              "y": 8
-            },
-            {
-              "x": 777,
-              "y": 8
-            },
-            {
-              "x": 8,
-              "y": 8
-            }
-          ]
-        ],
-        "contentColor": "#ffffff",
-        "contentOutlineColor": "rgba(0, 0, 0, 0)",
-        "paddingColor": "#ffffff",
-        "borderColor": "#ffffff",
-        "marginColor": "#ffffff"
-      }
-    ],
-    "elementData": {
-      "tagName": "div",
-      "idValue": "",
-      "className": ".class-one",
-      "size": {
-        "width": 769,
-        "height": 0
-      },
-      "role": ""
-    }
-  },
-  {
-    "scrollOffset": {
-      "x": 0,
-      "y": 0
-    },
-    "fragments": [
-      {
-        "quads": [
-          [
-            {
-              "x": 8,
-              "y": 8
-            },
-            {
-              "x": 312,
-              "y": 8
-            },
-            {
-              "x": 312,
-              "y": 162
-            },
-            {
-              "x": 8,
-              "y": 162
-            }
-          ],
-          [
-            {
-              "x": 8,
-              "y": 8
-            },
-            {
-              "x": 312,
-              "y": 8
-            },
-            {
-              "x": 312,
-              "y": 162
-            },
-            {
-              "x": 8,
-              "y": 162
-            }
-          ],
-          [
-            {
-              "x": 10,
-              "y": 10
-            },
-            {
-              "x": 310,
-              "y": 10
-            },
-            {
-              "x": 310,
-              "y": 160
-            },
-            {
-              "x": 10,
-              "y": 160
-            }
-          ],
-          [
-            {
-              "x": 10,
-              "y": 10
-            },
-            {
-              "x": 310,
-              "y": 10
-            },
-            {
-              "x": 310,
-              "y": 160
-            },
-            {
-              "x": 10,
-              "y": 160
-            }
-          ]
-        ],
-        "contentColor": "#ffffff",
-        "contentOutlineColor": "rgba(0, 0, 0, 0)",
-        "paddingColor": "#ffffff",
-        "borderColor": "#ffffff",
-        "marginColor": "#ffffff"
-      }
-    ],
-    "elementData": {
-      "tagName": "iframe",
-      "idValue": "",
-      "className": ".class-one",
-      "size": {
-        "width": 304,
-        "height": 154
-      },
-      "role": "group"
-    }
-  }
-]
+== Running test suite: DOM.highlightSelector
+-- Running test case: MainFrameTagSelector
+- Frame: <main-frame>
+- Selector: div
+PASS: Should highlight 3 element(s).
+Highlighted Elements:
+{"tagName":"div","idValue":"","size":{"width":500,"height":500},"role":""}
+{"tagName":"div","idValue":"","className":".class-one","size":{"width":10,"height":20},"role":""}
+{"tagName":"div","idValue":"id-one","className":".class-two","size":{"width":100,"height":200},"role":""}
 
+-- Running test case: MainFrameWithClassSelector
+- Frame: <main-frame>
+- Selector: .class-one
+PASS: Should highlight 2 element(s).
+Highlighted Elements:
+{"tagName":"div","idValue":"","className":".class-one","size":{"width":10,"height":20},"role":""}
+{"tagName":"iframe","idValue":"","className":".class-one","size":{"width":304,"height":154},"role":"group"}
 
-SELECTOR: #id-one
-FRAMEID: <main-frame-id>
-FOUND: 1
-[
-  {
-    "scrollOffset": {
-      "x": 0,
-      "y": 0
-    },
-    "fragments": [
-      {
-        "quads": [
-          [
-            {
-              "x": 8,
-              "y": 8
-            },
-            {
-              "x": 777,
-              "y": 8
-            },
-            {
-              "x": 777,
-              "y": 8
-            },
-            {
-              "x": 8,
-              "y": 8
-            }
-          ],
-          [
-            {
-              "x": 8,
-              "y": 8
-            },
-            {
-              "x": 777,
-              "y": 8
-            },
-            {
-              "x": 777,
-              "y": 8
-            },
-            {
-              "x": 8,
-              "y": 8
-            }
-          ],
-          [
-            {
-              "x": 8,
-              "y": 8
-            },
-            {
-              "x": 777,
-              "y": 8
-            },
-            {
-              "x": 777,
-              "y": 8
-            },
-            {
-              "x": 8,
-              "y": 8
-            }
-          ],
-          [
-            {
-              "x": 8,
-              "y": 8
-            },
-            {
-              "x": 777,
-              "y": 8
-            },
-            {
-              "x": 777,
-              "y": 8
-            },
-            {
-              "x": 8,
-              "y": 8
-            }
-          ]
-        ],
-        "contentColor": "#ffffff",
-        "contentOutlineColor": "rgba(0, 0, 0, 0)",
-        "paddingColor": "#ffffff",
-        "borderColor": "#ffffff",
-        "marginColor": "#ffffff"
-      }
-    ],
-    "elementData": {
-      "tagName": "div",
-      "idValue": "id-one",
-      "className": ".class-two",
-      "size": {
-        "width": 769,
-        "height": 0
-      },
-      "role": ""
-    }
-  }
-]
+-- Running test case: MainFrameIdSelector
+- Frame: <main-frame>
+- Selector: #id-one
+PASS: Should highlight 1 element(s).
+Highlighted Elements:
+{"tagName":"div","idValue":"id-one","className":".class-two","size":{"width":100,"height":200},"role":""}
 
+-- Running test case: MainFrameMultipleSelectors
+- Frame: <main-frame>
+- Selector: .class-one, .class-two
+PASS: Should highlight 3 element(s).
+Highlighted Elements:
+{"tagName":"div","idValue":"","className":".class-one","size":{"width":10,"height":20},"role":""}
+{"tagName":"div","idValue":"id-one","className":".class-two","size":{"width":100,"height":200},"role":""}
+{"tagName":"iframe","idValue":"","className":".class-one","size":{"width":304,"height":154},"role":"group"}
 
-SELECTOR: .class-one, .class-two
-FRAMEID: <main-frame-id>
-FOUND: 3
-[
-  {
-    "scrollOffset": {
-      "x": 0,
-      "y": 0
-    },
-    "fragments": [
-      {
-        "quads": [
-          [
-            {
-              "x": 8,
-              "y": 8
-            },
-            {
-              "x": 777,
-              "y": 8
-            },
-            {
-              "x": 777,
-              "y": 8
-            },
-            {
-              "x": 8,
-              "y": 8
-            }
-          ],
-          [
-            {
-              "x": 8,
-              "y": 8
-            },
-            {
-              "x": 777,
-              "y": 8
-            },
-            {
-              "x": 777,
-              "y": 8
-            },
-            {
-              "x": 8,
-              "y": 8
-            }
-          ],
-          [
-            {
-              "x": 8,
-              "y": 8
-            },
-            {
-              "x": 777,
-              "y": 8
-            },
-            {
-              "x": 777,
-              "y": 8
-            },
-            {
-              "x": 8,
-              "y": 8
-            }
-          ],
-          [
-            {
-              "x": 8,
-              "y": 8
-            },
-            {
-              "x": 777,
-              "y": 8
-            },
-            {
-              "x": 777,
-              "y": 8
-            },
-            {
-              "x": 8,
-              "y": 8
-            }
-          ]
-        ],
-        "contentColor": "#ffffff",
-        "contentOutlineColor": "rgba(0, 0, 0, 0)",
-        "paddingColor": "#ffffff",
-        "borderColor": "#ffffff",
-        "marginColor": "#ffffff"
-      }
-    ],
-    "elementData": {
-      "tagName": "div",
-      "idValue": "",
-      "className": ".class-one",
-      "size": {
-        "width": 769,
-        "height": 0
-      },
-      "role": ""
-    }
-  },
-  {
-    "scrollOffset": {
-      "x": 0,
-      "y": 0
-    },
-    "fragments": [
-      {
-        "quads": [
-          [
-            {
-              "x": 8,
-              "y": 8
-            },
-            {
-              "x": 777,
-              "y": 8
-            },
-            {
-              "x": 777,
-              "y": 8
-            },
-            {
-              "x": 8,
-              "y": 8
-            }
-          ],
-          [
-            {
-              "x": 8,
-              "y": 8
-            },
-            {
-              "x": 777,
-              "y": 8
-            },
-            {
-              "x": 777,
-              "y": 8
-            },
-            {
-              "x": 8,
-              "y": 8
-            }
-          ],
-          [
-            {
-              "x": 8,
-              "y": 8
-            },
-            {
-              "x": 777,
-              "y": 8
-            },
-            {
-              "x": 777,
-              "y": 8
-            },
-            {
-              "x": 8,
-              "y": 8
-            }
-          ],
-          [
-            {
-              "x": 8,
-              "y": 8
-            },
-            {
-              "x": 777,
-              "y": 8
-            },
-            {
-              "x": 777,
-              "y": 8
-            },
-            {
-              "x": 8,
-              "y": 8
-            }
-          ]
-        ],
-        "contentColor": "#ffffff",
-        "contentOutlineColor": "rgba(0, 0, 0, 0)",
-        "paddingColor": "#ffffff",
-        "borderColor": "#ffffff",
-        "marginColor": "#ffffff"
-      }
-    ],
-    "elementData": {
-      "tagName": "div",
-      "idValue": "id-one",
-      "className": ".class-two",
-      "size": {
-        "width": 769,
-        "height": 0
-      },
-      "role": ""
-    }
-  },
-  {
-    "scrollOffset": {
-      "x": 0,
-      "y": 0
-    },
-    "fragments": [
-      {
-        "quads": [
-          [
-            {
-              "x": 8,
-              "y": 8
-            },
-            {
-              "x": 312,
-              "y": 8
-            },
-            {
-              "x": 312,
-              "y": 162
-            },
-            {
-              "x": 8,
-              "y": 162
-            }
-          ],
-          [
-            {
-              "x": 8,
-              "y": 8
-            },
-            {
-              "x": 312,
-              "y": 8
-            },
-            {
-              "x": 312,
-              "y": 162
-            },
-            {
-              "x": 8,
-              "y": 162
-            }
-          ],
-          [
-            {
-              "x": 10,
-              "y": 10
-            },
-            {
-              "x": 310,
-              "y": 10
-            },
-            {
-              "x": 310,
-              "y": 160
-            },
-            {
-              "x": 10,
-              "y": 160
-            }
-          ],
-          [
-            {
-              "x": 10,
-              "y": 10
-            },
-            {
-              "x": 310,
-              "y": 10
-            },
-            {
-              "x": 310,
-              "y": 160
-            },
-            {
-              "x": 10,
-              "y": 160
-            }
-          ]
-        ],
-        "contentColor": "#ffffff",
-        "contentOutlineColor": "rgba(0, 0, 0, 0)",
-        "paddingColor": "#ffffff",
-        "borderColor": "#ffffff",
-        "marginColor": "#ffffff"
-      }
-    ],
-    "elementData": {
-      "tagName": "iframe",
-      "idValue": "",
-      "className": ".class-one",
-      "size": {
-        "width": 304,
-        "height": 154
-      },
-      "role": "group"
-    }
-  }
-]
+-- Running test case: MissingOptionalFrameIdShouldUseMainFrame
+- Frame: Not Provided
+- Selector: iframe.class-one
+PASS: Should highlight 1 element(s).
+Highlighted Elements:
+{"tagName":"iframe","idValue":"","className":".class-one","size":{"width":304,"height":154},"role":"group"}
 
+-- Running test case: MainFrameNonMatchingSelector
+- Frame: <main-frame>
+- Selector: .no-elements
+PASS: Should highlight 0 element(s).
 
-SELECTOR: iframe.class-one
-FRAMEID: undefined
-FOUND: 1
-[
-  {
-    "scrollOffset": {
-      "x": 0,
-      "y": 0
-    },
-    "fragments": [
-      {
-        "quads": [
-          [
-            {
-              "x": 8,
-              "y": 8
-            },
-            {
-              "x": 312,
-              "y": 8
-            },
-            {
-              "x": 312,
-              "y": 162
-            },
-            {
-              "x": 8,
-              "y": 162
-            }
-          ],
-          [
-            {
-              "x": 8,
-              "y": 8
-            },
-            {
-              "x": 312,
-              "y": 8
-            },
-            {
-              "x": 312,
-              "y": 162
-            },
-            {
-              "x": 8,
-              "y": 162
-            }
-          ],
-          [
-            {
-              "x": 10,
-              "y": 10
-            },
-            {
-              "x": 310,
-              "y": 10
-            },
-            {
-              "x": 310,
-              "y": 160
-            },
-            {
-              "x": 10,
-              "y": 160
-            }
-          ],
-          [
-            {
-              "x": 10,
-              "y": 10
-            },
-            {
-              "x": 310,
-              "y": 10
-            },
-            {
-              "x": 310,
-              "y": 160
-            },
-            {
-              "x": 10,
-              "y": 160
-            }
-          ]
-        ],
-        "contentColor": "#ffffff",
-        "contentOutlineColor": "rgba(0, 0, 0, 0)",
-        "paddingColor": "#ffffff",
-        "borderColor": "#ffffff",
-        "marginColor": "#ffffff"
-      }
-    ],
-    "elementData": {
-      "tagName": "iframe",
-      "idValue": "",
-      "className": ".class-one",
-      "size": {
-        "width": 304,
-        "height": 154
-      },
-      "role": "group"
-    }
-  }
-]
+-- Running test case: BadFrameShouldError
+- Frame: Bad Value
+- Selector: div
+PASS: Should throw error: No frame for given id found
 
+-- Running test case: BadSelectorShouldError
+- Frame: <main-frame>
+- Selector: $%foobar
+PASS: Should throw error: DOM Error while querying
 
-PASS: Expected error: No frame for given id found
-SELECTOR: div
-FRAMEID: x.x
+-- Running test case: ChildFrameTagSelector
+- Frame: <child-frame>
+- Selector: div
+PASS: Should highlight 2 element(s).
+Highlighted Elements:
+{"tagName":"div","idValue":"id-one","size":{"width":150,"height":250},"role":""}
+{"tagName":"div","idValue":"","size":{"width":269,"height":0},"role":""}
 
+-- Running test case: ChildFrameIdSelector
+- Frame: <child-frame>
+- Selector: #id-one
+PASS: Should highlight 1 element(s).
+Highlighted Elements:
+{"tagName":"div","idValue":"id-one","size":{"width":150,"height":250},"role":""}
 
-SELECTOR: .no-elements
-FRAMEID: <main-frame-id>
-FOUND: 0
-[]
-
-
-PASS: Expected error: DOM Error while querying
-SELECTOR: $%foobar
-FRAMEID: <main-frame-id>
-
-
-SELECTOR: div
-FRAMEID: <child-frame-id>
-FOUND: 2
-[
-  {
-    "scrollOffset": {
-      "x": 0,
-      "y": 0
-    },
-    "fragments": [
-      {
-        "quads": [
-          [
-            {
-              "x": 18,
-              "y": 18
-            },
-            {
-              "x": 302,
-              "y": 18
-            },
-            {
-              "x": 302,
-              "y": 18
-            },
-            {
-              "x": 18,
-              "y": 18
-            }
-          ],
-          [
-            {
-              "x": 18,
-              "y": 18
-            },
-            {
-              "x": 302,
-              "y": 18
-            },
-            {
-              "x": 302,
-              "y": 18
-            },
-            {
-              "x": 18,
-              "y": 18
-            }
-          ],
-          [
-            {
-              "x": 18,
-              "y": 18
-            },
-            {
-              "x": 302,
-              "y": 18
-            },
-            {
-              "x": 302,
-              "y": 18
-            },
-            {
-              "x": 18,
-              "y": 18
-            }
-          ],
-          [
-            {
-              "x": 18,
-              "y": 18
-            },
-            {
-              "x": 302,
-              "y": 18
-            },
-            {
-              "x": 302,
-              "y": 18
-            },
-            {
-              "x": 18,
-              "y": 18
-            }
-          ]
-        ],
-        "contentColor": "#ffffff",
-        "contentOutlineColor": "rgba(0, 0, 0, 0)",
-        "paddingColor": "#ffffff",
-        "borderColor": "#ffffff",
-        "marginColor": "#ffffff"
-      }
-    ],
-    "elementData": {
-      "tagName": "div",
-      "idValue": "id-one",
-      "size": {
-        "width": 284,
-        "height": 0
-      },
-      "role": ""
-    }
-  },
-  {
-    "scrollOffset": {
-      "x": 0,
-      "y": 0
-    },
-    "fragments": [
-      {
-        "quads": [
-          [
-            {
-              "x": 18,
-              "y": 18
-            },
-            {
-              "x": 302,
-              "y": 18
-            },
-            {
-              "x": 302,
-              "y": 18
-            },
-            {
-              "x": 18,
-              "y": 18
-            }
-          ],
-          [
-            {
-              "x": 18,
-              "y": 18
-            },
-            {
-              "x": 302,
-              "y": 18
-            },
-            {
-              "x": 302,
-              "y": 18
-            },
-            {
-              "x": 18,
-              "y": 18
-            }
-          ],
-          [
-            {
-              "x": 18,
-              "y": 18
-            },
-            {
-              "x": 302,
-              "y": 18
-            },
-            {
-              "x": 302,
-              "y": 18
-            },
-            {
-              "x": 18,
-              "y": 18
-            }
-          ],
-          [
-            {
-              "x": 18,
-              "y": 18
-            },
-            {
-              "x": 302,
-              "y": 18
-            },
-            {
-              "x": 302,
-              "y": 18
-            },
-            {
-              "x": 18,
-              "y": 18
-            }
-          ]
-        ],
-        "contentColor": "#ffffff",
-        "contentOutlineColor": "rgba(0, 0, 0, 0)",
-        "paddingColor": "#ffffff",
-        "borderColor": "#ffffff",
-        "marginColor": "#ffffff"
-      }
-    ],
-    "elementData": {
-      "tagName": "div",
-      "idValue": "",
-      "size": {
-        "width": 284,
-        "height": 0
-      },
-      "role": ""
-    }
-  }
-]
-
-
-SELECTOR: #id-one
-FRAMEID: <child-frame-id>
-FOUND: 1
-[
-  {
-    "scrollOffset": {
-      "x": 0,
-      "y": 0
-    },
-    "fragments": [
-      {
-        "quads": [
-          [
-            {
-              "x": 18,
-              "y": 18
-            },
-            {
-              "x": 302,
-              "y": 18
-            },
-            {
-              "x": 302,
-              "y": 18
-            },
-            {
-              "x": 18,
-              "y": 18
-            }
-          ],
-          [
-            {
-              "x": 18,
-              "y": 18
-            },
-            {
-              "x": 302,
-              "y": 18
-            },
-            {
-              "x": 302,
-              "y": 18
-            },
-            {
-              "x": 18,
-              "y": 18
-            }
-          ],
-          [
-            {
-              "x": 18,
-              "y": 18
-            },
-            {
-              "x": 302,
-              "y": 18
-            },
-            {
-              "x": 302,
-              "y": 18
-            },
-            {
-              "x": 18,
-              "y": 18
-            }
-          ],
-          [
-            {
-              "x": 18,
-              "y": 18
-            },
-            {
-              "x": 302,
-              "y": 18
-            },
-            {
-              "x": 302,
-              "y": 18
-            },
-            {
-              "x": 18,
-              "y": 18
-            }
-          ]
-        ],
-        "contentColor": "#ffffff",
-        "contentOutlineColor": "rgba(0, 0, 0, 0)",
-        "paddingColor": "#ffffff",
-        "borderColor": "#ffffff",
-        "marginColor": "#ffffff"
-      }
-    ],
-    "elementData": {
-      "tagName": "div",
-      "idValue": "id-one",
-      "size": {
-        "width": 284,
-        "height": 0
-      },
-      "role": ""
-    }
-  }
-]
-
-
-

Modified: trunk/LayoutTests/inspector/dom/highlightSelector.html (189415 => 189416)


--- trunk/LayoutTests/inspector/dom/highlightSelector.html	2015-09-05 02:34:22 UTC (rev 189415)
+++ trunk/LayoutTests/inspector/dom/highlightSelector.html	2015-09-05 02:38:42 UTC (rev 189416)
@@ -1,104 +1,141 @@
+<!doctype html>
 <html>
 <head>
-<script type="text/_javascript_" src=""
+<script src=""
 <script>
-function test() {
-    var testcases = [
-        {'frameId': 'MAINFRAME', 'selector': 'div'},
-        {'frameId': 'MAINFRAME', 'selector': '.class-one'},
-        {'frameId': 'MAINFRAME', 'selector': '#id-one'},
-        {'frameId': 'MAINFRAME', 'selector': '.class-one, .class-two'},
-        {'selector': 'iframe.class-one'}, // No frame ID.
-        {'frameId': 'x.x', 'selector': 'div', "error": true}, // Non-existing frame ID.
-        {'frameId': 'MAINFRAME', 'selector': '.no-elements'}, // Non-matching selector.
-        {'frameId': 'MAINFRAME', 'selector': '$%foobar', "error": true}, // Invalid selector.
-        {'frameId': 'CHILDFRAME', 'selector': 'div'},
-        {'frameId': 'CHILDFRAME', 'selector': '#id-one'},
+function test()
+{
+    InspectorTest.assert(WebInspector.frameResourceManager.mainFrame.childFrames.length === 1, "Page should have a subframe.");
+    const mainFrameId = WebInspector.frameResourceManager.mainFrame.id;
+    const childFrameId = WebInspector.frameResourceManager.mainFrame.childFrames[0].id;
+    const highlightConfig = {
+        showInfo: true,
+        contentColor: {r: 255, g: 255, b: 255},
+        paddingColor: {r: 255, g: 255, b: 255},
+        borderColor: {r: 255, g: 255, b: 255},
+        marginColor: {r: 255, g: 255, b: 255},
+    };
+
+    let tests = [
+        {
+            name: "MainFrameTagSelector",
+            frameId: mainFrameId,
+            selector: "div",
+            expectedElements: 3,
+        },
+        {
+            name: "MainFrameWithClassSelector",
+            frameId: mainFrameId,
+            selector: ".class-one",
+            expectedElements: 2,
+        },
+        {
+            name: "MainFrameIdSelector",
+            frameId: mainFrameId,
+            selector: "#id-one",
+            expectedElements: 1,
+        },
+        {
+            name: "MainFrameMultipleSelectors",
+            frameId: mainFrameId,
+            selector: ".class-one, .class-two",
+            expectedElements: 3,
+        },
+        {
+            name: "MissingOptionalFrameIdShouldUseMainFrame",
+            selector: "iframe.class-one",
+            expectedElements: 1,
+        },
+        {
+            name: "MainFrameNonMatchingSelector",
+            frameId: mainFrameId,
+            selector: ".no-elements",
+            expectedElements: 0,
+        },
+        {
+            name: "BadFrameShouldError",
+            frameId: "x.x",
+            selector: "div",
+            expectError: true,
+        },
+        {
+            name: "BadSelectorShouldError",
+            frameId: mainFrameId,
+            selector: "$%foobar",
+            expectError: true,
+        },
+        {
+            name: "ChildFrameTagSelector",
+            frameId: childFrameId,
+            selector: "div",
+            expectedElements: 2,
+        },
+        {
+            name: "ChildFrameIdSelector",
+            frameId: childFrameId,
+            selector: "#id-one",
+            expectedElements: 1,
+        },
     ];
 
-    InspectorTest.assert(WebInspector.frameResourceManager.mainFrame.childFrames.length === 1);
-    var mainFrameId = WebInspector.frameResourceManager.mainFrame.id;
-    var childFrameId = WebInspector.frameResourceManager.mainFrame.childFrames[0].id;
-    for (var test of testcases) {
-        if (test.frameId === "MAINFRAME")
-            test.frameId = mainFrameId;
-        else if (test.frameId === "CHILDFRAME")
-            test.frameId = childFrameId;
-    }
-
     function displayNameForFrameId(frameId) {
+        if (frameId === undefined)
+            return "Not Provided";
         if (frameId === mainFrameId)
-            return "<main-frame-id>";
+            return "<main-frame>";
         if (frameId === childFrameId)
-            return "<child-frame-id>";
-        return frameId;
+            return "<child-frame>";
+        return "Bad Value";
     }
 
-    function getHighlightObjectForSelector(selector, frameId, errorExpected, callback) {
-        var highlightConfig = {
-            showInfo: true,
-            contentColor: {r: 255, g: 255, b: 255},
-            paddingColor: {r: 255, g: 255, b: 255},
-            borderColor: {r: 255, g: 255, b: 255},
-            marginColor: {r: 255, g: 255, b: 255},
-        };
-
-        DOMAgent.highlightSelector(highlightConfig, selector, frameId, highlightSelectorCallback);
-
-        function highlightSelectorCallback(error) {
-            if (errorExpected) {
-                InspectorTest.assert(error, "Missing expected error. Error: " + error);
-
-                if (error)
-                    InspectorTest.log("PASS: Expected error: " + error);
-
-                callback();
-                return;
-            } else
-                InspectorTest.assert(!error, "Error in callback for DOMAgent.highlightSelector: " + error);
-
-            InspectorTest.evaluateInPage("window.internals.inspectorHighlightObject()", receivedHighlightObject);
-        }
-
-        function receivedHighlightObject(error, payload, wasThrown) {
-            InspectorTest.assert(!error, "When evaluating code, received unexpected error:" + error);
-            InspectorTest.assert(!wasThrown, "When evaluating code, an exception was thrown:" + wasThrown);
-
-            var data = ""
-            callback(data);
-        }
+    function getHighlight(callback) {
+        InspectorTest.evaluateInPage("window.internals.inspectorHighlightObject()", (error, payload, wasThrown) => {
+            InspectorTest.assert(!error, "Unexpected error dumping highlight: " + error);
+            InspectorTest.assert(!wasThrown, "Unexpected exception when dumping highlight.");
+            callback(JSON.parse(payload.value));
+        });
     }
 
-    function runNextTest(tests) {
-        var testcase = tests[0];
+    let suite = InspectorTest.createAsyncSuite("DOM.highlightSelector");
 
-        getHighlightObjectForSelector(testcase.selector, testcase.frameId, testcase.error, function(payload) {
-            InspectorTest.log("SELECTOR: " + testcase.selector);
-            InspectorTest.log("FRAMEID: " + displayNameForFrameId(testcase.frameId));
-
-            if (payload) {
-                InspectorTest.log("FOUND: " + payload.length);
-                InspectorTest.log(JSON.stringify(payload, null, 2));
+    for (let testcase of tests) {
+        let {name, frameId, selector, expectedElements, expectError} = testcase;
+        suite.addTestCase({
+            name,
+            test: (resolve, reject) => {
+                InspectorTest.log("- Frame: " + displayNameForFrameId(frameId));
+                InspectorTest.log("- Selector: " + selector);
+                DOMAgent.highlightSelector(highlightConfig, selector, frameId, (error) => {
+                    if (expectError) {
+                        InspectorTest.expectThat(error, "Should throw error: " + error);
+                        resolve();
+                    } else {
+                        InspectorTest.assert(!error, "Should not throw error.");
+                        getHighlight((highlightPayloadList) => {
+                            InspectorTest.expectThat(highlightPayloadList.length === expectedElements, `Should highlight ${expectedElements} element(s).`);
+                            if (highlightPayloadList.length) {
+                                InspectorTest.log("Highlighted Elements:");
+                                for (let highlightPayload of highlightPayloadList)
+                                    InspectorTest.log(JSON.stringify(highlightPayload.elementData));
+                            }
+                            resolve();
+                        });
+                    }
+                });
             }
-
-            InspectorTest.log("\n");
-        
-            if (tests.length > 1)
-                runNextTest(tests.splice(1));
-            else
-                InspectorTest.completeTest();
         });
     }
 
-    runNextTest(testcases);
+    suite.runTestCasesAndFinish();
 }
 </script>
 </head>
 <body _onload_="runTest()">
-    <div>
-        <div class="class-one"></div>
-        <div id="id-one" class="class-two"></div>
-        <iframe class="class-one" src=""
+    <p>Tests for the DOM.highlightSelector command.</p>
+    <div style="width: 500px; height: 500px">
+        <div class="class-one" style="width: 10px; height: 20px"></div>
+        <div id="id-one" class="class-two" style="width:100px; height: 200px"></div>
+        <iframe class="class-one" src=""
     </div>
 </body>
 </html>

Added: trunk/LayoutTests/inspector/dom/resources/highlight-iframe.html (0 => 189416)


--- trunk/LayoutTests/inspector/dom/resources/highlight-iframe.html	                        (rev 0)
+++ trunk/LayoutTests/inspector/dom/resources/highlight-iframe.html	2015-09-05 02:38:42 UTC (rev 189416)
@@ -0,0 +1,8 @@
+<html>
+    <head>
+    </head>
+    <body>
+        <div id="id-one" style="width:150px; height: 250px"></div>
+        <div></div>
+    </body>
+</html>
\ No newline at end of file

Deleted: trunk/LayoutTests/inspector/dom/resources/highlightSelector-iframe.html (189415 => 189416)


--- trunk/LayoutTests/inspector/dom/resources/highlightSelector-iframe.html	2015-09-05 02:34:22 UTC (rev 189415)
+++ trunk/LayoutTests/inspector/dom/resources/highlightSelector-iframe.html	2015-09-05 02:38:42 UTC (rev 189416)
@@ -1,8 +0,0 @@
-<html>
-    <head>
-    </head>
-    <body>
-        <div id="id-one"></div>
-        <div></div>
-    </body>
-</html>
\ No newline at end of file

Modified: trunk/Source/WebCore/ChangeLog (189415 => 189416)


--- trunk/Source/WebCore/ChangeLog	2015-09-05 02:34:22 UTC (rev 189415)
+++ trunk/Source/WebCore/ChangeLog	2015-09-05 02:38:42 UTC (rev 189416)
@@ -1,3 +1,26 @@
+2015-09-04  Joseph Pecoraro  <[email protected]>
+
+        Web Inspector: Add tests for DOM highlight commands
+        https://bugs.webkit.org/show_bug.cgi?id=148786
+
+        Reviewed by Timothy Hatcher.
+
+        Tests: inspector/dom/hideHighlight.html
+               inspector/dom/highlightFrame.html
+               inspector/dom/highlightNode.html
+               inspector/dom/highlightQuad.html
+               inspector/dom/highlightRect.html
+
+        * inspector/InspectorDOMAgent.cpp:
+        (WebCore::InspectorDOMAgent::highlightNode):
+        (WebCore::InspectorDOMAgent::highlightFrame):
+        Include an error if a frame is not found.
+
+        * inspector/InspectorOverlay.cpp:
+        (WebCore::InspectorOverlay::highlightQuad):
+        Should have been checking the usePageCoordinates state of the incoming
+        highlight configuration, not the one that will be replaced.
+
 2015-09-04  Csaba Osztrogonác  <[email protected]>
 
         Remove unnecessary compiler guards from mm files

Modified: trunk/Source/WebCore/inspector/InspectorDOMAgent.cpp (189415 => 189416)


--- trunk/Source/WebCore/inspector/InspectorDOMAgent.cpp	2015-09-05 02:34:22 UTC (rev 189415)
+++ trunk/Source/WebCore/inspector/InspectorDOMAgent.cpp	2015-09-05 02:38:42 UTC (rev 189416)
@@ -1120,10 +1120,10 @@
 
 void InspectorDOMAgent::highlightNode(ErrorString& errorString, const InspectorObject& highlightInspectorObject, const int* nodeId, const String* objectId)
 {
-    Node* node = 0;
-    if (nodeId) {
+    Node* node = nullptr;
+    if (nodeId)
         node = assertNode(errorString, *nodeId);
-    } else if (objectId) {
+    else if (objectId) {
         node = nodeForObjectId(*objectId);
         if (!node)
             errorString = ASCIILiteral("Node for given objectId not found");
@@ -1140,10 +1140,13 @@
     m_overlay->highlightNode(node, *highlightConfig);
 }
 
-void InspectorDOMAgent::highlightFrame(ErrorString&, const String& frameId, const InspectorObject* color, const InspectorObject* outlineColor)
+void InspectorDOMAgent::highlightFrame(ErrorString& errorString, const String& frameId, const InspectorObject* color, const InspectorObject* outlineColor)
 {
-    Frame* frame = m_pageAgent->frameForId(frameId);
-    if (frame && frame->ownerElement()) {
+    Frame* frame = m_pageAgent->assertFrame(errorString, frameId);
+    if (!frame)
+        return;
+
+    if (frame->ownerElement()) {
         auto highlightConfig = std::make_unique<HighlightConfig>();
         highlightConfig->showInfo = true; // Always show tooltips for frames.
         highlightConfig->content = parseColor(color);

Modified: trunk/Source/WebCore/inspector/InspectorOverlay.cpp (189415 => 189416)


--- trunk/Source/WebCore/inspector/InspectorOverlay.cpp	2015-09-05 02:34:22 UTC (rev 189415)
+++ trunk/Source/WebCore/inspector/InspectorOverlay.cpp	2015-09-05 02:38:42 UTC (rev 189416)
@@ -277,7 +277,7 @@
 
 void InspectorOverlay::highlightQuad(std::unique_ptr<FloatQuad> quad, const HighlightConfig& highlightConfig)
 {
-    if (m_quadHighlightConfig.usePageCoordinates)
+    if (highlightConfig.usePageCoordinates)
         *quad -= m_page.mainFrame().view()->scrollOffset();
 
     m_quadHighlightConfig = highlightConfig;

_______________________________________________
webkit-changes mailing list
[email protected]
https://lists.webkit.org/mailman/listinfo/webkit-changes

[webkit-changes] [189416] trunk

Log Message

Modified Paths

Added Paths

Removed Paths

Diff

Modified: trunk/LayoutTests/ChangeLog (189415 => 189416)

Added: trunk/LayoutTests/inspector/dom/hideHighlight-expected.txt (0 => 189416)

Added: trunk/LayoutTests/inspector/dom/hideHighlight.html (0 => 189416)

Added: trunk/LayoutTests/inspector/dom/highlightFrame-expected.txt (0 => 189416)

Added: trunk/LayoutTests/inspector/dom/highlightFrame.html (0 => 189416)

Added: trunk/LayoutTests/inspector/dom/highlightNode-expected.txt (0 => 189416)

Added: trunk/LayoutTests/inspector/dom/highlightNode.html (0 => 189416)

Added: trunk/LayoutTests/inspector/dom/highlightQuad-expected.txt (0 => 189416)

Added: trunk/LayoutTests/inspector/dom/highlightQuad.html (0 => 189416)

Added: trunk/LayoutTests/inspector/dom/highlightRect-expected.txt (0 => 189416)

Added: trunk/LayoutTests/inspector/dom/highlightRect.html (0 => 189416)

Modified: trunk/LayoutTests/inspector/dom/highlightSelector-expected.txt (189415 => 189416)

Modified: trunk/LayoutTests/inspector/dom/highlightSelector.html (189415 => 189416)

Added: trunk/LayoutTests/inspector/dom/resources/highlight-iframe.html (0 => 189416)

Deleted: trunk/LayoutTests/inspector/dom/resources/highlightSelector-iframe.html (189415 => 189416)

Modified: trunk/Source/WebCore/ChangeLog (189415 => 189416)

Modified: trunk/Source/WebCore/inspector/InspectorDOMAgent.cpp (189415 => 189416)

Modified: trunk/Source/WebCore/inspector/InspectorOverlay.cpp (189415 => 189416)

Reply via email to