<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
"http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head><meta http-equiv="content-type" content="text/html; charset=utf-8" />
<title>[189416] trunk</title>
</head>
<body>
<style type="text/css"><!--
#msg dl.meta { border: 1px #006 solid; background: #369; padding: 6px; color: #fff; }
#msg dl.meta dt { float: left; width: 6em; font-weight: bold; }
#msg dt:after { content:':';}
#msg dl, #msg dt, #msg ul, #msg li, #header, #footer, #logmsg { font-family: verdana,arial,helvetica,sans-serif; font-size: 10pt; }
#msg dl a { font-weight: bold}
#msg dl a:link { color:#fc3; }
#msg dl a:active { color:#ff0; }
#msg dl a:visited { color:#cc6; }
h3 { font-family: verdana,arial,helvetica,sans-serif; font-size: 10pt; font-weight: bold; }
#msg pre { overflow: auto; background: #ffc; border: 1px #fa0 solid; padding: 6px; }
#logmsg { background: #ffc; border: 1px #fa0 solid; padding: 1em 1em 0 1em; }
#logmsg p, #logmsg pre, #logmsg blockquote { margin: 0 0 1em 0; }
#logmsg p, #logmsg li, #logmsg dt, #logmsg dd { line-height: 14pt; }
#logmsg h1, #logmsg h2, #logmsg h3, #logmsg h4, #logmsg h5, #logmsg h6 { margin: .5em 0; }
#logmsg h1:first-child, #logmsg h2:first-child, #logmsg h3:first-child, #logmsg h4:first-child, #logmsg h5:first-child, #logmsg h6:first-child { margin-top: 0; }
#logmsg ul, #logmsg ol { padding: 0; list-style-position: inside; margin: 0 0 0 1em; }
#logmsg ul { text-indent: -1em; padding-left: 1em; }#logmsg ol { text-indent: -1.5em; padding-left: 1.5em; }
#logmsg > ul, #logmsg > ol { margin: 0 0 1em 0; }
#logmsg pre { background: #eee; padding: 1em; }
#logmsg blockquote { border: 1px solid #fa0; border-left-width: 10px; padding: 1em 1em 0 1em; background: white;}
#logmsg dl { margin: 0; }
#logmsg dt { font-weight: bold; }
#logmsg dd { margin: 0; padding: 0 0 0.5em 0; }
#logmsg dd:before { content:'\00bb';}
#logmsg table { border-spacing: 0px; border-collapse: collapse; border-top: 4px solid #fa0; border-bottom: 1px solid #fa0; background: #fff; }
#logmsg table th { text-align: left; font-weight: normal; padding: 0.2em 0.5em; border-top: 1px dotted #fa0; }
#logmsg table td { text-align: right; border-top: 1px dotted #fa0; padding: 0.2em 0.5em; }
#logmsg table thead th { text-align: center; border-bottom: 1px solid #fa0; }
#logmsg table th.Corner { text-align: left; }
#logmsg hr { border: none 0; border-top: 2px dashed #fa0; height: 1px; }
#header, #footer { color: #fff; background: #636; border: 1px #300 solid; padding: 6px; }
#patch { width: 100%; }
#patch h4 {font-family: verdana,arial,helvetica,sans-serif;font-size:10pt;padding:8px;background:#369;color:#fff;margin:0;}
#patch .propset h4, #patch .binary h4 {margin:0;}
#patch pre {padding:0;line-height:1.2em;margin:0;}
#patch .diff {width:100%;background:#eee;padding: 0 0 10px 0;overflow:auto;}
#patch .propset .diff, #patch .binary .diff {padding:10px 0;}
#patch span {display:block;padding:0 10px;}
#patch .modfile, #patch .addfile, #patch .delfile, #patch .propset, #patch .binary, #patch .copfile {border:1px solid #ccc;margin:10px 0;}
#patch ins {background:#dfd;text-decoration:none;display:block;padding:0 10px;}
#patch del {background:#fdd;text-decoration:none;display:block;padding:0 10px;}
#patch .lines, .info {color:#888;background:#fff;}
--></style>
<div id="msg">
<dl class="meta">
<dt>Revision</dt> <dd><a href="http://trac.webkit.org/projects/webkit/changeset/189416">189416</a></dd>
<dt>Author</dt> <dd>commit-queue@webkit.org</dd>
<dt>Date</dt> <dd>2015-09-04 19:38:42 -0700 (Fri, 04 Sep 2015)</dd>
</dl>
<h3>Log Message</h3>
<pre>Web Inspector: Add tests for DOM highlight commands
https://bugs.webkit.org/show_bug.cgi?id=148786
Patch by Joseph Pecoraro <pecoraro@apple.com> 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.</pre>
<h3>Modified Paths</h3>
<ul>
<li><a href="#trunkLayoutTestsChangeLog">trunk/LayoutTests/ChangeLog</a></li>
<li><a href="#trunkLayoutTestsinspectordomhighlightSelectorexpectedtxt">trunk/LayoutTests/inspector/dom/highlightSelector-expected.txt</a></li>
<li><a href="#trunkLayoutTestsinspectordomhighlightSelectorhtml">trunk/LayoutTests/inspector/dom/highlightSelector.html</a></li>
<li><a href="#trunkSourceWebCoreChangeLog">trunk/Source/WebCore/ChangeLog</a></li>
<li><a href="#trunkSourceWebCoreinspectorInspectorDOMAgentcpp">trunk/Source/WebCore/inspector/InspectorDOMAgent.cpp</a></li>
<li><a href="#trunkSourceWebCoreinspectorInspectorOverlaycpp">trunk/Source/WebCore/inspector/InspectorOverlay.cpp</a></li>
</ul>
<h3>Added Paths</h3>
<ul>
<li><a href="#trunkLayoutTestsinspectordomhideHighlightexpectedtxt">trunk/LayoutTests/inspector/dom/hideHighlight-expected.txt</a></li>
<li><a href="#trunkLayoutTestsinspectordomhideHighlighthtml">trunk/LayoutTests/inspector/dom/hideHighlight.html</a></li>
<li><a href="#trunkLayoutTestsinspectordomhighlightFrameexpectedtxt">trunk/LayoutTests/inspector/dom/highlightFrame-expected.txt</a></li>
<li><a href="#trunkLayoutTestsinspectordomhighlightFramehtml">trunk/LayoutTests/inspector/dom/highlightFrame.html</a></li>
<li><a href="#trunkLayoutTestsinspectordomhighlightNodeexpectedtxt">trunk/LayoutTests/inspector/dom/highlightNode-expected.txt</a></li>
<li><a href="#trunkLayoutTestsinspectordomhighlightNodehtml">trunk/LayoutTests/inspector/dom/highlightNode.html</a></li>
<li><a href="#trunkLayoutTestsinspectordomhighlightQuadexpectedtxt">trunk/LayoutTests/inspector/dom/highlightQuad-expected.txt</a></li>
<li><a href="#trunkLayoutTestsinspectordomhighlightQuadhtml">trunk/LayoutTests/inspector/dom/highlightQuad.html</a></li>
<li><a href="#trunkLayoutTestsinspectordomhighlightRectexpectedtxt">trunk/LayoutTests/inspector/dom/highlightRect-expected.txt</a></li>
<li><a href="#trunkLayoutTestsinspectordomhighlightRecthtml">trunk/LayoutTests/inspector/dom/highlightRect.html</a></li>
<li><a href="#trunkLayoutTestsinspectordomresourceshighlightiframehtml">trunk/LayoutTests/inspector/dom/resources/highlight-iframe.html</a></li>
</ul>
<h3>Removed Paths</h3>
<ul>
<li><a href="#trunkLayoutTestsinspectordomresourceshighlightSelectoriframehtml">trunk/LayoutTests/inspector/dom/resources/highlightSelector-iframe.html</a></li>
</ul>
</div>
<div id="patch">
<h3>Diff</h3>
<a id="trunkLayoutTestsChangeLog"></a>
<div class="modfile"><h4>Modified: trunk/LayoutTests/ChangeLog (189415 => 189416)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/ChangeLog 2015-09-05 02:34:22 UTC (rev 189415)
+++ trunk/LayoutTests/ChangeLog 2015-09-05 02:38:42 UTC (rev 189416)
</span><span class="lines">@@ -1,5 +1,26 @@
</span><span class="cx"> 2015-09-04 Joseph Pecoraro <pecoraro@apple.com>
</span><span class="cx">
</span><ins>+ 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 <pecoraro@apple.com>
+
</ins><span class="cx"> Web Inspector: Test Runtime.saveResult and $n values
</span><span class="cx"> https://bugs.webkit.org/show_bug.cgi?id=148837
</span><span class="cx">
</span></span></pre></div>
<a id="trunkLayoutTestsinspectordomhideHighlightexpectedtxt"></a>
<div class="addfile"><h4>Added: trunk/LayoutTests/inspector/dom/hideHighlight-expected.txt (0 => 189416)</h4>
<pre class="diff"><span>
<span class="info">--- 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)
</span><span class="lines">@@ -0,0 +1,31 @@
</span><ins>+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.
+
</ins></span></pre></div>
<a id="trunkLayoutTestsinspectordomhideHighlighthtml"></a>
<div class="addfile"><h4>Added: trunk/LayoutTests/inspector/dom/hideHighlight.html (0 => 189416)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/inspector/dom/hideHighlight.html (rev 0)
+++ trunk/LayoutTests/inspector/dom/hideHighlight.html 2015-09-05 02:38:42 UTC (rev 189416)
</span><span class="lines">@@ -0,0 +1,130 @@
</span><ins>+<!doctype html>
+<html>
+<head>
+<script src="../../http/tests/inspector/resources/inspector-test.js"></script>
+<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>
</ins></span></pre></div>
<a id="trunkLayoutTestsinspectordomhighlightFrameexpectedtxt"></a>
<div class="addfile"><h4>Added: trunk/LayoutTests/inspector/dom/highlightFrame-expected.txt (0 => 189416)</h4>
<pre class="diff"><span>
<span class="info">--- 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)
</span><span class="lines">@@ -0,0 +1,21 @@
</span><ins>+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
+
</ins></span></pre></div>
<a id="trunkLayoutTestsinspectordomhighlightFramehtml"></a>
<div class="addfile"><h4>Added: trunk/LayoutTests/inspector/dom/highlightFrame.html (0 => 189416)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/inspector/dom/highlightFrame.html (rev 0)
+++ trunk/LayoutTests/inspector/dom/highlightFrame.html 2015-09-05 02:38:42 UTC (rev 189416)
</span><span class="lines">@@ -0,0 +1,101 @@
</span><ins>+<!doctype html>
+<html>
+<head>
+<script src="../../http/tests/inspector/resources/inspector-test.js"></script>
+<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="resources/highlight-iframe.html"></iframe>
+ <iframe id="frame-2" src="resources/highlight-iframe.html"></iframe>
+ </div>
+</body>
+</html>
</ins></span></pre></div>
<a id="trunkLayoutTestsinspectordomhighlightNodeexpectedtxt"></a>
<div class="addfile"><h4>Added: trunk/LayoutTests/inspector/dom/highlightNode-expected.txt (0 => 189416)</h4>
<pre class="diff"><span>
<span class="info">--- 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)
</span><span class="lines">@@ -0,0 +1,36 @@
</span><ins>+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
+
</ins></span></pre></div>
<a id="trunkLayoutTestsinspectordomhighlightNodehtml"></a>
<div class="addfile"><h4>Added: trunk/LayoutTests/inspector/dom/highlightNode.html (0 => 189416)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/inspector/dom/highlightNode.html (rev 0)
+++ trunk/LayoutTests/inspector/dom/highlightNode.html 2015-09-05 02:38:42 UTC (rev 189416)
</span><span class="lines">@@ -0,0 +1,166 @@
</span><ins>+<!doctype html>
+<html>
+<head>
+<script src="../../http/tests/inspector/resources/inspector-test.js"></script>
+<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="resources/highlight-iframe.html"></iframe>
+ </div>
+</body>
+</html>
</ins></span></pre></div>
<a id="trunkLayoutTestsinspectordomhighlightQuadexpectedtxt"></a>
<div class="addfile"><h4>Added: trunk/LayoutTests/inspector/dom/highlightQuad-expected.txt (0 => 189416)</h4>
<pre class="diff"><span>
<span class="info">--- 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)
</span><span class="lines">@@ -0,0 +1,35 @@
</span><ins>+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
+
</ins></span></pre></div>
<a id="trunkLayoutTestsinspectordomhighlightQuadhtml"></a>
<div class="addfile"><h4>Added: trunk/LayoutTests/inspector/dom/highlightQuad.html (0 => 189416)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/inspector/dom/highlightQuad.html (rev 0)
+++ trunk/LayoutTests/inspector/dom/highlightQuad.html 2015-09-05 02:38:42 UTC (rev 189416)
</span><span class="lines">@@ -0,0 +1,134 @@
</span><ins>+<!doctype html>
+<html>
+<head>
+<script src="../../http/tests/inspector/resources/inspector-test.js"></script>
+<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>
</ins></span></pre></div>
<a id="trunkLayoutTestsinspectordomhighlightRectexpectedtxt"></a>
<div class="addfile"><h4>Added: trunk/LayoutTests/inspector/dom/highlightRect-expected.txt (0 => 189416)</h4>
<pre class="diff"><span>
<span class="info">--- 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)
</span><span class="lines">@@ -0,0 +1,31 @@
</span><ins>+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}
+
</ins></span></pre></div>
<a id="trunkLayoutTestsinspectordomhighlightRecthtml"></a>
<div class="addfile"><h4>Added: trunk/LayoutTests/inspector/dom/highlightRect.html (0 => 189416)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/inspector/dom/highlightRect.html (rev 0)
+++ trunk/LayoutTests/inspector/dom/highlightRect.html 2015-09-05 02:38:42 UTC (rev 189416)
</span><span class="lines">@@ -0,0 +1,119 @@
</span><ins>+<!doctype html>
+<html>
+<head>
+<script src="../../http/tests/inspector/resources/inspector-test.js"></script>
+<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>
</ins></span></pre></div>
<a id="trunkLayoutTestsinspectordomhighlightSelectorexpectedtxt"></a>
<div class="modfile"><h4>Modified: trunk/LayoutTests/inspector/dom/highlightSelector-expected.txt (189415 => 189416)</h4>
<pre class="diff"><span>
<span class="info">--- 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)
</span><span class="lines">@@ -1,1350 +1,75 @@
</span><ins>+Tests for the DOM.highlightSelector command.
</ins><span class="cx">
</span><del>-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": ""
- }
- }
-]
</del><span class="cx">
</span><span class="cx">
</span><del>-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"
- }
- }
-]
</del><ins>+== 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":""}
</ins><span class="cx">
</span><ins>+-- 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"}
</ins><span class="cx">
</span><del>-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": ""
- }
- }
-]
</del><ins>+-- 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":""}
</ins><span class="cx">
</span><ins>+-- 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"}
</ins><span class="cx">
</span><del>-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"
- }
- }
-]
</del><ins>+-- 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"}
</ins><span class="cx">
</span><ins>+-- Running test case: MainFrameNonMatchingSelector
+- Frame: <main-frame>
+- Selector: .no-elements
+PASS: Should highlight 0 element(s).
</ins><span class="cx">
</span><del>-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"
- }
- }
-]
</del><ins>+-- Running test case: BadFrameShouldError
+- Frame: Bad Value
+- Selector: div
+PASS: Should throw error: No frame for given id found
</ins><span class="cx">
</span><ins>+-- Running test case: BadSelectorShouldError
+- Frame: <main-frame>
+- Selector: $%foobar
+PASS: Should throw error: DOM Error while querying
</ins><span class="cx">
</span><del>-PASS: Expected error: No frame for given id found
-SELECTOR: div
-FRAMEID: x.x
</del><ins>+-- 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":""}
</ins><span class="cx">
</span><ins>+-- 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":""}
</ins><span class="cx">
</span><del>-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": ""
- }
- }
-]
-
-
-
</del></span></pre></div>
<a id="trunkLayoutTestsinspectordomhighlightSelectorhtml"></a>
<div class="modfile"><h4>Modified: trunk/LayoutTests/inspector/dom/highlightSelector.html (189415 => 189416)</h4>
<pre class="diff"><span>
<span class="info">--- 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)
</span><span class="lines">@@ -1,104 +1,141 @@
</span><ins>+<!doctype html>
</ins><span class="cx"> <html>
</span><span class="cx"> <head>
</span><del>-<script type="text/javascript" src="../../http/tests/inspector/resources/inspector-test.js"></script>
</del><ins>+<script src="../../http/tests/inspector/resources/inspector-test.js"></script>
</ins><span class="cx"> <script>
</span><del>-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'},
</del><ins>+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,
+ },
</ins><span class="cx"> ];
</span><span class="cx">
</span><del>- 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;
- }
-
</del><span class="cx"> function displayNameForFrameId(frameId) {
</span><ins>+ if (frameId === undefined)
+ return "Not Provided";
</ins><span class="cx"> if (frameId === mainFrameId)
</span><del>- return "<main-frame-id>";
</del><ins>+ return "<main-frame>";
</ins><span class="cx"> if (frameId === childFrameId)
</span><del>- return "<child-frame-id>";
- return frameId;
</del><ins>+ return "<child-frame>";
+ return "Bad Value";
</ins><span class="cx"> }
</span><span class="cx">
</span><del>- 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 = JSON.parse(payload.value);
- callback(data);
- }
</del><ins>+ 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));
+ });
</ins><span class="cx"> }
</span><span class="cx">
</span><del>- function runNextTest(tests) {
- var testcase = tests[0];
</del><ins>+ let suite = InspectorTest.createAsyncSuite("DOM.highlightSelector");
</ins><span class="cx">
</span><del>- 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));
</del><ins>+ 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();
+ });
+ }
+ });
</ins><span class="cx"> }
</span><del>-
- InspectorTest.log("\n");
-
- if (tests.length > 1)
- runNextTest(tests.splice(1));
- else
- InspectorTest.completeTest();
</del><span class="cx"> });
</span><span class="cx"> }
</span><span class="cx">
</span><del>- runNextTest(testcases);
</del><ins>+ suite.runTestCasesAndFinish();
</ins><span class="cx"> }
</span><span class="cx"> </script>
</span><span class="cx"> </head>
</span><span class="cx"> <body onload="runTest()">
</span><del>- <div>
- <div class="class-one"></div>
- <div id="id-one" class="class-two"></div>
- <iframe class="class-one" src="resources/highlightSelector-iframe.html"></iframe>
</del><ins>+ <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="resources/highlight-iframe.html"></iframe>
</ins><span class="cx"> </div>
</span><span class="cx"> </body>
</span><span class="cx"> </html>
</span></span></pre></div>
<a id="trunkLayoutTestsinspectordomresourceshighlightiframehtml"></a>
<div class="addfile"><h4>Added: trunk/LayoutTests/inspector/dom/resources/highlight-iframe.html (0 => 189416)</h4>
<pre class="diff"><span>
<span class="info">--- 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)
</span><span class="lines">@@ -0,0 +1,8 @@
</span><ins>+<html>
+ <head>
+ </head>
+ <body>
+ <div id="id-one" style="width:150px; height: 250px"></div>
+ <div></div>
+ </body>
+</html>
</ins><span class="cx">\ No newline at end of file
</span></span></pre></div>
<a id="trunkLayoutTestsinspectordomresourceshighlightSelectoriframehtml"></a>
<div class="delfile"><h4>Deleted: trunk/LayoutTests/inspector/dom/resources/highlightSelector-iframe.html (189415 => 189416)</h4>
<pre class="diff"><span>
<span class="info">--- 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)
</span><span class="lines">@@ -1,8 +0,0 @@
</span><del>-<html>
- <head>
- </head>
- <body>
- <div id="id-one"></div>
- <div></div>
- </body>
-</html>
</del><span class="cx">\ No newline at end of file
</span></span></pre></div>
<a id="trunkSourceWebCoreChangeLog"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebCore/ChangeLog (189415 => 189416)</h4>
<pre class="diff"><span>
<span class="info">--- 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)
</span><span class="lines">@@ -1,3 +1,26 @@
</span><ins>+2015-09-04 Joseph Pecoraro <pecoraro@apple.com>
+
+ 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.
+
</ins><span class="cx"> 2015-09-04 Csaba Osztrogonác <ossy@webkit.org>
</span><span class="cx">
</span><span class="cx"> Remove unnecessary compiler guards from mm files
</span></span></pre></div>
<a id="trunkSourceWebCoreinspectorInspectorDOMAgentcpp"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebCore/inspector/InspectorDOMAgent.cpp (189415 => 189416)</h4>
<pre class="diff"><span>
<span class="info">--- 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)
</span><span class="lines">@@ -1120,10 +1120,10 @@
</span><span class="cx">
</span><span class="cx"> void InspectorDOMAgent::highlightNode(ErrorString& errorString, const InspectorObject& highlightInspectorObject, const int* nodeId, const String* objectId)
</span><span class="cx"> {
</span><del>- Node* node = 0;
- if (nodeId) {
</del><ins>+ Node* node = nullptr;
+ if (nodeId)
</ins><span class="cx"> node = assertNode(errorString, *nodeId);
</span><del>- } else if (objectId) {
</del><ins>+ else if (objectId) {
</ins><span class="cx"> node = nodeForObjectId(*objectId);
</span><span class="cx"> if (!node)
</span><span class="cx"> errorString = ASCIILiteral("Node for given objectId not found");
</span><span class="lines">@@ -1140,10 +1140,13 @@
</span><span class="cx"> m_overlay->highlightNode(node, *highlightConfig);
</span><span class="cx"> }
</span><span class="cx">
</span><del>-void InspectorDOMAgent::highlightFrame(ErrorString&, const String& frameId, const InspectorObject* color, const InspectorObject* outlineColor)
</del><ins>+void InspectorDOMAgent::highlightFrame(ErrorString& errorString, const String& frameId, const InspectorObject* color, const InspectorObject* outlineColor)
</ins><span class="cx"> {
</span><del>- Frame* frame = m_pageAgent->frameForId(frameId);
- if (frame && frame->ownerElement()) {
</del><ins>+ Frame* frame = m_pageAgent->assertFrame(errorString, frameId);
+ if (!frame)
+ return;
+
+ if (frame->ownerElement()) {
</ins><span class="cx"> auto highlightConfig = std::make_unique<HighlightConfig>();
</span><span class="cx"> highlightConfig->showInfo = true; // Always show tooltips for frames.
</span><span class="cx"> highlightConfig->content = parseColor(color);
</span></span></pre></div>
<a id="trunkSourceWebCoreinspectorInspectorOverlaycpp"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebCore/inspector/InspectorOverlay.cpp (189415 => 189416)</h4>
<pre class="diff"><span>
<span class="info">--- 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)
</span><span class="lines">@@ -277,7 +277,7 @@
</span><span class="cx">
</span><span class="cx"> void InspectorOverlay::highlightQuad(std::unique_ptr<FloatQuad> quad, const HighlightConfig& highlightConfig)
</span><span class="cx"> {
</span><del>- if (m_quadHighlightConfig.usePageCoordinates)
</del><ins>+ if (highlightConfig.usePageCoordinates)
</ins><span class="cx"> *quad -= m_page.mainFrame().view()->scrollOffset();
</span><span class="cx">
</span><span class="cx"> m_quadHighlightConfig = highlightConfig;
</span></span></pre>
</div>
</div>
</body>
</html>