--- a/devtools/client/inspector/breadcrumbs.js
+++ b/devtools/client/inspector/breadcrumbs.js
@@ -358,54 +358,54 @@ ArrowScrollBox.prototype = {
* else select the node;
* - If the selected node is the last node displayed, append its first (if any).
*
* @param {InspectorPanel} inspector The inspector hosting this widget.
*/
function HTMLBreadcrumbs(inspector) {
this.inspector = inspector;
this.selection = this.inspector.selection;
- this.chromeWin = this.inspector.panelWin;
- this.chromeDoc = this.inspector.panelDoc;
+ this.win = this.inspector.panelWin;
+ this.doc = this.inspector.panelDoc;
this._init();
}
exports.HTMLBreadcrumbs = HTMLBreadcrumbs;
HTMLBreadcrumbs.prototype = {
get walker() {
return this.inspector.walker;
},
_init: function () {
- this.outer = this.chromeDoc.getElementById("inspector-breadcrumbs");
+ this.outer = this.doc.getElementById("inspector-breadcrumbs");
this.arrowScrollBox = new ArrowScrollBox(
- this.chromeWin,
+ this.win,
this.outer);
this.container = this.arrowScrollBox.inner;
this.scroll = this.scroll.bind(this);
this.arrowScrollBox.on("overflow", this.scroll);
// These separators are used for CSS purposes only, and are positioned
// off screen, but displayed with -moz-element.
- this.separators = this.chromeDoc.createElementNS(NS_XHTML, "div");
+ this.separators = this.doc.createElementNS(NS_XHTML, "div");
this.separators.className = "breadcrumb-separator-container";
this.separators.innerHTML =
"<div id='breadcrumb-separator-before'></div>" +
"<div id='breadcrumb-separator-after'></div>" +
"<div id='breadcrumb-separator-normal'></div>";
this.container.parentNode.appendChild(this.separators);
this.outer.addEventListener("click", this, true);
this.outer.addEventListener("mouseover", this, true);
this.outer.addEventListener("mouseout", this, true);
this.outer.addEventListener("focus", this, true);
- this.shortcuts = new KeyShortcuts({ window: this.chromeWin, target: this.outer });
+ this.shortcuts = new KeyShortcuts({ window: this.win, target: this.outer });
this.handleShortcut = this.handleShortcut.bind(this);
this.shortcuts.on("Right", this.handleShortcut);
this.shortcuts.on("Left", this.handleShortcut);
// We will save a list of already displayed nodes in this array.
this.nodeHierarchy = [];
@@ -458,26 +458,26 @@ HTMLBreadcrumbs.prototype = {
* Build <span>s that represent the node:
* <span class="breadcrumbs-widget-item-tag">tagName</span>
* <span class="breadcrumbs-widget-item-id">#id</span>
* <span class="breadcrumbs-widget-item-classes">.class1.class2</span>
* @param {NodeFront} node The node to pretty-print
* @returns {DocumentFragment}
*/
prettyPrintNodeAsXHTML: function (node) {
- let tagLabel = this.chromeDoc.createElementNS(NS_XHTML, "span");
+ let tagLabel = this.doc.createElementNS(NS_XHTML, "span");
tagLabel.className = "breadcrumbs-widget-item-tag plain";
- let idLabel = this.chromeDoc.createElementNS(NS_XHTML, "span");
+ let idLabel = this.doc.createElementNS(NS_XHTML, "span");
idLabel.className = "breadcrumbs-widget-item-id plain";
- let classesLabel = this.chromeDoc.createElementNS(NS_XHTML, "span");
+ let classesLabel = this.doc.createElementNS(NS_XHTML, "span");
classesLabel.className = "breadcrumbs-widget-item-classes plain";
- let pseudosLabel = this.chromeDoc.createElementNS(NS_XHTML, "span");
+ let pseudosLabel = this.doc.createElementNS(NS_XHTML, "span");
pseudosLabel.className = "breadcrumbs-widget-item-pseudo-classes plain";
let tagText = node.displayName;
if (node.isPseudoElement) {
tagText = node.isBeforePseudoElement ? "::before" : "::after";
}
let idText = node.id ? ("#" + node.id) : "";
let classesText = "";
@@ -506,17 +506,17 @@ HTMLBreadcrumbs.prototype = {
classesText = classesText.substr(0, maxClassLength) + ELLIPSIS;
}
tagLabel.textContent = tagText;
idLabel.textContent = idText;
classesLabel.textContent = classesText;
pseudosLabel.textContent = node.pseudoClassLocks.join("");
- let fragment = this.chromeDoc.createDocumentFragment();
+ let fragment = this.doc.createDocumentFragment();
fragment.appendChild(tagLabel);
fragment.appendChild(idLabel);
fragment.appendChild(classesLabel);
fragment.appendChild(pseudosLabel);
return fragment;
},
@@ -661,19 +661,16 @@ HTMLBreadcrumbs.prototype = {
setCursor: function (index) {
// Unselect the previously selected button
if (this.currentIndex > -1
&& this.currentIndex < this.nodeHierarchy.length) {
this.nodeHierarchy[this.currentIndex].button.removeAttribute("checked");
}
if (index > -1) {
this.nodeHierarchy[index].button.setAttribute("checked", "true");
- if (this.hadFocus) {
- this.nodeHierarchy[index].button.focus();
- }
} else {
// Unset active active descendant when all buttons are unselected.
this.outer.removeAttribute("aria-activedescendant");
}
this.currentIndex = index;
},
/**
@@ -703,17 +700,17 @@ HTMLBreadcrumbs.prototype = {
},
/**
* Build a button representing the node.
* @param {NodeFront} node The node from the page.
* @return {DOMNode} The <button> for this node.
*/
buildButton: function (node) {
- let button = this.chromeDoc.createElementNS(NS_XHTML, "button");
+ let button = this.doc.createElementNS(NS_XHTML, "button");
button.appendChild(this.prettyPrintNodeAsXHTML(node));
button.className = "breadcrumbs-widget-item";
button.id = "breadcrumbs-widget-item-" + this.breadcrumbsWidgetItemId++;
button.setAttribute("tabindex", "-1");
button.setAttribute("title", this.prettyPrintNodeAsText(node));
button.onclick = () => {
@@ -731,17 +728,17 @@ HTMLBreadcrumbs.prototype = {
return button;
},
/**
* Connecting the end of the breadcrumbs to a node.
* @param {NodeFront} node The node to reach.
*/
expand: function (node) {
- let fragment = this.chromeDoc.createDocumentFragment();
+ let fragment = this.doc.createDocumentFragment();
let lastButtonInserted = null;
let originalLength = this.nodeHierarchy.length;
let stopNode = null;
if (originalLength > 0) {
stopNode = this.nodeHierarchy[originalLength - 1].node;
}
while (node && node != stopNode) {
if (node.tagName) {
@@ -856,20 +853,16 @@ HTMLBreadcrumbs.prototype = {
return;
}
let hasInterestingMutations = this._hasInterestingMutations(mutations);
if (reason === "markupmutation" && !hasInterestingMutations) {
return;
}
- let cmdDispatcher = this.chromeDoc.commandDispatcher;
- this.hadFocus = (cmdDispatcher.focusedElement &&
- cmdDispatcher.focusedElement.parentNode == this.container);
-
if (!this.selection.isConnected()) {
// remove all the crumbs
this.cutAfter(-1);
return;
}
// If this was an interesting deletion; then trim the breadcrumb trail
let trimmed = false;