Bug 1355078 - Restore scroll position after updating select popup. r?mossop
MozReview-Commit-ID: 7HfuUCymDz
--- a/browser/base/content/test/forms/browser_selectpopup_colors.js
+++ b/browser/base/content/test/forms/browser_selectpopup_colors.js
@@ -142,16 +142,29 @@ const SELECT_STYLE_OF_OPTION_CHANGES_AFT
const SELECT_TRANSPARENT_COLOR_WITH_TEXT_SHADOW =
"<html><head><style>" +
" select { color: transparent; text-shadow: 0 0 0 #303030; }" +
"</style></head><body><select id='one'>" +
' <option>{"color": "rgba(0, 0, 0, 0)", "backgroundColor": "rgba(0, 0, 0, 0)", "textShadow": "rgb(48, 48, 48) 0px 0px 0px"}</option>' +
' <option selected="true">{"end": "true"}</option>' +
"</select></body></html>";
+let SELECT_LONG_WITH_TRANSITION =
+ "<html><head><style>" +
+ " select { transition: all .2s linear; }" +
+ " select:focus { color: purple; }" +
+ "</style></head><body><select id='one'>";
+for (let i = 0; i < 75; i++) {
+ SELECT_LONG_WITH_TRANSITION +=
+ ' <option>{"color": "rgb(128, 0, 128)", "backgroundColor": "rgba(0, 0, 0, 0)"}</option>';
+}
+SELECT_LONG_WITH_TRANSITION +=
+ ' <option selected="true">{"end": "true"}</option>' +
+ "</select></body></html>";
+
function getSystemColor(color) {
// Need to convert system color to RGB color.
let textarea = document.createElementNS("http://www.w3.org/1999/xhtml", "textarea");
textarea.style.color = color;
return getComputedStyle(textarea).color;
}
function testOptionColors(index, item, menulist) {
@@ -252,19 +265,20 @@ function* testSelectColors(select, itemC
ok(!child.selected, "The first child should not be selected");
while (child) {
testOptionColors(idx, child, menulist);
idx++;
child = child.nextSibling;
}
- yield hideSelectPopup(selectPopup, "escape");
-
- yield BrowserTestUtils.removeTab(tab);
+ if (!options.leaveOpen) {
+ yield hideSelectPopup(selectPopup, "escape");
+ yield BrowserTestUtils.removeTab(tab);
+ }
}
add_task(function* setup() {
yield SpecialPowers.pushPrefEnv({
"set": [
["dom.select_popup_in_parent.enabled", true],
["dom.forms.select.customstyling", true]
]
@@ -409,8 +423,31 @@ add_task(function* test_transparent_colo
let options = {
selectColor: "rgba(0, 0, 0, 0)",
selectTextShadow: "rgb(48, 48, 48) 0px 0px 0px",
selectBgColor: "rgb(255, 255, 255)"
};
yield testSelectColors(SELECT_TRANSPARENT_COLOR_WITH_TEXT_SHADOW, 2, options);
});
+
+add_task(function* test_select_with_transition_doesnt_lose_scroll_position() {
+ let options = {
+ selectColor: "rgb(128, 0, 128)",
+ selectBgColor: "rgb(255, 255, 255)",
+ waitForComputedStyle: {
+ property: "color",
+ value: "rgb(128, 0, 128)"
+ },
+ leaveOpen: true
+ };
+
+ yield testSelectColors(SELECT_LONG_WITH_TRANSITION, 76, options);
+
+ let menulist = document.getElementById("ContentSelectDropdown");
+ let selectPopup = menulist.menupopup;
+ let scrollBox = selectPopup.scrollBox;
+ is(scrollBox.scrollTop, scrollBox.scrollTopMax,
+ "The popup should be scrolled to the bottom of the list (where the selected item is)");
+
+ yield hideSelectPopup(selectPopup, "escape");
+ yield BrowserTestUtils.removeTab(gBrowser.selectedTab);
+});
--- a/toolkit/modules/SelectParentHelper.jsm
+++ b/toolkit/modules/SelectParentHelper.jsm
@@ -188,29 +188,35 @@ this.SelectParentHelper = {
receiveMessage(msg) {
if (msg.name == "Forms:UpdateDropDown") {
// Sanity check - we'd better know what the currently
// opened menulist is, and what browser it belongs to...
if (!currentMenulist || !currentBrowser) {
return;
}
+ let scrollBox = currentMenulist.menupopup.scrollBox;
+ let scrollTop = scrollBox.scrollTop;
+
let options = msg.data.options;
let selectedIndex = msg.data.selectedIndex;
let uaBackgroundColor = msg.data.uaBackgroundColor;
let uaColor = msg.data.uaColor;
let uaSelectBackgroundColor = msg.data.uaSelectBackgroundColor;
let uaSelectColor = msg.data.uaSelectColor;
let selectBackgroundColor = msg.data.selectBackgroundColor;
let selectColor = msg.data.selectColor;
let selectTextShadow = msg.data.selectTextShadow;
this.populate(currentMenulist, options, selectedIndex,
currentZoom, uaBackgroundColor, uaColor,
uaSelectBackgroundColor, uaSelectColor,
selectBackgroundColor, selectColor, selectTextShadow);
+
+ // Restore scroll position to what it was prior to the update.
+ scrollBox.scrollTop = scrollTop;
}
},
_registerListeners(browser, popup) {
popup.addEventListener("command", this);
popup.addEventListener("popuphidden", this);
popup.addEventListener("mouseover", this);
popup.addEventListener("mouseout", this);