--- a/devtools/client/shared/autocomplete-popup.js
+++ b/devtools/client/shared/autocomplete-popup.js
@@ -151,18 +151,16 @@ AutocompletePopup.prototype = {
}
this.selectedIndex = index;
},
/**
* Hide the autocomplete popup panel.
*/
hidePopup: function () {
- // Return accessibility focus to the input.
- this._findActiveElement().removeAttribute("aria-activedescendant");
this._tooltip.once("hidden", () => {
this.emit("popup-closed");
});
this._tooltip.hide();
},
/**
* Check if the autocomplete popup is open.
@@ -281,47 +279,16 @@ AutocompletePopup.prototype = {
element.scrollIntoView(true);
} else if ((top + height) > containerHeight) {
// Element is beloew container.
element.scrollIntoView(false);
}
},
/**
- * Update accessibility appropriately when the selected item is changed.
- */
- _updateAriaActiveDescendant: function () {
- let activeElement = this._findActiveElement();
- if (!activeElement) {
- return;
- }
-
- if (this.selectedItem) {
- // Focus this for accessibility so users know about the selected item.
- let selectedElement = this.elements.get(this.selectedItem);
- activeElement.setAttribute("aria-activedescendant", selectedElement.id);
- } else {
- // Return accessibility focus to the input.
- activeElement.removeAttribute("aria-activedescendant");
- }
- },
-
- /**
- * Find the active element if it belongs in a child document of the autocomplete
- * document.
- */
- _findActiveElement: function () {
- let activeElement = this._document.activeElement;
- while (activeElement && activeElement.contentDocument) {
- activeElement = activeElement.contentDocument.activeElement;
- }
- return activeElement;
- },
-
- /**
* Clear all the items from the autocomplete list.
*/
clearItems: function () {
// Reset the selectedIndex to -1 before clearing the list
this.selectedIndex = -1;
this._list.innerHTML = "";
this.__maxLabelLength = -1;
this.items = [];
@@ -352,17 +319,16 @@ AutocompletePopup.prototype = {
let item = this.items[index];
if (this.isOpen && item) {
let element = this.elements.get(item);
element.classList.add("autocomplete-selected");
this._scrollElementIntoViewIfNeeded(element);
}
this._selectedIndex = index;
- this._updateAriaActiveDescendant();
if (this.isOpen && item && this.onSelectCallback) {
// Call the user-defined select callback if defined.
this.onSelectCallback();
}
},
/**
--- a/devtools/client/webconsole/test/browser_webconsole_bug_585991_autocomplete_popup.js
+++ b/devtools/client/webconsole/test/browser_webconsole_bug_585991_autocomplete_popup.js
@@ -21,104 +21,79 @@ function consoleOpened(HUD) {
let items = [
{label: "item0", value: "value0"},
{label: "item1", value: "value1"},
{label: "item2", value: "value2"},
];
let popup = HUD.jsterm.autocompletePopup;
- let input = popup._findActiveElement();
- function getActiveDescendant() {
- let descendantId = input.getAttribute("aria-activedescendant");
- return popup._tooltip.panel.querySelector("#" + descendantId);
- }
-
ok(!popup.isOpen, "popup is not open");
- ok(!input.hasAttribute("aria-activedescendant"), "no aria-activedescendant");
popup.once("popup-opened", () => {
ok(popup.isOpen, "popup is open");
is(popup.itemCount, 0, "no items");
- ok(!input.hasAttribute("aria-activedescendant"), "no aria-activedescendant");
popup.setItems(items);
is(popup.itemCount, items.length, "items added");
let sameItems = popup.getItems();
is(sameItems.every(function (item, index) {
return item === items[index];
}), true, "getItems returns back the same items");
is(popup.selectedIndex, 2, "Index of the first item from bottom is selected.");
is(popup.selectedItem, items[2], "First item from bottom is selected");
- ok(getActiveDescendant().classList.contains("autocomplete-selected"),
- "aria-activedescendant is correct");
popup.selectedIndex = 1;
is(popup.selectedIndex, 1, "index 1 is selected");
is(popup.selectedItem, items[1], "item1 is selected");
- ok(getActiveDescendant().classList.contains("autocomplete-selected"),
- "aria-activedescendant is correct");
popup.selectedItem = items[2];
is(popup.selectedIndex, 2, "index 2 is selected");
is(popup.selectedItem, items[2], "item2 is selected");
- ok(getActiveDescendant().classList.contains("autocomplete-selected"),
- "aria-activedescendant is correct");
is(popup.selectPreviousItem(), items[1], "selectPreviousItem() works");
is(popup.selectedIndex, 1, "index 1 is selected");
is(popup.selectedItem, items[1], "item1 is selected");
- ok(getActiveDescendant().classList.contains("autocomplete-selected"),
- "aria-activedescendant is correct");
is(popup.selectNextItem(), items[2], "selectNextItem() works");
is(popup.selectedIndex, 2, "index 2 is selected");
is(popup.selectedItem, items[2], "item2 is selected");
- ok(getActiveDescendant().classList.contains("autocomplete-selected"),
- "aria-activedescendant is correct");
ok(popup.selectNextItem(), "selectNextItem() works");
is(popup.selectedIndex, 0, "index 0 is selected");
is(popup.selectedItem, items[0], "item0 is selected");
- ok(getActiveDescendant().classList.contains("autocomplete-selected"),
- "aria-activedescendant is correct");
items.push({label: "label3", value: "value3"});
popup.appendItem(items[3]);
is(popup.itemCount, items.length, "item3 appended");
popup.selectedIndex = 3;
is(popup.selectedItem, items[3], "item3 is selected");
- ok(getActiveDescendant().classList.contains("autocomplete-selected"),
- "aria-activedescendant is correct");
popup.removeItem(items[2]);
is(popup.selectedIndex, 2, "index2 is selected");
is(popup.selectedItem, items[3], "item3 is still selected");
- ok(getActiveDescendant().classList.contains("autocomplete-selected"),
- "aria-activedescendant is correct");
is(popup.itemCount, items.length - 1, "item2 removed");
popup.clearItems();
is(popup.itemCount, 0, "items cleared");
- ok(!input.hasAttribute("aria-activedescendant"), "no aria-activedescendant");
popup.once("popup-closed", () => {
deferred.resolve();
});
popup.hidePopup();
});
- popup.openPopup(input);
+ popup.openPopup(HUD.jsterm.inputNode);
return deferred.promise;
}