wine/gecko
0
0
Fork 0
mirror of https://gitlab.winehq.org/wine/wine-gecko.git synced 2024-09-13 09:24:08 -07:00
Code Issues Packages Projects Releases Wiki Activity

Bug 993445 - Highlight nodes on hover of breadcrumbs. r=pbrosset, r=bgrins

Browse Source
This commit is contained in:
Jayesh Choudhari 2014-07-30 15:46:00 -04:00
parent f8d8d32ab3
commit db748e586e
3 changed files with 52 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

19
browser/devtools/inspector/breadcrumbs.js
View File

@ -88,6 +88,8 @@ HTMLBreadcrumbs.prototype = {
this.container.addEventListener("mousedown", this, true);
this.container.addEventListener("keypress", this, true);
this.container.addEventListener("mouseover", this, true);
this.container.addEventListener("mouseleave", this, true);
// We will save a list of already displayed nodes in this array.
this.nodeHierarchy = [];
@ -373,6 +375,17 @@ HTMLBreadcrumbs.prototype = {
event.preventDefault();
event.stopPropagation();
}
if (event.type == "mouseover") {
let target = event.originalTarget;
if (target.tagName == "button") {
target.onBreadcrumbsHover();
}
}
if (event.type == "mouseleave") {
this.inspector.toolbox.highlighterUtils.unhighlight();
}
},
/**
@ -392,6 +405,8 @@ HTMLBreadcrumbs.prototype = {
this.empty();
this.container.removeEventListener("mousedown", this, true);
this.container.removeEventListener("keypress", this, true);
this.container.removeEventListener("mouseover", this, true);
this.container.removeEventListener("mouseleave", this, true);
this.container = null;
this.separators.remove();
@ -486,6 +501,10 @@ HTMLBreadcrumbs.prototype = {
this.selection.setNodeFront(aNode, "breadcrumbs");
};
button.onBreadcrumbsHover = () => {
this.inspector.toolbox.highlighterUtils.highlightNodeFront(aNode);
};
button.onclick = (function _onBreadcrumbsRightClick(event) {
button.focus();
if (event.button == 2) {

1
browser/devtools/inspector/test/browser.ini
View File

@ -20,6 +20,7 @@ support-files =
head.js
[browser_inspector_breadcrumbs.js]
[browser_inspector_breadcrumbs_highlight_hover.js]
[browser_inspector_delete-selected-node-01.js]
[browser_inspector_delete-selected-node-02.js]
[browser_inspector_delete-selected-node-03.js]

32
browser/devtools/inspector/test/browser_inspector_breadcrumbs_highlight_hover.js Normal file
View File

@ -0,0 +1,32 @@
/* This Source Code Form is subject to the terms of the Mozilla Public
* License, v. 2.0. If a copy of the MPL was not distributed with this
* file, You can obtain one at http://mozilla.org/MPL/2.0/. */
"use strict";
// Test that hovering over nodes on the breadcrumb buttons in the inspector shows the highlighter over
// those nodes
let test = asyncTest(function*() {
info("Loading the test document and opening the inspector");
yield addTab("data:text/html;charset=utf-8,<h1>foo</h1><span>bar</span>");
let {toolbox, inspector} = yield openInspector();
info("Selecting the test node");
yield selectNode("span", inspector);
let bcButtons = inspector.breadcrumbs["container"];
let onNodeHighlighted = toolbox.once("node-highlight");
let button = bcButtons.childNodes[1];
EventUtils.synthesizeMouseAtCenter(button, {type: "mousemove"}, button.ownerDocument.defaultView);
yield onNodeHighlighted;
ok(isHighlighting(), "The highlighter is shown on a markup container hover");
is(getHighlitNode(), getNode("body"), "The highlighter highlights the right node");
let onNodeHighlighted = toolbox.once("node-highlight");
let button = bcButtons.childNodes[2];
EventUtils.synthesizeMouseAtCenter(button, {type: "mousemove"}, button.ownerDocument.defaultView);
yield onNodeHighlighted;
ok(isHighlighting(), "The highlighter is shown on a markup container hover");
is(getHighlitNode(), getNode("span"), "The highlighter highlights the right node");
gBrowser.removeCurrentTab();
});