зеркало из https://github.com/mozilla/gecko-dev.git
Bug 1627969 - Remove the megabar pref. r=mak
Differential Revision: https://phabricator.services.mozilla.com/D70023 --HG-- extra : moz-landing-system : lando
This commit is contained in:
Родитель
b02e95b434
Коммит
3b8b1171af
|
@ -308,9 +308,6 @@ pref("browser.urlbar.openintab", false);
|
|||
pref("browser.urlbar.usepreloadedtopurls.enabled", false);
|
||||
pref("browser.urlbar.usepreloadedtopurls.expire_days", 14);
|
||||
|
||||
// Whether the quantum bar displays design update 1.
|
||||
pref("browser.urlbar.update1", true);
|
||||
|
||||
// If true, we show actionable tips in the Urlbar when the user is searching
|
||||
// for those actions.
|
||||
pref("browser.urlbar.update1.interventions", true);
|
||||
|
|
|
@ -581,8 +581,7 @@ toolbar:not(#TabsToolbar) > #personal-bookmarks {
|
|||
*
|
||||
* Attribute is controlled by browser.js:/gRemoteControl.
|
||||
*/
|
||||
:root[remotecontrol] #urlbar:not(.megabar),
|
||||
:root[remotecontrol] #urlbar.megabar > #urlbar-background {
|
||||
:root[remotecontrol] #urlbar-background {
|
||||
background: repeating-linear-gradient(
|
||||
-45deg,
|
||||
transparent,
|
||||
|
@ -693,7 +692,6 @@ toolbar:not(#TabsToolbar) > #personal-bookmarks {
|
|||
#urlbar-input-container[pageproxystate=invalid] > #page-action-buttons > .urlbar-page-action,
|
||||
#identity-box.chromeUI ~ #page-action-buttons > .urlbar-page-action:not(#star-button-box),
|
||||
#urlbar[usertyping] > #urlbar-input-container > #page-action-buttons > #urlbar-zoom-button,
|
||||
#urlbar[usertyping] > #urlbar-input-container > .urlbar-history-dropmarker,
|
||||
#urlbar:not([usertyping]) > #urlbar-input-container > #urlbar-go-button,
|
||||
#urlbar:not([focused]) > #urlbar-input-container > #urlbar-go-button {
|
||||
display: none;
|
||||
|
|
|
@ -2099,15 +2099,9 @@ var gBrowserInit = {
|
|||
this._firstBrowserPaintDeferred.resolve = resolve;
|
||||
});
|
||||
|
||||
// To prevent flickering of the urlbar-history-dropmarker in the general
|
||||
// case, the urlbar has the 'focused' attribute set by default.
|
||||
// If we are not fully sure the urlbar will be focused in this window,
|
||||
// we should remove the attribute before first paint.
|
||||
let shouldRemoveFocusedAttribute = true;
|
||||
this._callWithURIToLoad(uriToLoad => {
|
||||
if (isBlankPageURL(uriToLoad) || uriToLoad == "about:privatebrowsing") {
|
||||
gURLBar.select();
|
||||
shouldRemoveFocusedAttribute = false;
|
||||
return;
|
||||
}
|
||||
|
||||
|
@ -2129,16 +2123,6 @@ var gBrowserInit = {
|
|||
gBrowser.selectedBrowser.focus();
|
||||
}
|
||||
});
|
||||
// Delay removing the attribute using requestAnimationFrame to avoid
|
||||
// invalidating styles multiple times in a row if uriToLoadPromise
|
||||
// resolves before first paint.
|
||||
if (shouldRemoveFocusedAttribute) {
|
||||
window.requestAnimationFrame(() => {
|
||||
if (shouldRemoveFocusedAttribute) {
|
||||
gURLBar.removeAttribute("focused");
|
||||
}
|
||||
});
|
||||
}
|
||||
},
|
||||
|
||||
_handleURIToLoad() {
|
||||
|
|
|
@ -1003,9 +1003,6 @@
|
|||
class="urlbar-icon"
|
||||
onclick="gURLBar.handleCommand(event);"
|
||||
tooltiptext="&goEndCap.tooltip;"/>
|
||||
<image class="urlbar-history-dropmarker urlbar-icon chromeclass-toolbar-additional"
|
||||
hidden="true"
|
||||
tooltiptext="&urlbar.openHistoryPopup.tooltip;"/>
|
||||
<hbox id="page-action-buttons" context="pageActionContextMenu">
|
||||
<toolbartabstop/>
|
||||
<hbox id="contextual-feature-recommendation" role="button" hidden="true">
|
||||
|
|
|
@ -1027,15 +1027,6 @@
|
|||
this._selectedTab = newTab;
|
||||
this.showTab(newTab);
|
||||
|
||||
gURLBar.setAttribute("switchingtabs", "true");
|
||||
window.addEventListener(
|
||||
"MozAfterPaint",
|
||||
function() {
|
||||
gURLBar.removeAttribute("switchingtabs");
|
||||
},
|
||||
{ once: true }
|
||||
);
|
||||
|
||||
this._appendStatusPanel();
|
||||
|
||||
let oldBrowserPopupsBlocked = oldBrowser.popupBlocker.getBlockedPopupCount();
|
||||
|
|
|
@ -27,7 +27,7 @@ add_task(async function() {
|
|||
|
||||
// Prepare the window to avoid flicker and reflow that's unrelated to our
|
||||
// tab opening operation.
|
||||
await ensureFocusedUrlbar();
|
||||
gURLBar.focus();
|
||||
|
||||
let tabStripRect = gBrowser.tabContainer.arrowScrollbox.getBoundingClientRect();
|
||||
let firstTabRect = gBrowser.selectedTab.getBoundingClientRect();
|
||||
|
|
|
@ -31,7 +31,7 @@ add_task(async function() {
|
|||
|
||||
await createTabs(TAB_COUNT_FOR_SQUEEZE);
|
||||
|
||||
await ensureFocusedUrlbar();
|
||||
gURLBar.focus();
|
||||
|
||||
let tabStripRect = gBrowser.tabContainer.arrowScrollbox.getBoundingClientRect();
|
||||
let textBoxRect = gURLBar
|
||||
|
|
|
@ -35,13 +35,12 @@ add_task(async function() {
|
|||
|
||||
await createTabs(TAB_COUNT_FOR_OVERFLOW);
|
||||
|
||||
await ensureFocusedUrlbar();
|
||||
gURLBar.focus();
|
||||
|
||||
let tabStripRect = gBrowser.tabContainer.arrowScrollbox.getBoundingClientRect();
|
||||
let textBoxRect = gURLBar
|
||||
.querySelector("moz-input-box")
|
||||
.getBoundingClientRect();
|
||||
let urlbarDropmarkerRect = gURLBar.dropmarker.getBoundingClientRect();
|
||||
|
||||
let ignoreTabstripRects = {
|
||||
filter: rects =>
|
||||
|
@ -73,15 +72,6 @@ add_task(async function() {
|
|||
r.y1 >=
|
||||
document.getElementById("appcontent").getBoundingClientRect().top,
|
||||
},
|
||||
{
|
||||
name: "bug 1520032 - the urlbar dropmarker disappears periodically",
|
||||
condition: r =>
|
||||
AppConstants.DEBUG &&
|
||||
r.x1 >= urlbarDropmarkerRect.left &&
|
||||
r.x2 <= urlbarDropmarkerRect.right &&
|
||||
r.y1 >= urlbarDropmarkerRect.top &&
|
||||
r.y2 <= urlbarDropmarkerRect.bottom,
|
||||
},
|
||||
],
|
||||
};
|
||||
|
||||
|
|
|
@ -43,8 +43,6 @@ add_task(async function() {
|
|||
"We shouldn't have added any new expected reflows for window close."
|
||||
);
|
||||
|
||||
let dropmarkerRect = gURLBar.dropmarker.getBoundingClientRect();
|
||||
|
||||
await withPerfObserver(
|
||||
async function() {
|
||||
let promiseOrigBrowserFocused = BrowserTestUtils.waitForCondition(() => {
|
||||
|
@ -55,22 +53,6 @@ add_task(async function() {
|
|||
},
|
||||
{
|
||||
expectedReflows: EXPECTED_REFLOWS,
|
||||
frames: {
|
||||
filter: rects =>
|
||||
rects.filter(
|
||||
r =>
|
||||
!(
|
||||
// The dropmarker is visible when the window opens and sometimes hasn't
|
||||
// finished its transition to opacity: 0 by the time waitForFocus resolves.
|
||||
(
|
||||
r.x1 >= dropmarkerRect.left - 1 &&
|
||||
r.x2 <= dropmarkerRect.right + 1 &&
|
||||
r.y1 >= dropmarkerRect.top &&
|
||||
r.y2 <= dropmarkerRect.bottom
|
||||
)
|
||||
)
|
||||
),
|
||||
},
|
||||
},
|
||||
win
|
||||
);
|
||||
|
|
|
@ -260,31 +260,6 @@ async function prepareSettledWindow() {
|
|||
return win;
|
||||
}
|
||||
|
||||
// Use this function to avoid catching a reflow related to calling focus on the
|
||||
// urlbar and changed rects for its dropmarker when opening new tabs.
|
||||
async function ensureFocusedUrlbar() {
|
||||
let opacityPromise;
|
||||
if (!gURLBar.dropmarker.hidden) {
|
||||
// The switchingtabs attribute prevents the historydropmarker opacity
|
||||
// transition, so if we expect a transitionend event when this attribute
|
||||
// is set, we wait forever. (it's removed off a MozAfterPaint event listener)
|
||||
await TestUtils.waitForCondition(
|
||||
() => !gURLBar.hasAttribute("switchingtabs")
|
||||
);
|
||||
|
||||
opacityPromise = BrowserTestUtils.waitForEvent(
|
||||
gURLBar.dropmarker,
|
||||
"transitionend",
|
||||
false,
|
||||
e => e.propertyName === "opacity"
|
||||
);
|
||||
}
|
||||
gURLBar.focus();
|
||||
if (opacityPromise) {
|
||||
await opacityPromise;
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* Calculate and return how many additional tabs can be fit into the
|
||||
* tabstrip without causing it to overflow.
|
||||
|
@ -761,61 +736,27 @@ async function runUrlbarTest(
|
|||
await UrlbarTestUtils.promisePopupClose(win);
|
||||
};
|
||||
|
||||
let expectedRects;
|
||||
if (URLBar.megabar) {
|
||||
let urlbarRect = URLBar.textbox.getBoundingClientRect();
|
||||
const SHADOW_SIZE = 4;
|
||||
expectedRects = {
|
||||
filter: rects => {
|
||||
// We put text into the urlbar so expect its textbox to change.
|
||||
// The dropmarker is displayed as active during some of the test.
|
||||
// We expect many changes in the results view.
|
||||
// So we just whitelist the whole urlbar. We don't check the bottom of
|
||||
// the rect because the result view height varies depending on the
|
||||
// results.
|
||||
// We use floor/ceil because the Urlbar dimensions aren't always
|
||||
// integers.
|
||||
return rects.filter(
|
||||
r =>
|
||||
!(
|
||||
r.x1 >= Math.floor(urlbarRect.left) - SHADOW_SIZE &&
|
||||
r.x2 <= Math.ceil(urlbarRect.right) + SHADOW_SIZE &&
|
||||
r.y1 >= Math.floor(urlbarRect.top) - SHADOW_SIZE
|
||||
)
|
||||
);
|
||||
},
|
||||
};
|
||||
} else {
|
||||
// Hide the results as we expect many changes there that we don't want to
|
||||
// detect here.
|
||||
URLBar.view.panel.style.visibility = "hidden";
|
||||
|
||||
let dropmarkerRect = URLBar.dropmarker.getBoundingClientRect();
|
||||
let textBoxRect = URLBar.querySelector(
|
||||
"moz-input-box"
|
||||
).getBoundingClientRect();
|
||||
expectedRects = {
|
||||
filter: rects =>
|
||||
rects.filter(
|
||||
r =>
|
||||
!(
|
||||
// We put text into the urlbar so expect its textbox to change.
|
||||
(
|
||||
(r.x1 >= Math.floor(textBoxRect.left) &&
|
||||
r.x2 <= Math.ceil(textBoxRect.right) &&
|
||||
r.y1 >= Math.floor(textBoxRect.top) &&
|
||||
r.y2 <= Math.ceil(textBoxRect.bottom)) ||
|
||||
// The dropmarker is displayed as active during some of the test.
|
||||
// dropmarkerRect.left isn't always an integer.
|
||||
(r.x1 >= Math.floor(dropmarkerRect.left) &&
|
||||
r.x2 <= Math.ceil(dropmarkerRect.right) &&
|
||||
r.y1 >= Math.floor(dropmarkerRect.top) &&
|
||||
r.y2 <= Math.ceil(dropmarkerRect.bottom))
|
||||
)
|
||||
)
|
||||
),
|
||||
};
|
||||
}
|
||||
let urlbarRect = URLBar.textbox.getBoundingClientRect();
|
||||
const SHADOW_SIZE = 4;
|
||||
let expectedRects = {
|
||||
filter: rects => {
|
||||
// We put text into the urlbar so expect its textbox to change.
|
||||
// We expect many changes in the results view.
|
||||
// So we just whitelist the whole urlbar. We don't check the bottom of
|
||||
// the rect because the result view height varies depending on the
|
||||
// results.
|
||||
// We use floor/ceil because the Urlbar dimensions aren't always
|
||||
// integers.
|
||||
return rects.filter(
|
||||
r =>
|
||||
!(
|
||||
r.x1 >= Math.floor(urlbarRect.left) - SHADOW_SIZE &&
|
||||
r.x2 <= Math.ceil(urlbarRect.right) + SHADOW_SIZE &&
|
||||
r.y1 >= Math.floor(urlbarRect.top) - SHADOW_SIZE
|
||||
)
|
||||
);
|
||||
},
|
||||
};
|
||||
|
||||
info("First opening");
|
||||
await withPerfObserver(
|
||||
|
|
|
@ -24,12 +24,6 @@ add_task(async function toolbar_ui_visibility() {
|
|||
"'open location' command is not disabled in the popup"
|
||||
);
|
||||
|
||||
is(
|
||||
win.gURLBar.dropmarker.clientWidth,
|
||||
0,
|
||||
"history dropdown button is hidden in the popup"
|
||||
);
|
||||
|
||||
EventUtils.synthesizeKey("t", { accelKey: true }, win);
|
||||
is(
|
||||
win.gBrowser.browsers.length,
|
||||
|
|
|
@ -319,7 +319,6 @@ class UrlbarController {
|
|||
// When there's no search string, we want to focus the next toolbar item
|
||||
// instead, for accessibility reasons.
|
||||
let allowTabbingThroughResults =
|
||||
!UrlbarPrefs.get("update1") ||
|
||||
this.input.focusedViaMousedown ||
|
||||
(this.input.value &&
|
||||
this.input.getAttribute("pageproxystate") != "valid");
|
||||
|
|
|
@ -81,15 +81,9 @@ class UrlbarInput {
|
|||
);
|
||||
this.panel = this.textbox.querySelector(".urlbarView");
|
||||
|
||||
// "Megabar" is the internal codename for the update1 design refresh.
|
||||
this.megabar = UrlbarPrefs.get("update1");
|
||||
if (this.megabar) {
|
||||
this.textbox.classList.add("megabar");
|
||||
this.textbox.parentNode.classList.add("megabar");
|
||||
this.searchButton = UrlbarPrefs.get("update2.searchButton");
|
||||
if (this.searchButton) {
|
||||
this.textbox.classList.add("searchButton");
|
||||
}
|
||||
this.searchButton = UrlbarPrefs.get("update2.searchButton");
|
||||
if (this.searchButton) {
|
||||
this.textbox.classList.add("searchButton");
|
||||
}
|
||||
|
||||
this.controller = new UrlbarController({
|
||||
|
@ -154,8 +148,6 @@ class UrlbarInput {
|
|||
}
|
||||
|
||||
this.inputField = this.querySelector("#urlbar-input");
|
||||
this.dropmarker = this.querySelector(".urlbar-history-dropmarker");
|
||||
this.dropmarker.hidden = this.megabar;
|
||||
this._inputContainer = this.querySelector("#urlbar-input-container");
|
||||
this._identityBox = this.querySelector("#identity-box");
|
||||
this._toolbar = this.textbox.closest("toolbar");
|
||||
|
@ -200,7 +192,6 @@ class UrlbarInput {
|
|||
this.addEventListener(name, this);
|
||||
}
|
||||
|
||||
this.dropmarker.addEventListener("mousedown", this);
|
||||
this.window.addEventListener("mousedown", this);
|
||||
this.textbox.addEventListener("mousedown", this);
|
||||
this._inputContainer.addEventListener("click", this);
|
||||
|
@ -1042,9 +1033,6 @@ class UrlbarInput {
|
|||
}
|
||||
|
||||
async updateLayoutBreakout() {
|
||||
if (!this.megabar) {
|
||||
return;
|
||||
}
|
||||
if (!this._toolbar) {
|
||||
// Expanding requires a parent toolbar.
|
||||
return;
|
||||
|
@ -1973,22 +1961,6 @@ class UrlbarInput {
|
|||
this.view.autoOpen({ event });
|
||||
}
|
||||
break;
|
||||
case this.dropmarker:
|
||||
if (event.button != 0) {
|
||||
break;
|
||||
}
|
||||
|
||||
if (this.view.isOpen) {
|
||||
this.view.close();
|
||||
} else {
|
||||
this.focus();
|
||||
this.startQuery({
|
||||
allowAutofill: false,
|
||||
event,
|
||||
});
|
||||
this._maybeSelectAll();
|
||||
}
|
||||
break;
|
||||
case this.window:
|
||||
if (this._mousedownOnUrlbarDescendant) {
|
||||
this._mousedownOnUrlbarDescendant = false;
|
||||
|
|
|
@ -144,9 +144,6 @@ const PREF_URLBAR_DEFAULTS = new Map([
|
|||
// popular domains will no longer be included in the results.
|
||||
["usepreloadedtopurls.expire_days", 14],
|
||||
|
||||
// Whether the quantum bar displays design update 1.
|
||||
["update1", true],
|
||||
|
||||
// If true, we show actionable tips in the Urlbar when the user is searching
|
||||
// for those actions.
|
||||
["update1.interventions", true],
|
||||
|
|
|
@ -76,7 +76,6 @@ class ProviderTopSites extends UrlbarProvider {
|
|||
// the most frecent URLs in the user's history from the UnifiedComplete
|
||||
// provider.
|
||||
return (
|
||||
UrlbarPrefs.get("update1") &&
|
||||
UrlbarPrefs.get("openViewOnFocus") &&
|
||||
!queryContext.searchString &&
|
||||
Services.prefs.getBoolPref(
|
||||
|
|
|
@ -44,10 +44,6 @@ class UrlbarView {
|
|||
this.document = this.panel.ownerDocument;
|
||||
this.window = this.document.defaultView;
|
||||
|
||||
if (this.input.megabar) {
|
||||
this.panel.classList.add("megabar");
|
||||
}
|
||||
|
||||
this._mainContainer = this.panel.querySelector(".urlbarView-body-inner");
|
||||
this._rows = this.panel.querySelector(".urlbarView-results");
|
||||
|
||||
|
@ -358,15 +354,10 @@ class UrlbarView {
|
|||
|
||||
this.removeAccessibleFocus();
|
||||
this.input.inputField.setAttribute("aria-expanded", "false");
|
||||
this.input.dropmarker.removeAttribute("open");
|
||||
|
||||
this.input.removeAttribute("open");
|
||||
this.input.endLayoutExtend();
|
||||
|
||||
if (!this.input.megabar && this.input._toolbar) {
|
||||
this.input._toolbar.removeAttribute("urlbar-exceeds-toolbar-bounds");
|
||||
}
|
||||
|
||||
// Search Tips can open the view without the Urlbar being focused. If the
|
||||
// tip is ignored (e.g. the page content is clicked or the window loses
|
||||
// focus) we should discard the telemetry event created when the view was
|
||||
|
@ -600,87 +591,15 @@ class UrlbarView {
|
|||
|
||||
this.panel.removeAttribute("actionoverride");
|
||||
|
||||
if (!this.input.megabar) {
|
||||
let px = number => number.toFixed(2) + "px";
|
||||
let inputRect = getBoundsWithoutFlushing(this.input.textbox);
|
||||
|
||||
// Make the panel span the width of the window.
|
||||
let documentRect = getBoundsWithoutFlushing(
|
||||
this.document.documentElement
|
||||
);
|
||||
let width = documentRect.right - documentRect.left;
|
||||
|
||||
// Keep the popup items' site icons aligned with the input's identity
|
||||
// icon if it's not too far from the edge of the window. We define
|
||||
// "too far" as "more than 30% of the window's width AND more than
|
||||
// 250px".
|
||||
let boundToCheck = this.window.RTL_UI ? "right" : "left";
|
||||
let startOffset = Math.abs(
|
||||
inputRect[boundToCheck] - documentRect[boundToCheck]
|
||||
);
|
||||
let alignSiteIcons = startOffset / width <= 0.3 || startOffset <= 250;
|
||||
|
||||
if (alignSiteIcons) {
|
||||
// Calculate the end margin if we have a start margin.
|
||||
let boundToCheckEnd = this.window.RTL_UI ? "left" : "right";
|
||||
let endOffset = Math.abs(
|
||||
inputRect[boundToCheckEnd] - documentRect[boundToCheckEnd]
|
||||
);
|
||||
if (endOffset > startOffset * 2) {
|
||||
// Provide more space when aligning would result in an unbalanced
|
||||
// margin. This allows the location bar to be moved to the start
|
||||
// of the navigation toolbar to reclaim space for results.
|
||||
endOffset = startOffset;
|
||||
}
|
||||
|
||||
// Align the view's icons with the tracking protection or identity icon,
|
||||
// whichever is visible.
|
||||
let alignRect;
|
||||
for (let id of ["tracking-protection-icon-box", "identity-icon"]) {
|
||||
alignRect = getBoundsWithoutFlushing(
|
||||
this.document.getElementById(id)
|
||||
);
|
||||
if (alignRect.width > 0) {
|
||||
break;
|
||||
}
|
||||
}
|
||||
let start = this.window.RTL_UI
|
||||
? documentRect.right - alignRect.right
|
||||
: alignRect.left;
|
||||
|
||||
this.panel.style.setProperty("--item-padding-start", px(start));
|
||||
this.panel.style.setProperty("--item-padding-end", px(endOffset));
|
||||
} else {
|
||||
this.panel.style.removeProperty("--item-padding-start");
|
||||
this.panel.style.removeProperty("--item-padding-end");
|
||||
}
|
||||
|
||||
// Align the panel with the parent toolbar.
|
||||
this.panel.style.top = px(
|
||||
getBoundsWithoutFlushing(this.input._toolbar).bottom
|
||||
);
|
||||
|
||||
this._mainContainer.style.maxWidth = px(width);
|
||||
|
||||
if (this.input._toolbar) {
|
||||
this.input._toolbar.setAttribute(
|
||||
"urlbar-exceeds-toolbar-bounds",
|
||||
"true"
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
this._enableOrDisableRowWrap();
|
||||
|
||||
this.input.inputField.setAttribute("aria-expanded", "true");
|
||||
this.input.dropmarker.setAttribute("open", "true");
|
||||
|
||||
this.input.setAttribute("open", "true");
|
||||
this.input.startLayoutExtend();
|
||||
|
||||
this.window.addEventListener("resize", this);
|
||||
this.window.addEventListener("blur", this);
|
||||
this._windowOuterWidth = this.window.outerWidth;
|
||||
|
||||
this.controller.notify(this.controller.NOTIFICATIONS.VIEW_OPEN);
|
||||
}
|
||||
|
@ -815,21 +734,14 @@ class UrlbarView {
|
|||
noWrap.className = "urlbarView-no-wrap";
|
||||
item._content.appendChild(noWrap);
|
||||
|
||||
let typeIcon = this._createElement("span");
|
||||
typeIcon.className = "urlbarView-type-icon";
|
||||
|
||||
if (!this.input.megabar) {
|
||||
noWrap.appendChild(typeIcon);
|
||||
}
|
||||
|
||||
let favicon = this._createElement("img");
|
||||
favicon.className = "urlbarView-favicon";
|
||||
noWrap.appendChild(favicon);
|
||||
item._elements.set("favicon", favicon);
|
||||
|
||||
if (this.input.megabar) {
|
||||
noWrap.appendChild(typeIcon);
|
||||
}
|
||||
let typeIcon = this._createElement("span");
|
||||
typeIcon.className = "urlbarView-type-icon";
|
||||
noWrap.appendChild(typeIcon);
|
||||
|
||||
let title = this._createElement("span");
|
||||
title.className = "urlbarView-title";
|
||||
|
@ -1574,22 +1486,7 @@ class UrlbarView {
|
|||
}
|
||||
|
||||
_on_resize() {
|
||||
if (this.input.megabar) {
|
||||
this._enableOrDisableRowWrap();
|
||||
return;
|
||||
}
|
||||
|
||||
if (this._windowOuterWidth == this.window.outerWidth) {
|
||||
// Sometimes a resize event is fired when the window's size doesn't
|
||||
// actually change; at least, browser_tabMatchesInAwesomebar.js triggers
|
||||
// it intermittently, which causes that test to hang or fail. Ignore
|
||||
// those events.
|
||||
return;
|
||||
}
|
||||
|
||||
// Close the popup as it would be wrongly sized. This can
|
||||
// happen when using special OS resize functions like Win+Arrow.
|
||||
this.close();
|
||||
this._enableOrDisableRowWrap();
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
@ -63,7 +63,6 @@ support-files =
|
|||
skip-if = verify && os == 'linux' # Bug 1581635
|
||||
[browser_downArrowKeySearch.js]
|
||||
[browser_dragdropURL.js]
|
||||
[browser_dropmarker.js]
|
||||
[browser_empty_search.js]
|
||||
[browser_enter.js]
|
||||
[browser_enterAfterMouseOver.js]
|
||||
|
|
|
@ -144,9 +144,7 @@ add_task(async function() {
|
|||
if (testcase.expected.typeImageVisible) {
|
||||
Assert.equal(
|
||||
result.displayed.typeIcon,
|
||||
gURLBar.megabar
|
||||
? 'url("chrome://browser/skin/bookmark-12.svg")'
|
||||
: 'url("chrome://browser/skin/bookmark.svg")',
|
||||
'url("chrome://browser/skin/bookmark-12.svg")',
|
||||
"Should have the star image displayed or not as expected"
|
||||
);
|
||||
} else {
|
||||
|
|
|
@ -73,7 +73,6 @@ add_task(async function empty() {
|
|||
});
|
||||
|
||||
add_task(async function new_window() {
|
||||
// The megabar works properly in a new window.
|
||||
let win = await BrowserTestUtils.openNewBrowserWindow();
|
||||
win.gURLBar.focus();
|
||||
EventUtils.synthesizeKey("KEY_ArrowDown", {}, win);
|
||||
|
|
|
@ -1,66 +0,0 @@
|
|||
/* Any copyright is dedicated to the Public Domain.
|
||||
* http://creativecommons.org/publicdomain/zero/1.0/
|
||||
*/
|
||||
|
||||
"use strict";
|
||||
|
||||
add_task(async function setup() {
|
||||
if (gURLBar.dropmarker.hidden) {
|
||||
gURLBar.dropmarker.hidden = false;
|
||||
registerCleanupFunction(() => {
|
||||
gURLBar.dropmarker.hidden = true;
|
||||
});
|
||||
}
|
||||
});
|
||||
|
||||
add_task(async function basic() {
|
||||
await BrowserTestUtils.withNewTab("http://example.com/", async () => {
|
||||
let queryContext = await clickDropmarker();
|
||||
is(
|
||||
queryContext.searchString,
|
||||
"",
|
||||
"Clicking the history dropmarker should initiate an empty search instead of searching for the loaded URL"
|
||||
);
|
||||
is(
|
||||
gURLBar.untrimmedValue,
|
||||
"http://example.com/",
|
||||
"Clicking the history dropmarker should not change the input value"
|
||||
);
|
||||
await UrlbarTestUtils.promisePopupClose(window, () =>
|
||||
EventUtils.synthesizeKey("KEY_Escape")
|
||||
);
|
||||
});
|
||||
});
|
||||
|
||||
add_task(async function proxyState() {
|
||||
// Open two tabs.
|
||||
await BrowserTestUtils.withNewTab("about:blank", async browser1 => {
|
||||
await BrowserTestUtils.withNewTab("http://example.com/", async browser2 => {
|
||||
// Click the dropmarker on the second tab and switch back to the first
|
||||
// tab.
|
||||
await clickDropmarker();
|
||||
await UrlbarTestUtils.promisePopupClose(window, () =>
|
||||
EventUtils.synthesizeKey("KEY_Escape")
|
||||
);
|
||||
await BrowserTestUtils.switchTab(
|
||||
gBrowser,
|
||||
gBrowser.getTabForBrowser(browser1)
|
||||
);
|
||||
// Switch back to the second tab.
|
||||
await BrowserTestUtils.switchTab(
|
||||
gBrowser,
|
||||
gBrowser.getTabForBrowser(browser2)
|
||||
);
|
||||
// The proxy state should be valid.
|
||||
Assert.equal(gURLBar.getAttribute("pageproxystate"), "valid");
|
||||
});
|
||||
});
|
||||
});
|
||||
|
||||
async function clickDropmarker() {
|
||||
await UrlbarTestUtils.promisePopupOpen(window, () => {
|
||||
EventUtils.synthesizeMouseAtCenter(gURLBar.dropmarker, {}, window);
|
||||
});
|
||||
let queryContext = await gURLBar.lastQueryContextPromise;
|
||||
return queryContext;
|
||||
}
|
|
@ -39,9 +39,7 @@ async function do_test(openFn, pickMethod) {
|
|||
},
|
||||
async function(browser) {
|
||||
await clearInputHistory();
|
||||
if (!(await openFn())) {
|
||||
return;
|
||||
}
|
||||
await openFn();
|
||||
await UrlbarTestUtils.promiseSearchComplete(window);
|
||||
let promise = BrowserTestUtils.waitForDocLoadAndStopIt(TEST_URL, browser);
|
||||
if (pickMethod == "keyboard") {
|
||||
|
@ -79,26 +77,6 @@ add_task(async function test_history_no_search_terms() {
|
|||
info("Test opening panel with down key");
|
||||
gURLBar.focus();
|
||||
EventUtils.sendKey("down");
|
||||
return true;
|
||||
},
|
||||
() => {
|
||||
if (gURLBar.dropmarker.hidden) {
|
||||
return false;
|
||||
}
|
||||
info("Test opening panel with history dropmarker");
|
||||
gURLBar.dropmarker.click();
|
||||
return true;
|
||||
},
|
||||
async () => {
|
||||
if (gURLBar.dropmarker.hidden) {
|
||||
return false;
|
||||
}
|
||||
info("Test opening panel with history dropmarker on a page");
|
||||
let selectedBrowser = gBrowser.selectedBrowser;
|
||||
await BrowserTestUtils.loadURI(selectedBrowser, TEST_URL);
|
||||
await BrowserTestUtils.browserLoaded(selectedBrowser);
|
||||
gURLBar.dropmarker.click();
|
||||
return true;
|
||||
},
|
||||
async () => {
|
||||
info("Test opening panel on focus");
|
||||
|
@ -106,7 +84,6 @@ add_task(async function test_history_no_search_terms() {
|
|||
gURLBar.blur();
|
||||
EventUtils.synthesizeMouseAtCenter(gURLBar.textbox, {});
|
||||
Services.prefs.clearUserPref("browser.urlbar.openViewOnFocus");
|
||||
return true;
|
||||
},
|
||||
async () => {
|
||||
info("Test opening panel on focus on a page");
|
||||
|
@ -120,7 +97,6 @@ add_task(async function test_history_no_search_terms() {
|
|||
gURLBar.blur();
|
||||
EventUtils.synthesizeMouseAtCenter(gURLBar.textbox, {});
|
||||
Services.prefs.clearUserPref("browser.urlbar.openViewOnFocus");
|
||||
return true;
|
||||
},
|
||||
]) {
|
||||
await do_test(openFn, pickMethod);
|
||||
|
|
|
@ -3,7 +3,7 @@
|
|||
|
||||
"use strict";
|
||||
|
||||
// Tests "megabar" redesign approach with retained results.
|
||||
// Tests retained results.
|
||||
// When there is a pending search (user typed a search string and blurred
|
||||
// without picking a result), on focus we should the search results again.
|
||||
|
||||
|
@ -132,7 +132,6 @@ async function test_window(win) {
|
|||
}
|
||||
|
||||
add_task(async function test_normalWindow() {
|
||||
// The megabar works properly in a new window.
|
||||
let win = await BrowserTestUtils.openNewBrowserWindow();
|
||||
await test_window(win);
|
||||
await BrowserTestUtils.closeWindow(win);
|
||||
|
|
|
@ -10,10 +10,7 @@
|
|||
|
||||
add_task(async function init() {
|
||||
await SpecialPowers.pushPrefEnv({
|
||||
set: [
|
||||
["browser.urlbar.update1", true],
|
||||
["browser.urlbar.openViewOnFocus", true],
|
||||
],
|
||||
set: [["browser.urlbar.openViewOnFocus", true]],
|
||||
});
|
||||
|
||||
for (let i = 0; i < UrlbarPrefs.get("maxRichResults"); i++) {
|
||||
|
|
|
@ -15,7 +15,6 @@ const EN_US_TOPSITES =
|
|||
add_task(async function init() {
|
||||
await SpecialPowers.pushPrefEnv({
|
||||
set: [
|
||||
["browser.urlbar.update1", true],
|
||||
["browser.urlbar.openViewOnFocus", true],
|
||||
["browser.newtabpage.activity-stream.default.sites", EN_US_TOPSITES],
|
||||
],
|
||||
|
|
|
@ -503,38 +503,6 @@ const tests = [
|
|||
};
|
||||
},
|
||||
|
||||
async function(win) {
|
||||
info("Open the panel with dropmarker, type something, Enter.");
|
||||
let dropmarkerWasHidden = win.gURLBar.dropmarker.hidden;
|
||||
win.gURLBar.dropmarker.hidden = false;
|
||||
win.gURLBar.select();
|
||||
let promise = BrowserTestUtils.browserLoaded(win.gBrowser.selectedBrowser);
|
||||
await UrlbarTestUtils.promisePopupOpen(win, () => {
|
||||
EventUtils.synthesizeMouseAtCenter(win.gURLBar.dropmarker, {}, win);
|
||||
});
|
||||
await UrlbarTestUtils.promiseAutocompleteResultPopup({
|
||||
window: win,
|
||||
waitForFocus: SimpleTest.waitForFocus,
|
||||
value: "x",
|
||||
fireInputEvent: true,
|
||||
});
|
||||
EventUtils.synthesizeKey("VK_RETURN", {}, win);
|
||||
await promise;
|
||||
win.gURLBar.dropmarker.hidden = dropmarkerWasHidden;
|
||||
return {
|
||||
category: "urlbar",
|
||||
method: "engagement",
|
||||
object: "enter",
|
||||
value: "topsites",
|
||||
extra: {
|
||||
elapsed: val => parseInt(val) > 0,
|
||||
numChars: "1",
|
||||
selType: "search",
|
||||
selIndex: "0",
|
||||
},
|
||||
};
|
||||
},
|
||||
|
||||
// The URLs in the openViewOnFocus tests must vary from test to test, else
|
||||
// the first Top Site results will be a switch-to-tab result and a page load
|
||||
// will not occur.
|
||||
|
@ -915,34 +883,6 @@ const tests = [
|
|||
};
|
||||
},
|
||||
|
||||
async function(win) {
|
||||
info("Open the panel with dropmarker, type something, blur it.");
|
||||
let dropmarkerWasHidden = win.gURLBar.dropmarker.hidden;
|
||||
win.gURLBar.dropmarker.hidden = false;
|
||||
await BrowserTestUtils.withNewTab(
|
||||
{ gBrowser: win.gBrowser, url: "about:blank" },
|
||||
async browser => {
|
||||
win.gURLBar.select();
|
||||
await UrlbarTestUtils.promisePopupOpen(win, () => {
|
||||
EventUtils.synthesizeMouseAtCenter(gURLBar.dropmarker, {}, win);
|
||||
});
|
||||
EventUtils.synthesizeKey("x", {}, win);
|
||||
win.gURLBar.blur();
|
||||
}
|
||||
);
|
||||
win.gURLBar.dropmarker.hidden = dropmarkerWasHidden;
|
||||
return {
|
||||
category: "urlbar",
|
||||
method: "abandonment",
|
||||
object: "blur",
|
||||
value: "topsites",
|
||||
extra: {
|
||||
elapsed: val => parseInt(val) > 0,
|
||||
numChars: "1",
|
||||
},
|
||||
};
|
||||
},
|
||||
|
||||
async function(win) {
|
||||
info(
|
||||
"With pageproxystate=valid, open the panel with openViewOnFocus, don't type, blur it."
|
||||
|
|
|
@ -121,8 +121,6 @@ this container is a toolbar. This avoids double-speaking. -->
|
|||
<!ENTITY urlbar.permissionsGranted.tooltip "You have granted this website additional permissions.">
|
||||
|
||||
|
||||
<!ENTITY urlbar.openHistoryPopup.tooltip "Show history">
|
||||
|
||||
<!ENTITY searchItem.title "Search">
|
||||
|
||||
<!-- Toolbar items -->
|
||||
|
|
|
@ -88,7 +88,6 @@ async function updateTopSites(condition, searchShortcuts = false) {
|
|||
add_task(async function setup() {
|
||||
await SpecialPowers.pushPrefEnv({
|
||||
set: [
|
||||
["browser.urlbar.update1", true],
|
||||
["browser.urlbar.openViewOnFocus", true],
|
||||
["browser.newtabpage.activity-stream.default.sites", EN_US_TOPSITES],
|
||||
],
|
||||
|
|
|
@ -174,8 +174,7 @@ menuitem.bookmark-item {
|
|||
|
||||
%include ../shared/urlbar-searchbar.inc.css
|
||||
|
||||
#urlbar:not(.megabar):not(:-moz-lwtheme):not([focused="true"]),
|
||||
#urlbar.megabar:not(:-moz-lwtheme):not([focused="true"]) > #urlbar-background,
|
||||
#urlbar:not(:-moz-lwtheme):not([focused="true"]) > #urlbar-background,
|
||||
#searchbar:not(:-moz-lwtheme):not(:focus-within) {
|
||||
border-color: ThreeDShadow;
|
||||
}
|
||||
|
|
|
@ -244,18 +244,6 @@
|
|||
|
||||
%include ../shared/urlbar-searchbar.inc.css
|
||||
|
||||
@supports not -moz-bool-pref("browser.urlbar.update1") {
|
||||
:root {
|
||||
--toolbar-field-focus-border-color: -moz-mac-focusring;
|
||||
}
|
||||
|
||||
#searchbar:focus-within,
|
||||
#urlbar:not(.megabar)[focused="true"] {
|
||||
box-shadow: 0 0 0 1px var(--toolbar-field-focus-border-color) inset,
|
||||
0 0 0 1px var(--toolbar-field-focus-border-color);
|
||||
}
|
||||
}
|
||||
|
||||
#urlbar,
|
||||
#searchbar {
|
||||
font-size: 1.25em;
|
||||
|
|
|
@ -45,81 +45,48 @@
|
|||
.urlbarView {
|
||||
/* Don't handle window drag events in case we are overlapping a toolbar */
|
||||
-moz-window-dragging: no-drag;
|
||||
|
||||
display: block;
|
||||
text-shadow: none;
|
||||
overflow: -moz-hidden-unscrollable;
|
||||
}
|
||||
|
||||
.urlbarView.megabar {
|
||||
margin-inline: @urlbarViewMarginInline@;
|
||||
width: calc(100% - 2 * @urlbarViewMarginInline@);
|
||||
|
||||
/* Match urlbar-background's border. */
|
||||
border-inline: 1px solid transparent;
|
||||
|
||||
/* Offsets the toolbar overlap so the view's top border aligns with the
|
||||
toolbar. */
|
||||
margin-block-start: -@urlbarBreakoutExtend@;
|
||||
}
|
||||
|
||||
.urlbarView {
|
||||
display: block;
|
||||
}
|
||||
|
||||
.urlbarView.megabar .urlbarView-body-inner {
|
||||
.urlbarView-body-inner {
|
||||
width: 100%;
|
||||
border-top: 1px solid var(--urlbar-separator-color);
|
||||
}
|
||||
|
||||
.urlbarView:not(.megabar) {
|
||||
position: fixed;
|
||||
z-index: 3;
|
||||
inset-inline: 0;
|
||||
background: var(--autocomplete-popup-background);
|
||||
color: var(--autocomplete-popup-color);
|
||||
border-block: 1px solid var(--chrome-content-separator-color);
|
||||
box-shadow: 0 5px 18px rgba(0, 0, 0, .2);
|
||||
}
|
||||
|
||||
.urlbarView-results {
|
||||
padding-block: @urlbarViewPadding@;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.urlbarView:not(.megabar) .urlbarView-results {
|
||||
padding-inline: @urlbarViewPadding@;
|
||||
}
|
||||
|
||||
.urlbarView-row {
|
||||
fill: currentColor;
|
||||
fill-opacity: .6;
|
||||
padding-block: 3px;
|
||||
}
|
||||
|
||||
.urlbarView:not(.megabar) .urlbarView-row,
|
||||
.urlbarView.megabar .urlbarView-row-inner {
|
||||
.urlbarView-row-inner {
|
||||
border-radius: 2px;
|
||||
padding-inline-start: @urlbarViewItemInlinePadding@;
|
||||
}
|
||||
|
||||
.urlbarView:not(.megabar) .urlbarView-row:not([type=tip]),
|
||||
.urlbarView.megabar .urlbarView-row-inner {
|
||||
padding-block: 6px;
|
||||
}
|
||||
|
||||
.urlbarView:not(.megabar) .urlbarView-row {
|
||||
padding-inline-start: calc(var(--item-padding-start, calc(5px + @urlbarViewFaviconOffset@)) - @urlbarViewFaviconOffset@);
|
||||
padding-inline-end: var(--item-padding-end, 5px);
|
||||
}
|
||||
|
||||
:root[uidensity=touch] .urlbarView-row:not([type=tip]) {
|
||||
padding-block: 11px;
|
||||
}
|
||||
|
||||
.urlbarView:not(.megabar) .urlbarView-row[type=tip] {
|
||||
padding-block-start: 24px;
|
||||
/* Compensating for the 16px bottom margin on the tip elements. */
|
||||
padding-block-end: calc(24px - 16px);
|
||||
}
|
||||
|
||||
.urlbarView.megabar .urlbarView-row[type=tip] {
|
||||
.urlbarView-row[type=tip] {
|
||||
padding-block-start: 18px;
|
||||
/* Compensating for the 16px bottom margin on the tip elements. */
|
||||
padding-block-end: calc(18px - 16px);
|
||||
|
@ -147,22 +114,22 @@
|
|||
/* Wrap the url to a second line when the window is narrow. Do not wrap when the
|
||||
window is also short, because fewer results will be shown. */
|
||||
@media screen and (min-height: 600px) {
|
||||
.urlbarView.megabar .urlbarView-results[wrap] > .urlbarView-row > .urlbarView-row-inner {
|
||||
.urlbarView-results[wrap] > .urlbarView-row > .urlbarView-row-inner {
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
.urlbarView.megabar .urlbarView-results[wrap] > .urlbarView-row > .urlbarView-row-inner > .urlbarView-no-wrap {
|
||||
.urlbarView-results[wrap] > .urlbarView-row > .urlbarView-row-inner > .urlbarView-no-wrap {
|
||||
max-width: 100% !important;
|
||||
flex-basis: 100%;
|
||||
}
|
||||
.urlbarView.megabar .urlbarView-results[wrap] > .urlbarView-row[has-url] > .urlbarView-row-inner > .urlbarView-url {
|
||||
.urlbarView-results[wrap] > .urlbarView-row[has-url] > .urlbarView-row-inner > .urlbarView-url {
|
||||
margin-top: 2px;
|
||||
padding-inline-start: calc(@urlbarViewItemInlinePadding@ + @identityBoxMarginInlineEnd@ + /* favicon */ 16px);
|
||||
}
|
||||
/* Note: switchtab entries show the url only in override mode,
|
||||
remotetab only when selected or :hover */
|
||||
.urlbarView.megabar[actionoverride] .urlbarView-results[wrap] > .urlbarView-row[has-url] > .urlbarView-row-inner > .urlbarView-no-wrap > .urlbarView-title-separator,
|
||||
.urlbarView.megabar .urlbarView-results[wrap] > .urlbarView-row[has-url]:not([type$=tab]) > .urlbarView-row-inner > .urlbarView-no-wrap > .urlbarView-title-separator,
|
||||
.urlbarView.megabar .urlbarView-results[wrap] > .urlbarView-row[type=remotetab]:-moz-any(:hover, [selected]) > .urlbarView-row-inner > .urlbarView-no-wrap > .urlbarView-title-separator {
|
||||
.urlbarView[actionoverride] .urlbarView-results[wrap] > .urlbarView-row[has-url] > .urlbarView-row-inner > .urlbarView-no-wrap > .urlbarView-title-separator,
|
||||
.urlbarView-results[wrap] > .urlbarView-row[has-url]:not([type$=tab]) > .urlbarView-row-inner > .urlbarView-no-wrap > .urlbarView-title-separator,
|
||||
.urlbarView-results[wrap] > .urlbarView-row[type=remotetab]:-moz-any(:hover, [selected]) > .urlbarView-row-inner > .urlbarView-no-wrap > .urlbarView-title-separator {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
@ -170,7 +137,7 @@
|
|||
/* We should always wrap tip results at narrow widths regardless of screen
|
||||
height. Unlike regular results, unwrapped tips are taller than wrapped
|
||||
tips. */
|
||||
.urlbarView.megabar .urlbarView-results[wrap] > .urlbarView-row[type=tip] > .urlbarView-row-inner {
|
||||
.urlbarView-results[wrap] > .urlbarView-row[type=tip] > .urlbarView-row-inner {
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
|
||||
|
@ -188,38 +155,33 @@
|
|||
direction: ltr !important;
|
||||
}
|
||||
|
||||
.urlbarView:not(.megabar) .urlbarView-row:not([type=tip]):hover,
|
||||
.urlbarView.megabar .urlbarView-row:not([type=tip]):hover > .urlbarView-row-inner {
|
||||
.urlbarView-row:not([type=tip]):hover > .urlbarView-row-inner {
|
||||
background: var(--arrowpanel-dimmed);
|
||||
}
|
||||
|
||||
.urlbarView:not(.megabar) .urlbarView-row:not([type=tip])[selected],
|
||||
.urlbarView.megabar .urlbarView-row:not([type=tip])[selected] > .urlbarView-row-inner {
|
||||
.urlbarView-row:not([type=tip])[selected] > .urlbarView-row-inner {
|
||||
background: var(--autocomplete-popup-highlight-background);
|
||||
color: var(--autocomplete-popup-highlight-color);
|
||||
fill-opacity: 1;
|
||||
}
|
||||
|
||||
.urlbarView-type-icon,
|
||||
.urlbarView-favicon {
|
||||
min-width: 16px;
|
||||
height: 16px;
|
||||
margin-inline-end: calc(@urlbarViewIconMarginEnd@);
|
||||
background-repeat: no-repeat;
|
||||
background-size: contain;
|
||||
-moz-context-properties: fill, fill-opacity;
|
||||
}
|
||||
|
||||
.urlbarView:not(.megabar) .urlbarView-type-icon,
|
||||
.urlbarView-favicon {
|
||||
margin-inline-end: calc(@urlbarViewIconMarginEnd@);
|
||||
}
|
||||
|
||||
.urlbarView.megabar .urlbarView-type-icon {
|
||||
.urlbarView-type-icon {
|
||||
position: absolute;
|
||||
min-width: 12px;
|
||||
height: 12px;
|
||||
margin-bottom: -4px;
|
||||
margin-inline-start: 8px;
|
||||
background-repeat: no-repeat;
|
||||
background-size: contain;
|
||||
-moz-context-properties: fill, stroke;
|
||||
}
|
||||
|
||||
|
@ -232,10 +194,6 @@
|
|||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.urlbarView:not(.megabar) .urlbarView-row[type=tip] > .urlbarView-row-inner > .urlbarView-favicon {
|
||||
margin-inline-start: calc(12px + @urlbarViewIconMarginEnd@);
|
||||
}
|
||||
|
||||
/* The help icon is a standard Photon ghost button. */
|
||||
.urlbarView-tip-help {
|
||||
min-width: 16px;
|
||||
|
@ -268,34 +226,28 @@
|
|||
}
|
||||
}
|
||||
|
||||
.urlbarView.megabar .urlbarView-row[type=bookmark] > .urlbarView-row-inner > .urlbarView-no-wrap > .urlbarView-type-icon {
|
||||
.urlbarView-row[type=bookmark] > .urlbarView-row-inner > .urlbarView-no-wrap > .urlbarView-type-icon {
|
||||
background-image: url(chrome://browser/skin/bookmark-12.svg);
|
||||
color: #0060df; /* Blue-60 */
|
||||
stroke: #fff;
|
||||
}
|
||||
|
||||
.urlbarView.megabar .urlbarView-row[type=remotetab] > .urlbarView-row-inner > .urlbarView-no-wrap > .urlbarView-type-icon,
|
||||
.urlbarView.megabar:not([actionoverride]) .urlbarView-row[type=switchtab] > .urlbarView-row-inner > .urlbarView-no-wrap > .urlbarView-type-icon {
|
||||
.urlbarView-row[type=remotetab] > .urlbarView-row-inner > .urlbarView-no-wrap > .urlbarView-type-icon {
|
||||
background-image: url(chrome://browser/skin/tab-12.svg);
|
||||
color: #008eaf; /* Teal-70 */
|
||||
stroke: #fff;
|
||||
}
|
||||
|
||||
:root[lwt-toolbar-field-brighttext] .urlbarView.megabar .urlbarView-row[type=bookmark] > .urlbarView-row-inner > .urlbarView-no-wrap > .urlbarView-type-icon {
|
||||
:root[lwt-toolbar-field-brighttext] .urlbarView-row[type=bookmark] > .urlbarView-row-inner > .urlbarView-no-wrap > .urlbarView-type-icon {
|
||||
color: #0a84ff; /* Blue-50 */
|
||||
stroke: #38383d; /* Grey-70 */
|
||||
}
|
||||
|
||||
:root[lwt-toolbar-field-brighttext] .urlbarView.megabar .urlbarView-row[type=remotetab] > .urlbarView-row-inner > .urlbarView-no-wrap > .urlbarView-type-icon,
|
||||
:root[lwt-toolbar-field-brighttext] .urlbarView.megabar:not([actionoverride]) .urlbarView-row[type=switchtab] > .urlbarView-row-inner > .urlbarView-no-wrap > .urlbarView-type-icon {
|
||||
:root[lwt-toolbar-field-brighttext] .urlbarView-row[type=remotetab] > .urlbarView-row-inner > .urlbarView-no-wrap > .urlbarView-type-icon {
|
||||
color: #00c8d7; /* Teal-60 */
|
||||
stroke: #38383d; /* Grey-70 */
|
||||
}
|
||||
|
||||
.urlbarView-row[type=bookmark] > .urlbarView-row-inner > .urlbarView-no-wrap > .urlbarView-type-icon {
|
||||
background-image: url(chrome://browser/skin/bookmark.svg);
|
||||
}
|
||||
|
||||
.urlbarView-row[type=remotetab] > .urlbarView-row-inner > .urlbarView-no-wrap > .urlbarView-type-icon,
|
||||
.urlbarView:not([actionoverride]) .urlbarView-row[type=switchtab] > .urlbarView-row-inner > .urlbarView-no-wrap > .urlbarView-type-icon {
|
||||
background-image: url(chrome://browser/skin/tab.svg);
|
||||
|
@ -318,13 +270,6 @@
|
|||
width: 100%;
|
||||
}
|
||||
|
||||
/* For non-megabar tips in narrow windows, wrap the buttons below the text. */
|
||||
@media screen and (max-width: 800px) {
|
||||
.urlbarView:not(.megabar) .urlbarView-row[type=tip] > .urlbarView-row-inner {
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
}
|
||||
|
||||
/* For tips, give the title some bottom margin so that when the window is narrow
|
||||
and the buttons wrap below it, there's space between it and the buttons. We
|
||||
then need to give the same bottom margin to the other tip elements so that
|
||||
|
@ -398,10 +343,6 @@
|
|||
flex-shrink: 1;
|
||||
}
|
||||
|
||||
.urlbarView:not(.megabar) .urlbarView-row[type=tip] > .urlbarView-row-inner > .urlbarView-title {
|
||||
flex-basis: calc(100% - /* .urlbarView-favicon margin-inline-start */ (12px + @urlbarViewIconMarginEnd@) - /* .urlbarView-favicon width */ 24px - /* .urlbarView-favicon margin-inline-end */ 12px);
|
||||
}
|
||||
|
||||
.urlbarView-title-separator::before {
|
||||
content: "\2014";
|
||||
margin: 0 .4em;
|
||||
|
@ -418,13 +359,6 @@
|
|||
font-size: .85em;
|
||||
}
|
||||
|
||||
/* The megabar uses full bold weight (700). */
|
||||
.urlbarView:not(.megabar) .urlbarView-title > strong,
|
||||
.urlbarView:not(.megabar) .urlbarView-url > strong,
|
||||
.urlbarView:not(.megabar) .urlbarView-tag > strong {
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.urlbarView-title:not(:empty) ~ .urlbarView-action {
|
||||
color: var(--urlbar-popup-action-color);
|
||||
}
|
||||
|
@ -480,11 +414,6 @@
|
|||
flex-wrap: wrap;
|
||||
}
|
||||
|
||||
#urlbar:not(.megabar) .search-one-offs {
|
||||
padding-inline-start: calc(var(--item-padding-start, 5px) - /* icon padding */ 8px);
|
||||
padding-inline-end: var(--item-padding-end, 5px);
|
||||
}
|
||||
|
||||
#urlbar .search-panel-one-offs-container {
|
||||
/* Make sure horizontally we can fit four buttons, empty space, settings. */
|
||||
min-width: calc(4 * /* one-off with end margin */ 40px + /* settings with start margin */ 56px);
|
||||
|
|
|
@ -39,8 +39,7 @@
|
|||
color: -moz-FieldText;
|
||||
}
|
||||
|
||||
#urlbar:not(.megabar),
|
||||
#urlbar.megabar > #urlbar-background,
|
||||
#urlbar-background,
|
||||
#searchbar {
|
||||
background-color: -moz-Field;
|
||||
background-clip: padding-box;
|
||||
|
@ -66,15 +65,13 @@
|
|||
padding: 0;
|
||||
}
|
||||
|
||||
#urlbar:not(.megabar):not([focused="true"]):hover,
|
||||
#urlbar.megabar:not([focused="true"]):hover > #urlbar-background,
|
||||
#urlbar:not([focused="true"]):hover > #urlbar-background,
|
||||
#searchbar:not(:focus-within):hover {
|
||||
border-color: @fieldHoverBorderColor@;
|
||||
box-shadow: 0 1px 6px rgba(0,0,0,.1);
|
||||
}
|
||||
|
||||
#urlbar:not(.megabar)[focused="true"],
|
||||
#urlbar.megabar[focused="true"] > #urlbar-background,
|
||||
#urlbar[focused="true"] > #urlbar-background,
|
||||
#searchbar:focus-within {
|
||||
border-color: var(--toolbar-field-focus-border-color);
|
||||
}
|
||||
|
@ -84,26 +81,22 @@
|
|||
color: var(--lwt-toolbar-field-color, black);
|
||||
}
|
||||
|
||||
#urlbar:not(.megabar):-moz-lwtheme,
|
||||
#urlbar.megabar:-moz-lwtheme > #urlbar-background,
|
||||
#urlbar:-moz-lwtheme > #urlbar-background,
|
||||
#navigator-toolbox #searchbar:-moz-lwtheme {
|
||||
background-color: var(--lwt-toolbar-field-background-color, hsla(0,0%,100%,.8));
|
||||
}
|
||||
|
||||
#urlbar:not(.megabar):not([focused="true"]):-moz-lwtheme,
|
||||
#urlbar.megabar:not([focused="true"]):-moz-lwtheme > #urlbar-background,
|
||||
#urlbar:not([focused="true"]):-moz-lwtheme > #urlbar-background,
|
||||
#navigator-toolbox #searchbar:not(:focus-within):-moz-lwtheme {
|
||||
border-color: var(--lwt-toolbar-field-border-color, @fieldBorderColor@);
|
||||
}
|
||||
|
||||
#urlbar:not(.megabar):not([focused="true"]):-moz-lwtheme:hover,
|
||||
#urlbar.megabar:not([focused="true"]):-moz-lwtheme:hover > #urlbar-background,
|
||||
#urlbar:not([focused="true"]):-moz-lwtheme:hover > #urlbar-background,
|
||||
#navigator-toolbox #searchbar:not(:focus-within):-moz-lwtheme:hover {
|
||||
border-color: var(--lwt-toolbar-field-border-color, @fieldHoverBorderColor@);
|
||||
}
|
||||
|
||||
#urlbar:not(.megabar):-moz-lwtheme:hover,
|
||||
#urlbar.megabar:-moz-lwtheme:hover > #urlbar-background,
|
||||
#urlbar:-moz-lwtheme:hover > #urlbar-background,
|
||||
#navigator-toolbox #searchbar:-moz-lwtheme:hover {
|
||||
background-color: var(--lwt-toolbar-field-background-color, white);
|
||||
}
|
||||
|
@ -113,8 +106,7 @@
|
|||
color: var(--lwt-toolbar-field-focus-color);
|
||||
}
|
||||
|
||||
#urlbar:not(.megabar)[focused="true"]:-moz-lwtheme,
|
||||
#urlbar.megabar[focused="true"]:-moz-lwtheme > #urlbar-background,
|
||||
#urlbar[focused="true"]:-moz-lwtheme > #urlbar-background,
|
||||
#navigator-toolbox #searchbar:focus-within:-moz-lwtheme {
|
||||
background-color: var(--lwt-toolbar-field-focus);
|
||||
}
|
||||
|
@ -149,13 +141,13 @@
|
|||
* the bounds of the urlbar.
|
||||
*/
|
||||
|
||||
#urlbar.megabar,
|
||||
#urlbar.megabar > #urlbar-input-container,
|
||||
#urlbar.megabar > .urlbarView {
|
||||
#urlbar,
|
||||
#urlbar-input-container,
|
||||
.urlbarView {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
#urlbar.megabar > #urlbar-background {
|
||||
#urlbar-background {
|
||||
display: block;
|
||||
position: absolute;
|
||||
inset: 0;
|
||||
|
@ -166,7 +158,7 @@
|
|||
inset-inline-start: @urlbarSearchButtonWidth@;
|
||||
}
|
||||
|
||||
#urlbar.megabar > #urlbar-input-container {
|
||||
#urlbar-input-container {
|
||||
/* Match urlbar-background's border. */
|
||||
border: 1px solid transparent;
|
||||
}
|
||||
|
@ -191,7 +183,7 @@
|
|||
}
|
||||
|
||||
#urlbar:not([open]) > .urlbarView,
|
||||
#urlbar.megabar:not([breakout]) > .urlbarView {
|
||||
#urlbar:not([breakout]) > .urlbarView {
|
||||
display: none;
|
||||
}
|
||||
|
||||
|
@ -495,19 +487,6 @@
|
|||
transform: scaleX(-1);
|
||||
}
|
||||
|
||||
.urlbar-history-dropmarker {
|
||||
list-style-image: url(chrome://global/skin/icons/arrow-dropdown-16.svg);
|
||||
transition: opacity 0.15s ease;
|
||||
}
|
||||
|
||||
#urlbar[switchingtabs] > #urlbar-input-container > .urlbar-history-dropmarker {
|
||||
transition: none;
|
||||
}
|
||||
|
||||
#nav-bar:not([customizing="true"]) > #nav-bar-customization-target > #urlbar-container:not(:hover) > #urlbar:not([focused]) > #urlbar-input-container > .urlbar-history-dropmarker {
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
#pageActionButton,
|
||||
.share-more-button {
|
||||
list-style-image: url("chrome://global/skin/icons/more.svg");
|
||||
|
@ -791,17 +770,6 @@
|
|||
mask-position-x: 0;
|
||||
}
|
||||
|
||||
/* Translate the dropmarker to give illusion of increasing width of the recommendation */
|
||||
#urlbar[cfr-recommendation-state] .urlbar-history-dropmarker {
|
||||
transition: transform ease-in-out var(--cfr-animation-duration);
|
||||
}
|
||||
#urlbar[cfr-recommendation-state="expanded"] .urlbar-history-dropmarker {
|
||||
transform: translateX(calc(var(--cfr-label-width) * -1));
|
||||
}
|
||||
#urlbar[cfr-recommendation-state="expanded"] .urlbar-history-dropmarker:-moz-locale-dir(rtl) {
|
||||
transform: translateX(calc(var(--cfr-label-width)));
|
||||
}
|
||||
|
||||
/* Shift the url-bar text fading to stop the recommendation overlapping */
|
||||
#urlbar[cfr-recommendation-state] #urlbar-input {
|
||||
/* A mask-image is usually only defined for the url bar when text overflows.
|
||||
|
|
|
@ -510,8 +510,7 @@ menuitem.bookmark-item {
|
|||
}
|
||||
|
||||
@media (-moz-windows-default-theme: 0) {
|
||||
#urlbar:not(.megabar):not(:-moz-lwtheme):not([focused="true"]),
|
||||
#urlbar.megabar:not(:-moz-lwtheme):not([focused="true"]) > #urlbar-background,
|
||||
#urlbar:not(:-moz-lwtheme):not([focused="true"]) > #urlbar-background,
|
||||
#searchbar:not(:-moz-lwtheme):not(:focus-within) {
|
||||
border-color: ThreeDShadow;
|
||||
}
|
||||
|
|
|
@ -101,44 +101,11 @@ add_task(async function test_popup_url() {
|
|||
"Should get maxResults=" + maxResults + " results"
|
||||
);
|
||||
|
||||
let popup = gURLBar.view.panel;
|
||||
|
||||
if (!gURLBar.megabar) {
|
||||
// The urlbar popup supports these colors only with the legacy non-megabar
|
||||
// design. With megabar, the popup visually extends the textbox and use its
|
||||
// colors.
|
||||
let popupCS = window.getComputedStyle(popup);
|
||||
|
||||
Assert.equal(
|
||||
popupCS.backgroundColor,
|
||||
`rgb(${hexToRGB(POPUP_COLOR).join(", ")})`,
|
||||
`Popup background color should be set to ${POPUP_COLOR}`
|
||||
);
|
||||
|
||||
Assert.equal(
|
||||
popupCS.borderBottomColor,
|
||||
`rgb(${hexToRGB(CHROME_CONTENT_SEPARATOR_COLOR).join(", ")})`,
|
||||
`Popup bottom color should be set to ${CHROME_CONTENT_SEPARATOR_COLOR}`
|
||||
);
|
||||
|
||||
Assert.equal(
|
||||
popupCS.color,
|
||||
`rgb(${hexToRGB(POPUP_TEXT_COLOR_DARK).join(", ")})`,
|
||||
`Popup color should be set to ${POPUP_TEXT_COLOR_DARK}`
|
||||
);
|
||||
}
|
||||
|
||||
// Set the selected attribute to true to test the highlight popup properties
|
||||
UrlbarTestUtils.setSelectedRowIndex(window, 1);
|
||||
let actionResult = await UrlbarTestUtils.getDetailsOfResultAt(window, 0);
|
||||
let urlResult = await UrlbarTestUtils.getDetailsOfResultAt(window, 1);
|
||||
let resultCS;
|
||||
if (gURLBar.megabar) {
|
||||
// The megabar styles the highlight on the urlbarView-row-inner element.
|
||||
resultCS = window.getComputedStyle(urlResult.element.row._content);
|
||||
} else {
|
||||
resultCS = window.getComputedStyle(urlResult.element.row);
|
||||
}
|
||||
let resultCS = window.getComputedStyle(urlResult.element.row._content);
|
||||
|
||||
Assert.equal(
|
||||
resultCS.backgroundColor,
|
||||
|
@ -212,17 +179,6 @@ add_task(async function test_popup_url() {
|
|||
|
||||
await extension.startup();
|
||||
|
||||
if (!gURLBar.megabar) {
|
||||
// The urlbar popup supports this color only with the legacy non-megabar
|
||||
// design. With megabar, the popup visually extends the textbox and use its
|
||||
// colors.
|
||||
Assert.equal(
|
||||
window.getComputedStyle(popup).color,
|
||||
`rgb(${hexToRGB(POPUP_TEXT_COLOR_BRIGHT).join(", ")})`,
|
||||
`Popup color should be set to ${POPUP_TEXT_COLOR_BRIGHT}`
|
||||
);
|
||||
}
|
||||
|
||||
Assert.equal(
|
||||
window.getComputedStyle(urlResult.element.url).color,
|
||||
`rgb(${hexToRGB(POPUP_URL_COLOR_BRIGHT).join(", ")})`,
|
||||
|
|
|
@ -50,9 +50,7 @@ add_task(async function test_support_toolbar_field_properties() {
|
|||
});
|
||||
|
||||
let fields = [
|
||||
gURLBar.megabar
|
||||
? document.querySelector("#urlbar-background")
|
||||
: gURLBar.textbox,
|
||||
document.querySelector("#urlbar-background"),
|
||||
BrowserSearch.searchBar,
|
||||
].filter(field => {
|
||||
let bounds = field.getBoundingClientRect();
|
||||
|
|
|
@ -35,9 +35,7 @@ add_task(async function test_toolbar_field_focus() {
|
|||
|
||||
info("Checking toolbar field's focus color");
|
||||
|
||||
let urlBar = gURLBar.megabar
|
||||
? document.querySelector("#urlbar-background")
|
||||
: gURLBar.textbox;
|
||||
let urlBar = document.querySelector("#urlbar-background");
|
||||
gURLBar.textbox.setAttribute("focused", "true");
|
||||
|
||||
Assert.equal(
|
||||
|
@ -87,9 +85,7 @@ add_task(async function test_toolbar_field_focus_low_alpha() {
|
|||
await extension.startup();
|
||||
gURLBar.textbox.setAttribute("focused", "true");
|
||||
|
||||
let urlBar = gURLBar.megabar
|
||||
? document.querySelector("#urlbar-background")
|
||||
: gURLBar.textbox;
|
||||
let urlBar = document.querySelector("#urlbar-background");
|
||||
Assert.equal(
|
||||
window.getComputedStyle(urlBar).backgroundColor,
|
||||
`rgba(0, 0, 255, 0.9)`,
|
||||
|
|
Загрузка…
Ссылка в новой задаче