--- a/browser/base/content/browser-addons.js
+++ b/browser/base/content/browser-addons.js
@@ -81,17 +81,17 @@ const gXPInstallObserver = {
// If all installs have already been cancelled in some way then just show
// the next confirmation
if (installInfo.installs.every(i => i.state != AddonManager.STATE_DOWNLOADED)) {
showNextConfirmation();
return;
}
- const anchorID = "addons-notification-icon";
+ const anchorClass = "addons-notification-icon";
// Make notifications persist a minimum of 30 seconds
var options = {
displayURI: installInfo.originatingURI,
timeout: Date.now() + 30000,
};
let cancelInstallation = () => {
@@ -199,17 +199,17 @@ const gXPInstallObserver = {
}
let tab = gBrowser.getTabForBrowser(browser);
if (tab) {
gBrowser.selectedTab = tab;
}
let popup = PopupNotifications.show(browser, "addon-install-confirmation",
- messageString, anchorID, null, null,
+ messageString, anchorClass, null, null,
options);
removeNotificationOnEnd(popup, installInfo.installs);
Services.telemetry
.getHistogramById("SECURITY_UI")
.add(Ci.nsISecurityUITelemetry.WARNING_CONFIRM_ADDON_INSTALL);
},
@@ -219,17 +219,17 @@ const gXPInstallObserver = {
var brandBundle = document.getElementById("bundle_brand");
var installInfo = aSubject.QueryInterface(Components.interfaces.amIWebInstallInfo);
var browser = installInfo.browser;
// Make sure the browser is still alive.
if (!browser || gBrowser.browsers.indexOf(browser) == -1)
return;
- const anchorID = "addons-notification-icon";
+ const anchorClass = "addons-notification-icon";
var messageString, action;
var brandShortName = brandBundle.getString("brandShortName");
var notificationID = aTopic;
// Make notifications persist a minimum of 30 seconds
var options = {
displayURI: installInfo.originatingURI,
timeout: Date.now() + 30000,
@@ -250,27 +250,27 @@ const gXPInstallObserver = {
label: gNavigatorBundle.getString("xpinstallDisabledButton"),
accessKey: gNavigatorBundle.getString("xpinstallDisabledButton.accesskey"),
callback: function editPrefs() {
gPrefService.setBoolPref("xpinstall.enabled", true);
}
};
}
- PopupNotifications.show(browser, notificationID, messageString, anchorID,
+ PopupNotifications.show(browser, notificationID, messageString, anchorClass,
action, null, options);
break; }
case "addon-install-origin-blocked": {
messageString = gNavigatorBundle.getFormattedString("xpinstallPromptMessage",
[brandShortName]);
let secHistogram = Components.classes["@mozilla.org/base/telemetry;1"].getService(Ci.nsITelemetry).getHistogramById("SECURITY_UI");
secHistogram.add(Ci.nsISecurityUITelemetry.WARNING_ADDON_ASKING_PREVENTED);
let popup = PopupNotifications.show(browser, notificationID,
- messageString, anchorID,
+ messageString, anchorClass,
null, null, options);
removeNotificationOnEnd(popup, installInfo.installs);
break; }
case "addon-install-blocked": {
messageString = gNavigatorBundle.getFormattedString("xpinstallPromptMessage",
[brandShortName]);
let secHistogram = Components.classes["@mozilla.org/base/telemetry;1"].getService(Ci.nsITelemetry).getHistogramById("SECURITY_UI");
@@ -280,17 +280,17 @@ const gXPInstallObserver = {
callback: function() {
secHistogram.add(Ci.nsISecurityUITelemetry.WARNING_ADDON_ASKING_PREVENTED_CLICK_THROUGH);
installInfo.install();
}
};
secHistogram.add(Ci.nsISecurityUITelemetry.WARNING_ADDON_ASKING_PREVENTED);
let popup = PopupNotifications.show(browser, notificationID,
- messageString, anchorID,
+ messageString, anchorClass,
action, null, options);
removeNotificationOnEnd(popup, installInfo.installs);
break; }
case "addon-install-started": {
let needsDownload = function needsDownload(aInstall) {
return aInstall.state != AddonManager.STATE_DOWNLOADED;
}
// If all installs have already been downloaded then there is no need to
@@ -308,17 +308,17 @@ const gXPInstallObserver = {
switch (aEvent) {
case "removed":
options.contentWindow = null;
options.sourceURI = null;
break;
}
};
let notification = PopupNotifications.show(browser, notificationID, messageString,
- anchorID, null, null, options);
+ anchorClass, null, null, options);
notification._startTime = Date.now();
let cancelButton = document.getElementById("addon-progress-cancel");
cancelButton.label = gNavigatorBundle.getString("addonInstall.cancelButton.label");
cancelButton.accessKey = gNavigatorBundle.getString("addonInstall.cancelButton.accesskey");
let acceptButton = document.getElementById("addon-progress-accept");
if (Preferences.get("xpinstall.customConfirmationUI", false)) {
@@ -357,17 +357,17 @@ const gXPInstallObserver = {
// Add Learn More link when refusing to install an unsigned add-on
if (install.error == AddonManager.ERROR_SIGNEDSTATE_REQUIRED) {
options.learnMoreURL = Services.urlFormatter.formatURLPref("app.support.baseURL") + "unsigned-addons";
}
messageString = gNavigatorBundle.getFormattedString(error, args);
- PopupNotifications.show(browser, notificationID, messageString, anchorID,
+ PopupNotifications.show(browser, notificationID, messageString, anchorClass,
action, null, options);
// Can't have multiple notifications with the same ID, so stop here.
break;
}
this._removeProgressNotification(browser);
break; }
case "addon-install-confirmation": {
@@ -424,17 +424,17 @@ const gXPInstallObserver = {
messageString = messageString.replace("#2", installInfo.installs.length);
messageString = messageString.replace("#3", brandShortName);
// Remove notificaion on dismissal, since it's possible to cancel the
// install through the addons manager UI, making the "restart" prompt
// irrelevant.
options.removeOnDismissal = true;
- PopupNotifications.show(browser, notificationID, messageString, anchorID,
+ PopupNotifications.show(browser, notificationID, messageString, anchorClass,
action, null, options);
break; }
}
},
_removeProgressNotification(aBrowser) {
let notification = PopupNotifications.getNotification("addon-progress", aBrowser);
if (notification)
notification.remove();
--- a/browser/base/content/browser-media.js
+++ b/browser/base/content/browser-media.js
@@ -146,38 +146,38 @@ var gEMEHandler = {
}
let msgPrefix = "emeNotifications.drmContentPlaying.";
let msgId = msgPrefix + "message2";
let btnLabelId = msgPrefix + "button.label";
let btnAccessKeyId = msgPrefix + "button.accesskey";
let message = gNavigatorBundle.getFormattedString(msgId, [this._brandShortName]);
- let anchorId = "eme-notification-icon";
+ let anchorClass = "eme-notification-icon";
let firstPlayPref = "browser.eme.ui.firstContentShown";
if (!Services.prefs.getPrefType(firstPlayPref) ||
!Services.prefs.getBoolPref(firstPlayPref)) {
- document.getElementById(anchorId).setAttribute("firstplay", "true");
+ document.querySelector("." + anchorClass).setAttribute("firstplay", "true");
Services.prefs.setBoolPref(firstPlayPref, true);
} else {
- document.getElementById(anchorId).removeAttribute("firstplay");
+ document.querySelector("." + anchorClass).removeAttribute("firstplay");
}
let mainAction = {
label: gNavigatorBundle.getString(btnLabelId),
accessKey: gNavigatorBundle.getString(btnAccessKeyId),
callback: function() { openPreferences("paneContent"); },
dismiss: true
};
let options = {
dismissed: true,
eventCallback: aTopic => aTopic == "swapping",
learnMoreURL: Services.urlFormatter.formatURLPref("app.support.baseURL") + "drm-content",
};
- PopupNotifications.show(browser, "drmContentPlaying", message, anchorId, mainAction, null, options);
+ PopupNotifications.show(browser, "drmContentPlaying", message, anchorClass, mainAction, null, options);
},
QueryInterface: XPCOMUtils.generateQI([Ci.nsIMessageListener])
};
XPCOMUtils.defineLazyGetter(gEMEHandler, "_brandShortName", function() {
return document.getElementById("bundle_brand").getString("brandShortName");
});
--- a/browser/base/content/browser-plugins.js
+++ b/browser/base/content/browser-plugins.js
@@ -322,17 +322,17 @@ var gPluginHandler = {
// ensure we aren't getting a message from a Data URI that we're no longer
// looking at.
let receivedURI = BrowserUtils.makeURI(location);
if (!browser.documentURI.equalsExceptRef(receivedURI)) {
return;
}
// Set up the icon
- document.getElementById("plugins-notification-icon").classList.
+ document.querySelector(".plugins-notification-icon").classList.
toggle("plugin-blocked", haveInsecure);
// Now configure the notification bar
let notificationBox = gBrowser.getNotificationBox(browser);
function hideNotification() {
let n = notificationBox.getNotificationWithValue("plugin-hidden");
if (n) {
--- a/browser/base/content/browser.js
+++ b/browser/base/content/browser.js
@@ -5790,19 +5790,19 @@ var OfflineApps = {
};
let warnQuotaKB = Services.prefs.getIntPref("offline-apps.quota.warn");
// This message shows the quota in MB, and so we divide the quota (in kb) by 1024.
let message = gNavigatorBundle.getFormattedString("offlineApps.usage",
[ uri.host,
warnQuotaKB / 1024 ]);
- let anchorID = "indexedDB-notification-icon";
+ let anchorClass = "indexedDB-notification-icon";
PopupNotifications.show(browser, "offline-app-usage", message,
- anchorID, mainAction);
+ anchorClass, mainAction);
// Now that we've warned once, prevent the warning from showing up
// again.
Services.perms.add(uri, "offline-app",
Ci.nsIOfflineCacheUpdateService.ALLOW_NO_WARN);
},
// XXX: duplicated in preferences/advanced.js
@@ -5870,22 +5870,22 @@ var OfflineApps = {
callback: function() {
for (let [, , uri] of notification.options.controlledItems) {
OfflineApps.disallowSite(uri);
}
}
}];
let message = gNavigatorBundle.getFormattedString("offlineApps.available",
[host]);
- let anchorID = "indexedDB-notification-icon";
+ let anchorClass = "indexedDB-notification-icon";
let options = {
controlledItems : [[Cu.getWeakReference(browser), docId, uri]]
};
notification = PopupNotifications.show(browser, notificationID, message,
- anchorID, mainAction,
+ anchorClass, mainAction,
secondaryActions, options);
}
},
disallowSite(uri) {
Services.perms.add(uri, "offline-app", Services.perms.DENY_ACTION);
},
--- a/browser/base/content/browser.xul
+++ b/browser/base/content/browser.xul
@@ -706,53 +706,53 @@
maxrows="10"
newlines="stripsurroundingwhitespace"
ontextentered="this.handleCommand(param);"
ontextreverted="return this.handleRevert();"
pageproxystate="invalid"
onfocus="document.getElementById('identity-box').style.MozUserFocus= 'normal'"
onblur="setTimeout(() => { document.getElementById('identity-box').style.MozUserFocus = ''; }, 0);">
<box id="notification-popup-box" hidden="true" align="center">
- <image id="default-notification-icon" class="notification-anchor-icon" role="button"
+ <image class="default-notification-icon notification-anchor-icon" role="button"
aria-label="&urlbar.defaultNotificationAnchor.label;"/>
- <image id="geo-notification-icon" class="notification-anchor-icon" role="button"
+ <image class="geo-notification-icon notification-anchor-icon" role="button"
aria-label="&urlbar.geolocationNotificationAnchor.label;"/>
- <image id="addons-notification-icon" class="notification-anchor-icon" role="button"
+ <image class="addons-notification-icon notification-anchor-icon" role="button"
aria-label="&urlbar.addonsNotificationAnchor.label;"/>
- <image id="indexedDB-notification-icon" class="notification-anchor-icon" role="button"
+ <image class="indexedDB-notification-icon notification-anchor-icon" role="button"
aria-label="&urlbar.indexedDBNotificationAnchor.label;"/>
- <image id="login-fill-notification-icon" class="notification-anchor-icon" role="button"
+ <image class="login-fill-notification-icon notification-anchor-icon" role="button"
aria-label="&urlbar.loginFillNotificationAnchor.label;"/>
- <image id="password-notification-icon" class="notification-anchor-icon" role="button"
+ <image class="password-notification-icon notification-anchor-icon" role="button"
aria-label="&urlbar.passwordNotificationAnchor.label;"/>
- <image id="plugins-notification-icon" class="notification-anchor-icon" role="button"
+ <image class="plugins-notification-icon notification-anchor-icon" role="button"
aria-label="&urlbar.pluginsNotificationAnchor.label;"/>
- <image id="web-notifications-notification-icon" class="notification-anchor-icon" role="button"
+ <image class="web-notifications-notification-icon notification-anchor-icon" role="button"
aria-label="&urlbar.webNotsNotificationAnchor3.label;"/>
- <image id="webRTC-shareDevices-notification-icon" class="notification-anchor-icon" role="button"
+ <image class="webRTC-shareDevices-notification-icon notification-anchor-icon" role="button"
aria-label="&urlbar.webRTCShareDevicesNotificationAnchor.label;"/>
- <image id="webRTC-sharingDevices-notification-icon" class="notification-anchor-icon" role="button"
+ <image class="webRTC-sharingDevices-notification-icon notification-anchor-icon" role="button"
aria-label="&urlbar.webRTCSharingDevicesNotificationAnchor.label;"/>
- <image id="webRTC-shareMicrophone-notification-icon" class="notification-anchor-icon" role="button"
+ <image class="webRTC-shareMicrophone-notification-icon notification-anchor-icon" role="button"
aria-label="&urlbar.webRTCShareMicrophoneNotificationAnchor.label;"/>
- <image id="webRTC-sharingMicrophone-notification-icon" class="notification-anchor-icon" role="button"
+ <image class="webRTC-sharingMicrophone-notification-icon notification-anchor-icon" role="button"
aria-label="&urlbar.webRTCSharingMicrophoneNotificationAnchor.label;"/>
- <image id="webRTC-shareScreen-notification-icon" class="notification-anchor-icon" role="button"
+ <image class="webRTC-shareScreen-notification-icon notification-anchor-icon" role="button"
aria-label="&urlbar.webRTCShareScreenNotificationAnchor.label;"/>
- <image id="webRTC-sharingScreen-notification-icon" class="notification-anchor-icon" role="button"
+ <image class="webRTC-sharingScreen-notification-icon notification-anchor-icon" role="button"
aria-label="&urlbar.webRTCSharingScreenNotificationAnchor.label;"/>
- <image id="pointerLock-notification-icon" class="notification-anchor-icon" role="button"
+ <image class="pointerLock-notification-icon notification-anchor-icon" role="button"
aria-label="&urlbar.pointerLockNotificationAnchor.label;"/>
- <image id="servicesInstall-notification-icon" class="notification-anchor-icon" role="button"
+ <image class="servicesInstall-notification-icon notification-anchor-icon" role="button"
aria-label="&urlbar.servicesNotificationAnchor.label;"/>
- <image id="translate-notification-icon" class="notification-anchor-icon" role="button"
+ <image class="translate-notification-icon notification-anchor-icon" role="button"
aria-label="&urlbar.translateNotificationAnchor.label;"/>
- <image id="translated-notification-icon" class="notification-anchor-icon" role="button"
+ <image class="translated-notification-icon notification-anchor-icon" role="button"
aria-label="&urlbar.translatedNotificationAnchor.label;"/>
- <image id="eme-notification-icon" class="notification-anchor-icon" role="button"
+ <image class="eme-notification-icon notification-anchor-icon" role="button"
aria-label="&urlbar.emeNotificationAnchor.label;"/>
</box>
<!-- Use onclick instead of normal popup= syntax since the popup
code fires onmousedown, and hence eats our favicon drag events.
We only add the identity-box button to the tab order when the location bar
has focus, otherwise pressing F6 focuses it instead of the location bar -->
<box id="identity-box" role="button"
align="center"
--- a/browser/base/content/socialchat.xml
+++ b/browser/base/content/socialchat.xml
@@ -8,22 +8,22 @@
<binding id="chatbox">
<content orient="vertical" mousethrough="never">
<xul:hbox class="chat-titlebar" xbl:inherits="minimized,selected,activity" align="baseline">
<xul:hbox flex="1" onclick="document.getBindingParent(this).onTitlebarClick(event);">
<xul:image class="chat-status-icon" xbl:inherits="src=image"/>
<xul:label class="chat-title" flex="1" xbl:inherits="crop=titlecrop,value=label" crop="end"/>
</xul:hbox>
<xul:toolbarbutton anonid="webRTC-shareScreen-icon"
- class="notification-anchor-icon chat-toolbarbutton"
+ class="webRTC-shareScreen-notification-icon notification-anchor-icon chat-toolbarbutton"
oncommand="document.getBindingParent(this).showNotifications(this); event.stopPropagation();"/>
<xul:toolbarbutton anonid="webRTC-sharingScreen-icon"
- class="notification-anchor-icon chat-toolbarbutton"
+ class="webRTC-sharingScreen-notification-icon notification-anchor-icon chat-toolbarbutton"
oncommand="document.getBindingParent(this).showNotifications(this); event.stopPropagation();"/>
- <xul:toolbarbutton anonid="notification-icon" class="notification-anchor-icon chat-toolbarbutton"
+ <xul:toolbarbutton anonid="notification-icon" class="notification-anchor-icon default-notification-icon chat-toolbarbutton"
oncommand="document.getBindingParent(this).showNotifications(this); event.stopPropagation();"/>
<xul:toolbarbutton anonid="minimize" class="chat-minimize-button chat-toolbarbutton"
oncommand="document.getBindingParent(this).toggle();"/>
<xul:toolbarbutton anonid="swap" class="chat-swap-button chat-toolbarbutton"
oncommand="document.getBindingParent(this).swapWindows();"/>
<xul:toolbarbutton anonid="close" class="chat-close-button chat-toolbarbutton"
oncommand="document.getBindingParent(this).close();"/>
</xul:hbox>
--- a/browser/base/content/test/general/browser_bug553455.js
+++ b/browser/base/content/test/general/browser_bug553455.js
@@ -1021,17 +1021,17 @@ function test_cancel() {
loadUsingSystemPrincipal: true
}, callback || (() => {}));
}
// Wait for the progress notification
wait_for_notification(PROGRESS_NOTIFICATION, function(aPanel) {
let notification = aPanel.childNodes[0];
// Close the notification
- let anchor = document.getElementById("addons-notification-icon");
+ let anchor = document.querySelector(".addons-notification-icon");
anchor.click();
// Reopen the notification
anchor.click();
ok(PopupNotifications.isPanelOpen, "Notification should still be open");
is(PopupNotifications.panel.childNodes.length, 1, "Should be only one notification");
notification = aPanel.childNodes[0];
is(notification.id, "addon-progress-notification", "Should have seen the progress notification");
--- a/browser/base/content/test/general/browser_devices_get_user_media.js
+++ b/browser/base/content/test/general/browser_devices_get_user_media.js
@@ -27,17 +27,17 @@ var gTests = [
{
desc: "getUserMedia audio+video",
run: function checkAudioVideo() {
let promise = promisePopupNotificationShown("webRTC-shareDevices");
yield promiseRequestDevice(true, true);
yield promise;
yield expectObserverCalled("getUserMedia:request");
- is(PopupNotifications.getNotification("webRTC-shareDevices").anchorID,
+ is(PopupNotifications.getNotification("webRTC-shareDevices").anchorClass,
"webRTC-shareDevices-notification-icon", "anchored to device icon");
checkDeviceSelectors(true, true);
is(PopupNotifications.panel.firstChild.getAttribute("popupid"),
"webRTC-shareDevices", "panel using devices icon");
let indicator = promiseIndicatorWindow();
yield promiseMessage("ok", () => {
PopupNotifications.panel.firstChild.button.click();
@@ -56,17 +56,17 @@ var gTests = [
{
desc: "getUserMedia audio only",
run: function checkAudioOnly() {
let promise = promisePopupNotificationShown("webRTC-shareDevices");
yield promiseRequestDevice(true);
yield promise;
yield expectObserverCalled("getUserMedia:request");
- is(PopupNotifications.getNotification("webRTC-shareDevices").anchorID,
+ is(PopupNotifications.getNotification("webRTC-shareDevices").anchorClass,
"webRTC-shareMicrophone-notification-icon", "anchored to mic icon");
checkDeviceSelectors(true);
is(PopupNotifications.panel.firstChild.getAttribute("popupid"),
"webRTC-shareMicrophone", "panel using microphone icon");
enableDevice("Microphone", true);
let indicator = promiseIndicatorWindow();
@@ -87,17 +87,17 @@ var gTests = [
{
desc: "getUserMedia video only",
run: function checkVideoOnly() {
let promise = promisePopupNotificationShown("webRTC-shareDevices");
yield promiseRequestDevice(false, true);
yield promise;
yield expectObserverCalled("getUserMedia:request");
- is(PopupNotifications.getNotification("webRTC-shareDevices").anchorID,
+ is(PopupNotifications.getNotification("webRTC-shareDevices").anchorClass,
"webRTC-shareDevices-notification-icon", "anchored to device icon");
checkDeviceSelectors(false, true);
is(PopupNotifications.panel.firstChild.getAttribute("popupid"),
"webRTC-shareDevices", "panel using devices icon");
let indicator = promiseIndicatorWindow();
yield promiseMessage("ok", () => {
PopupNotifications.panel.firstChild.button.click();
@@ -549,17 +549,17 @@ var gTests = [
yield expectObserverCalled("recording-device-events");
yield indicator;
yield checkSharingUI({video: aRequestVideo, audio: aRequestAudio});
yield promiseNotificationShown(PopupNotifications.getNotification("webRTC-sharingDevices"));
let expectedIcon = "webRTC-sharingDevices";
if (aRequestAudio && !aRequestVideo)
expectedIcon = "webRTC-sharingMicrophone";
- is(PopupNotifications.getNotification("webRTC-sharingDevices").anchorID,
+ is(PopupNotifications.getNotification("webRTC-sharingDevices").anchorClass,
expectedIcon + "-notification-icon", "anchored to correct icon");
is(PopupNotifications.panel.firstChild.getAttribute("popupid"), expectedIcon,
"panel using correct icon");
// Stop sharing.
activateSecondaryAction(kActionDeny);
yield promiseObserverCalled("recording-device-events");
--- a/browser/base/content/test/general/browser_devices_get_user_media_in_frame.js
+++ b/browser/base/content/test/general/browser_devices_get_user_media_in_frame.js
@@ -23,17 +23,17 @@ var gTests = [
{
desc: "getUserMedia audio+video",
run: function checkAudioVideo() {
let promise = promisePopupNotificationShown("webRTC-shareDevices");
yield promiseRequestDevice(true, true, "frame1");
yield promise;
yield expectObserverCalled("getUserMedia:request");
- is(PopupNotifications.getNotification("webRTC-shareDevices").anchorID,
+ is(PopupNotifications.getNotification("webRTC-shareDevices").anchorClass,
"webRTC-shareDevices-notification-icon", "anchored to device icon");
checkDeviceSelectors(true, true);
is(PopupNotifications.panel.firstChild.getAttribute("popupid"),
"webRTC-shareDevices", "panel using devices icon");
let indicator = promiseIndicatorWindow();
yield promiseMessage("ok", () => {
PopupNotifications.panel.firstChild.button.click();
--- a/browser/base/content/test/popupNotifications/browser_popupNotification.js
+++ b/browser/base/content/test/popupNotifications/browser_popupNotification.js
@@ -176,24 +176,24 @@ var tests = [
},
// Test two notifications with different anchors
{ id: "Test#10",
run: function () {
this.notifyObj = new BasicNotification(this.id);
this.firstNotification = showNotification(this.notifyObj);
this.notifyObj2 = new BasicNotification(this.id);
this.notifyObj2.id += "-2";
- this.notifyObj2.anchorID = "addons-notification-icon";
+ this.notifyObj2.anchorClass = "addons-notification-icon";
// Second showNotification() overrides the first
this.secondNotification = showNotification(this.notifyObj2);
},
onShown: function (popup) {
// This also checks that only one element is shown.
checkPopup(popup, this.notifyObj2);
- is(document.getElementById("geo-notification-icon").boxObject.width, 0,
+ is(document.querySelector(".geo-notification-icon").boxObject.width, 0,
"geo anchor shouldn't be visible");
dismissNotification(popup);
},
onHidden: function (popup) {
// Remove the notifications
this.firstNotification.remove();
this.secondNotification.remove();
ok(this.notifyObj.removedCallbackTriggered, "removed callback triggered");
--- a/browser/base/content/test/popupNotifications/browser_popupNotification_2.js
+++ b/browser/base/content/test/popupNotifications/browser_popupNotification_2.js
@@ -30,27 +30,27 @@ var tests = [
ok(this.notifyObj.removedCallbackTriggered, "removed callback triggered");
}
},
// Test that icons appear
{ id: "Test#2",
run: function () {
this.notifyObj = new BasicNotification(this.id);
this.notifyObj.id = "geolocation";
- this.notifyObj.anchorID = "geo-notification-icon";
+ this.notifyObj.anchorClass = "geo-notification-icon";
this.notification = showNotification(this.notifyObj);
},
onShown: function (popup) {
checkPopup(popup, this.notifyObj);
- isnot(document.getElementById("geo-notification-icon").boxObject.width, 0,
+ isnot(document.querySelector(".geo-notification-icon").boxObject.width, 0,
"geo anchor should be visible");
dismissNotification(popup);
},
onHidden: function (popup) {
- let icon = document.getElementById("geo-notification-icon");
+ let icon = document.querySelector(".geo-notification-icon");
isnot(icon.boxObject.width, 0,
"geo anchor should be visible after dismissal");
this.notification.remove();
is(icon.boxObject.width, 0,
"geo anchor should not be visible after removal");
}
},
@@ -148,17 +148,17 @@ var tests = [
PopupNotifications.iconBox.appendChild(this.box);
let button = document.createElement("button");
button.setAttribute("label", "Please click me!");
this.box.appendChild(button);
// The notification should open up on the box
this.notifyObj = new BasicNotification(this.id);
- this.notifyObj.anchorID = this.box.id = "nested-box";
+ this.notifyObj.anchorClass = this.box.className = "nested-box";
this.notifyObj.addOptions({dismissed: true});
this.notification = showNotification(this.notifyObj);
// This test places a normal button in the notification area, which has
// standard GTK styling and dimensions. Due to the clip-path, this button
// gets clipped off, which makes it necessary to synthesize the mouse click
// a little bit downward. To be safe, I adjusted the x-offset with the same
// amount.
@@ -172,22 +172,22 @@ var tests = [
this.notification.remove();
this.box.parentNode.removeChild(this.box);
}
},
// Test that popupnotifications without popups have anchor icons shown
{ id: "Test#7",
run: function* () {
let notifyObj = new BasicNotification(this.id);
- notifyObj.anchorID = "geo-notification-icon";
+ notifyObj.anchorClass = "geo-notification-icon";
notifyObj.addOptions({neverShow: true});
let promiseTopic = promiseTopicObserved("PopupNotifications-updateNotShowing");
showNotification(notifyObj);
yield promiseTopic;
- isnot(document.getElementById("geo-notification-icon").boxObject.width, 0,
+ isnot(document.querySelector(".geo-notification-icon").boxObject.width, 0,
"geo anchor should be visible");
goNext();
}
},
// Test notification "Not Now" menu item
{ id: "Test#8",
run: function () {
this.notifyObj = new BasicNotification(this.id);
--- a/browser/base/content/test/popupNotifications/browser_popupNotification_3.js
+++ b/browser/base/content/test/popupNotifications/browser_popupNotification_3.js
@@ -31,32 +31,32 @@ var tests = [
ok(this.notifyObj.removedCallbackTriggered, "removed callback triggered");
}
},
// Test multiple notification icons are shown
{ id: "Test#2",
run: function () {
this.notifyObj1 = new BasicNotification(this.id);
this.notifyObj1.id += "_1";
- this.notifyObj1.anchorID = "default-notification-icon";
+ this.notifyObj1.anchorClass = "default-notification-icon";
this.notification1 = showNotification(this.notifyObj1);
this.notifyObj2 = new BasicNotification(this.id);
this.notifyObj2.id += "_2";
- this.notifyObj2.anchorID = "geo-notification-icon";
+ this.notifyObj2.anchorClass = "geo-notification-icon";
this.notification2 = showNotification(this.notifyObj2);
},
onShown: function (popup) {
checkPopup(popup, this.notifyObj2);
// check notifyObj1 anchor icon is showing
- isnot(document.getElementById("default-notification-icon").boxObject.width, 0,
+ isnot(document.querySelector(".default-notification-icon").boxObject.width, 0,
"default anchor should be visible");
// check notifyObj2 anchor icon is showing
- isnot(document.getElementById("geo-notification-icon").boxObject.width, 0,
+ isnot(document.querySelector(".geo-notification-icon").boxObject.width, 0,
"geo anchor should be visible");
dismissNotification(popup);
},
onHidden: function (popup) {
this.notification1.remove();
ok(this.notifyObj1.removedCallbackTriggered, "removed callback triggered");
@@ -64,36 +64,36 @@ var tests = [
ok(this.notifyObj2.removedCallbackTriggered, "removed callback triggered");
}
},
// Test that multiple notification icons are removed when switching tabs
{ id: "Test#3",
run: function () {
// show the notification on old tab.
this.notifyObjOld = new BasicNotification(this.id);
- this.notifyObjOld.anchorID = "default-notification-icon";
+ this.notifyObjOld.anchorClass = "default-notification-icon";
this.notificationOld = showNotification(this.notifyObjOld);
// switch tab
this.oldSelectedTab = gBrowser.selectedTab;
gBrowser.selectedTab = gBrowser.addTab("about:blank");
// show the notification on new tab.
this.notifyObjNew = new BasicNotification(this.id);
- this.notifyObjNew.anchorID = "geo-notification-icon";
+ this.notifyObjNew.anchorClass = "geo-notification-icon";
this.notificationNew = showNotification(this.notifyObjNew);
},
onShown: function (popup) {
checkPopup(popup, this.notifyObjNew);
// check notifyObjOld anchor icon is removed
- is(document.getElementById("default-notification-icon").boxObject.width, 0,
+ is(document.querySelector(".default-notification-icon").boxObject.width, 0,
"default anchor shouldn't be visible");
// check notifyObjNew anchor icon is showing
- isnot(document.getElementById("geo-notification-icon").boxObject.width, 0,
+ isnot(document.querySelector(".geo-notification-icon").boxObject.width, 0,
"geo anchor should be visible");
dismissNotification(popup);
},
onHidden: function (popup) {
this.notificationNew.remove();
gBrowser.removeTab(gBrowser.selectedTab);
@@ -198,29 +198,28 @@ var tests = [
{ id: "Test#8",
run: function* () {
yield promiseTabLoadEvent(gBrowser.selectedTab, "http://example.com/");
let originalTab = gBrowser.selectedTab;
let bgTab = gBrowser.addTab("about:blank");
gBrowser.selectedTab = bgTab;
yield promiseTabLoadEvent(gBrowser.selectedTab, "http://example.com/");
let anchor = document.createElement("box");
- anchor.id = "test26-anchor";
- anchor.className = "notification-anchor-icon";
+ anchor.className = "test26-anchor notification-anchor-icon";
PopupNotifications.iconBox.appendChild(anchor);
gBrowser.selectedTab = originalTab;
let fgNotifyObj = new BasicNotification(this.id);
- fgNotifyObj.anchorID = anchor.id;
+ fgNotifyObj.anchorClass = "test26-anchor";
fgNotifyObj.options.dismissed = true;
let fgNotification = showNotification(fgNotifyObj);
let bgNotifyObj = new BasicNotification(this.id);
- bgNotifyObj.anchorID = anchor.id;
+ bgNotifyObj.anchorClass = "test26-anchor";
bgNotifyObj.browser = gBrowser.getBrowserForTab(bgTab);
// show the notification in the background tab ...
let bgNotification = showNotification(bgNotifyObj);
// ... and re-show it
bgNotification = showNotification(bgNotifyObj);
ok(fgNotification.id, "notification has id");
is(fgNotification.id, bgNotification.id, "notification ids are the same");
@@ -239,29 +238,28 @@ var tests = [
this.notifyObj.options.eventCallback = function (eventName) {
if (eventName == "removed") {
ok(false, "Notification removed from browser when subframe navigated");
}
};
showNotification(this.notifyObj);
},
onShown: function (popup) {
- let self = this;
let progressListener = {
- onLocationChange: function onLocationChange() {
+ onLocationChange: () => {
gBrowser.removeProgressListener(progressListener);
- executeSoon(() => {
- let notification = PopupNotifications.getNotification(self.notifyObj.id,
- self.notifyObj.browser);
+ executeSoon(() => {
+ let notification = PopupNotifications.getNotification(this.notifyObj.id,
+ this.notifyObj.browser);
ok(notification != null, "Notification remained when subframe navigated");
- self.notifyObj.options.eventCallback = undefined;
+ this.notifyObj.options.eventCallback = undefined;
notification.remove();
- });
+ });
},
};
info("Adding progress listener and performing navigation");
gBrowser.addProgressListener(progressListener);
content.document.getElementById("iframe")
.setAttribute("src", "http://example.org/");
},
--- a/browser/base/content/test/popupNotifications/browser_popupNotification_4.js
+++ b/browser/base/content/test/popupNotifications/browser_popupNotification_4.js
@@ -41,34 +41,34 @@ var tests = [
ok(this.testNotif.secondaryActionClicked, "secondary action has been triggered");
}
},
// Existing popup notification shouldn't disappear when adding a dismissed notification
{ id: "Test#3",
run: function () {
this.notifyObj1 = new BasicNotification(this.id);
this.notifyObj1.id += "_1";
- this.notifyObj1.anchorID = "default-notification-icon";
+ this.notifyObj1.anchorClass = "default-notification-icon";
this.notification1 = showNotification(this.notifyObj1);
},
onShown: function (popup) {
// Now show a dismissed notification, and check that it doesn't clobber
// the showing one.
this.notifyObj2 = new BasicNotification(this.id);
this.notifyObj2.id += "_2";
- this.notifyObj2.anchorID = "geo-notification-icon";
+ this.notifyObj2.anchorClass = "geo-notification-icon";
this.notifyObj2.options.dismissed = true;
this.notification2 = showNotification(this.notifyObj2);
checkPopup(popup, this.notifyObj1);
// check that both anchor icons are showing
- is(document.getElementById("default-notification-icon").getAttribute("showing"), "true",
+ is(document.querySelector(".default-notification-icon").getAttribute("showing"), "true",
"notification1 anchor should be visible");
- is(document.getElementById("geo-notification-icon").getAttribute("showing"), "true",
+ is(document.querySelector(".geo-notification-icon").getAttribute("showing"), "true",
"notification2 anchor should be visible");
dismissNotification(popup);
},
onHidden: function(popup) {
this.notification1.remove();
this.notification2.remove();
}
@@ -99,17 +99,17 @@ var tests = [
{ id: "Test#5",
run: function() {
gBrowser.selectedTab = gBrowser.addTab("about:blank");
let notifyObj = new BasicNotification(this.id);
showNotification(notifyObj);
let win = gBrowser.replaceTabWithWindow(gBrowser.selectedTab);
whenDelayedStartupFinished(win, function() {
let [tab] = win.gBrowser.tabs;
- let anchor = win.document.getElementById("default-notification-icon");
+ let anchor = win.document.querySelector(".default-notification-icon");
win.PopupNotifications._reshowNotifications(anchor);
ok(win.PopupNotifications.panel.childNodes.length == 0,
"no notification displayed in new window");
ok(notifyObj.swappingCallbackTriggered, "the swapping callback was triggered");
ok(notifyObj.removedCallbackTriggered, "the removed callback was triggered");
win.close();
goNext();
});
@@ -125,17 +125,17 @@ var tests = [
originalCallback(eventName);
return eventName == "swapping";
};
showNotification(notifyObj);
let win = gBrowser.replaceTabWithWindow(gBrowser.selectedTab);
whenDelayedStartupFinished(win, function() {
let [tab] = win.gBrowser.tabs;
- let anchor = win.document.getElementById("default-notification-icon");
+ let anchor = win.document.querySelector(".default-notification-icon");
win.PopupNotifications._reshowNotifications(anchor);
checkPopup(win.PopupNotifications.panel, notifyObj);
ok(notifyObj.swappingCallbackTriggered, "the swapping callback was triggered");
win.close();
goNext();
});
}
},
@@ -230,23 +230,23 @@ var tests = [
},
onHidden: function() { }
},
// A first dismissed notification shouldn't stop _update from showing a second notification
{ id: "Test#12",
run: function () {
this.notifyObj1 = new BasicNotification(this.id);
this.notifyObj1.id += "_1";
- this.notifyObj1.anchorID = "default-notification-icon";
+ this.notifyObj1.anchorClass = "default-notification-icon";
this.notifyObj1.options.dismissed = true;
this.notification1 = showNotification(this.notifyObj1);
this.notifyObj2 = new BasicNotification(this.id);
this.notifyObj2.id += "_2";
- this.notifyObj2.anchorID = "geo-notification-icon";
+ this.notifyObj2.anchorClass = "geo-notification-icon";
this.notifyObj2.options.dismissed = true;
this.notification2 = showNotification(this.notifyObj2);
this.notification2.dismissed = false;
PopupNotifications._update();
},
onShown: function (popup) {
checkPopup(popup, this.notifyObj2);
@@ -258,16 +258,16 @@ var tests = [
// The anchor icon should be shown for notifications in background windows.
{ id: "Test#13",
run: function() {
let notifyObj = new BasicNotification(this.id);
notifyObj.options.dismissed = true;
let win = gBrowser.replaceTabWithWindow(gBrowser.addTab("about:blank"));
whenDelayedStartupFinished(win, function() {
showNotification(notifyObj);
- let anchor = document.getElementById("default-notification-icon");
+ let anchor = document.querySelector(".default-notification-icon");
is(anchor.getAttribute("showing"), "true", "the anchor is shown");
win.close();
goNext();
});
}
}
];
--- a/browser/base/content/test/popupNotifications/head.js
+++ b/browser/base/content/test/popupNotifications/head.js
@@ -106,32 +106,32 @@ function* runNextTest() {
yield nextTest.run();
}
function showNotification(notifyObj) {
info("Showing notification " + notifyObj.id);
return PopupNotifications.show(notifyObj.browser,
notifyObj.id,
notifyObj.message,
- notifyObj.anchorID,
+ notifyObj.anchorClass,
notifyObj.mainAction,
notifyObj.secondaryActions,
notifyObj.options);
}
function dismissNotification(popup) {
info("Dismissing notification " + popup.childNodes[0].id);
executeSoon(() => EventUtils.synthesizeKey("VK_ESCAPE", {}));
}
function BasicNotification(testId) {
this.browser = gBrowser.selectedBrowser;
this.id = "test-notification-" + testId;
this.message = "This is popup notification for " + testId;
- this.anchorID = null;
+ this.anchorClass = "default-notification-icon";
this.mainAction = {
label: "Main Action",
accessKey: "M",
callback: () => this.mainActionClicked = true
};
this.secondaryActions = [
{
label: "Secondary Action",
@@ -191,17 +191,17 @@ function checkPopup(popup, notifyObj) {
is(notifications.length, 1, "one notification displayed");
let notification = notifications[0];
if (!notification)
return;
let icon = document.getAnonymousElementByAttribute(notification, "class",
"popup-notification-icon");
if (notifyObj.id == "geolocation") {
isnot(icon.boxObject.width, 0, "icon for geo displayed");
- is(popup.anchorNode.className, "notification-anchor-icon",
+ is(popup.anchorNode.className, "geo-notification-icon notification-anchor-icon",
"notification anchored to icon");
}
is(notification.getAttribute("label"), notifyObj.message, "message matches");
is(notification.id, notifyObj.id + "-notification", "id matches");
if (notifyObj.mainAction) {
is(notification.getAttribute("buttonlabel"), notifyObj.mainAction.label,
"main action label matches");
is(notification.getAttribute("buttonaccesskey"),
--- a/browser/components/nsBrowserGlue.js
+++ b/browser/components/nsBrowserGlue.js
@@ -2462,21 +2462,21 @@ ContentPermissionPrompt.prototype = {
* @param aRequest The permission request.
* @param aMessage The message to display on the prompt.
* @param aPermission The type of permission to prompt.
* @param aActions An array of actions of the form:
* [main action, secondary actions, ...]
* Actions are of the form { stringId, action, expireType, callback }
* Permission is granted if action is null or ALLOW_ACTION.
* @param aNotificationId The id of the PopupNotification.
- * @param aAnchorId The id for the PopupNotification anchor.
+ * @param aAnchorClass The classname for the PopupNotification anchor.
* @param aOptions Options for the PopupNotification
*/
_showPrompt: function CPP_showPrompt(aRequest, aMessage, aPermission, aActions,
- aNotificationId, aAnchorId, aOptions) {
+ aNotificationId, aAnchorClass, aOptions) {
var browser = this._getBrowserForRequest(aRequest);
var chromeWin = browser.ownerDocument.defaultView;
var requestPrincipal = aRequest.principal;
// Transform the prompt actions into PopupNotification actions.
var popupNotificationActions = [];
for (var i = 0; i < aActions.length; i++) {
let promptAction = aActions[i];
@@ -2524,17 +2524,17 @@ ContentPermissionPrompt.prototype = {
aRequest.cancel();
return undefined;
}
if (!aOptions)
aOptions = {};
aOptions.displayURI = requestPrincipal.URI;
- return chromeWin.PopupNotifications.show(browser, aNotificationId, aMessage, aAnchorId,
+ return chromeWin.PopupNotifications.show(browser, aNotificationId, aMessage, aAnchorClass,
mainAction, secondaryActions, aOptions);
},
_promptGeo : function(aRequest) {
var secHistogram = Services.telemetry.getHistogramById("SECURITY_UI");
var message;
--- a/browser/modules/webrtcUI.jsm
+++ b/browser/modules/webrtcUI.jsm
@@ -583,24 +583,24 @@ function prompt(aBrowser, aRequest) {
mm.sendAsyncMessage("webrtc:Allow", {callID: aRequest.callID,
windowID: aRequest.windowID,
devices: allowedDevices});
};
return false;
}
};
- let anchorId = "webRTC-shareDevices-notification-icon";
+ let anchorClass = "webRTC-shareDevices-notification-icon";
if (requestTypes.length == 1 && requestTypes[0] == "Microphone")
- anchorId = "webRTC-shareMicrophone-notification-icon";
+ anchorClass = "webRTC-shareMicrophone-notification-icon";
if (requestTypes.indexOf("Screen") != -1)
- anchorId = "webRTC-shareScreen-notification-icon";
+ anchorClass = "webRTC-shareScreen-notification-icon";
notification =
chromeWin.PopupNotifications.show(aBrowser, "webRTC-shareDevices", message,
- anchorId, mainAction, secondaryActions,
+ anchorClass, mainAction, secondaryActions,
options);
notification.callID = aRequest.callID;
}
function removePrompt(aBrowser, aCallId) {
let chromeWin = aBrowser.ownerDocument.defaultView;
let notification =
chromeWin.PopupNotifications.getNotification("webRTC-shareDevices", aBrowser);
@@ -937,22 +937,25 @@ function updateBrowserSpecificIndicator(
webrtcUI.swapBrowserForNotification(this.browser, aNewBrowser);
return true;
}
return false;
}
};
if (captureState) {
- let anchorId = captureState == "Microphone" ? "webRTC-sharingMicrophone-notification-icon"
- : "webRTC-sharingDevices-notification-icon";
+ let anchorClass = "webRTC-sharingDevices-notification-icon";
+ if (captureState == "Microphone") {
+ anchorClass = "webRTC-sharingMicrophone-notification-icon";
+ }
+
let message = stringBundle.getString("getUserMedia.sharing" + captureState + ".message2");
notification =
chromeWin.PopupNotifications.show(aBrowser, "webRTC-sharingDevices", message,
- anchorId, mainAction, secondaryActions, options);
+ anchorClass, mainAction, secondaryActions, options);
}
else {
removeBrowserNotification(aBrowser, "webRTC-sharingDevices");
aBrowser._devicePermissionURIs = null;
}
// Now handle the screen sharing indicator.
if (!aState.screen) {
--- a/browser/themes/linux/browser.css
+++ b/browser/themes/linux/browser.css
@@ -1012,18 +1012,17 @@ menuitem:not([type]):not(.menuitem-toolt
#notification-popup-box {
border-radius: 2.5px 0 0 2.5px;
}
.notification-anchor-icon:-moz-focusring {
outline: 1px dotted -moz-DialogText;
}
-.indexedDB-notification-icon,
-#indexedDB-notification-icon {
+.indexedDB-notification-icon {
list-style-image: url(moz-icon://stock/gtk-dialog-question?size=16);
}
/* Translation infobar */
%include ../shared/translation/infobar.inc.css
notification[value="translation"] {
--- a/browser/themes/osx/browser.css
+++ b/browser/themes/osx/browser.css
@@ -3007,20 +3007,16 @@ menuitem:hover > hbox > .alltabs-endimag
border-radius: 2px 0 0 2px;
}
.notification-anchor-icon:-moz-focusring {
box-shadow: 0 0 2px 1px -moz-mac-focusring inset,
0 0 3px 2px -moz-mac-focusring;
}
-#social-notification-icon > .toolbarbutton-icon {
- height: 16px;
-}
-
/* Translation */
%include ../shared/translation/infobar.inc.css
notification[value="translation"] {
color: #484848;
background-color: #EFEFEF;
background-image: none;
--- a/browser/themes/shared/notification-icons.inc.css
+++ b/browser/themes/shared/notification-icons.inc.css
@@ -117,174 +117,159 @@
%else
list-style-image: url(chrome://global/skin/icons/information-16.png);
%endif
width: 16px;
height: 16px;
margin: 0 2px;
}
-.geo-notification-icon,
-#geo-notification-icon {
+.geo-notification-icon {
list-style-image: url(chrome://browser/skin/Geolocation-16.png);
}
-#addons-notification-icon {
+.addons-notification-icon {
list-style-image: url(chrome://browser/skin/addons/addon-install-anchor.svg#default);
}
-#addons-notification-icon:hover {
+.addons-notification-icon:hover {
list-style-image: url(chrome://browser/skin/addons/addon-install-anchor.svg#hover);
}
-#addons-notification-icon:hover:active {
+.addons-notification-icon:hover:active {
list-style-image: url(chrome://browser/skin/addons/addon-install-anchor.svg#active);
}
-.indexedDB-notification-icon,
-#indexedDB-notification-icon {
+.indexedDB-notification-icon {
list-style-image: url(chrome://global/skin/icons/question-16.png);
}
-#password-notification-icon {
+.password-notification-icon {
list-style-image: url(chrome://mozapps/skin/passwordmgr/key-16.png);
}
-#login-fill-notification-icon {
+.login-fill-notification-icon {
/* Temporary icon until the capture and fill doorhangers are unified. */
list-style-image: url(chrome://mozapps/skin/passwordmgr/key-16.png);
transform: scaleX(-1);
}
-#plugins-notification-icon {
+.plugins-notification-icon {
list-style-image: url(chrome://browser/skin/notification-pluginNormal.png);
}
-#plugins-notification-icon.plugin-hidden {
+.plugins-notification-icon.plugin-hidden {
list-style-image: url(chrome://browser/skin/notification-pluginAlert.png);
}
-#plugins-notification-icon.plugin-blocked {
+.plugins-notification-icon.plugin-blocked {
list-style-image: url(chrome://browser/skin/notification-pluginBlocked.png);
}
-#plugins-notification-icon {
+.plugins-notification-icon {
-moz-image-region: rect(0, 16px, 16px, 0);
}
-#plugins-notification-icon:hover {
+.plugins-notification-icon:hover {
-moz-image-region: rect(0, 32px, 16px, 16px);
}
-#plugins-notification-icon:active {
+.plugins-notification-icon:active {
-moz-image-region: rect(0, 48px, 16px, 32px);
}
-#notification-popup-box[hidden] {
+.notification-popup-box[hidden] {
/* Override display:none to make the pluginBlockedNotification animation work
when showing the notification repeatedly. */
display: -moz-box;
visibility: collapse;
}
-#plugins-notification-icon.plugin-blocked[showing] {
+.plugins-notification-icon.plugin-blocked[showing] {
animation: pluginBlockedNotification 500ms ease 0s 5 alternate both;
}
@keyframes pluginBlockedNotification {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
-.webRTC-shareDevices-notification-icon,
-#webRTC-shareDevices-notification-icon {
+.webRTC-shareDevices-notification-icon {
list-style-image: url(chrome://browser/skin/webRTC-shareDevice-16.png);
}
-.webRTC-sharingDevices-notification-icon,
-#webRTC-sharingDevices-notification-icon {
+.webRTC-sharingDevices-notification-icon {
list-style-image: url(chrome://browser/skin/webRTC-sharingDevice-16.png);
}
-.webRTC-shareMicrophone-notification-icon,
-#webRTC-shareMicrophone-notification-icon {
+.webRTC-shareMicrophone-notification-icon {
list-style-image: url(chrome://browser/skin/webRTC-shareMicrophone-16.png);
}
-.webRTC-sharingMicrophone-notification-icon,
-#webRTC-sharingMicrophone-notification-icon {
+.webRTC-sharingMicrophone-notification-icon {
list-style-image: url(chrome://browser/skin/webRTC-sharingMicrophone-16.png);
}
-.webRTC-shareScreen-notification-icon,
-#webRTC-shareScreen-notification-icon {
+.webRTC-shareScreen-notification-icon {
list-style-image: url(chrome://browser/skin/webRTC-shareScreen-16.png);
}
-.webRTC-sharingScreen-notification-icon,
-#webRTC-sharingScreen-notification-icon {
+.webRTC-sharingScreen-notification-icon {
list-style-image: url(chrome://browser/skin/webRTC-sharingScreen-16.png);
}
-.web-notifications-notification-icon,
-#web-notifications-notification-icon {
+.web-notifications-notification-icon {
list-style-image: url(chrome://browser/skin/web-notifications-tray.svg);
-moz-image-region: rect(0, 16px, 16px, 0);
}
-.web-notifications-notification-icon:hover,
-#web-notifications-notification-icon:hover {
+.web-notifications-notification-icon:hover {
-moz-image-region: rect(0, 32px, 16px, 16px);
}
-.web-notifications-notification-icon:hover:active,
-#web-notifications-notification-icon:hover:active {
+.web-notifications-notification-icon:hover:active {
-moz-image-region: rect(0, 48px, 16px, 32px);
}
-.pointerLock-notification-icon,
-#pointerLock-notification-icon {
+.pointerLock-notification-icon {
list-style-image: url(chrome://browser/skin/pointerLock-16.png);
}
-.translate-notification-icon,
-#translate-notification-icon {
+.translate-notification-icon {
list-style-image: url(chrome://browser/skin/translation-16.png);
-moz-image-region: rect(0px, 16px, 16px, 0px);
}
-.translated-notification-icon,
-#translated-notification-icon {
+.translated-notification-icon {
list-style-image: url(chrome://browser/skin/translation-16.png);
-moz-image-region: rect(0px, 32px, 16px, 16px);
}
.popup-notification-icon[popupid="servicesInstall"] {
list-style-image: url(chrome://browser/skin/social/services-64.png);
}
-#servicesInstall-notification-icon {
+.servicesInstall-notification-icon {
list-style-image: url(chrome://browser/skin/social/services-16.png);
}
/* EME notifications */
-.popup-notification-icon[popupid="drmContentPlaying"],
-#eme-notification-icon {
+.eme-notification-icon {
list-style-image: url("chrome://browser/skin/drm-icon.svg#chains");
}
-#eme-notification-icon:hover:active {
+.eme-notification-icon:hover:active {
list-style-image: url("chrome://browser/skin/drm-icon.svg#chains-pressed");
}
-#eme-notification-icon[firstplay=true] {
+.eme-notification-icon[firstplay=true] {
animation: emeTeachingMoment 0.2s linear 0s 5 normal;
}
@keyframes emeTeachingMoment {
0% {transform: translateX(0); }
25% {transform: translateX(3px) }
75% {transform: translateX(-3px) }
100% { transform: translateX(0); }
@@ -299,43 +284,37 @@
.notification-anchor-icon {
%ifdef MOZ_WIDGET_GTK
list-style-image: url(moz-icon://stock/gtk-dialog-info?size=dialog);
%else
list-style-image: url(chrome://global/skin/icons/information-32.png);
%endif
}
- .webRTC-shareDevices-notification-icon,
- #webRTC-shareDevices-notification-icon {
+ .webRTC-shareDevices-notification-icon {
list-style-image: url(chrome://browser/skin/webRTC-shareDevice-16@2x.png);
}
- .webRTC-sharingDevices-notification-icon,
- #webRTC-sharingDevices-notification-icon {
+ .webRTC-sharingDevices-notification-icon {
list-style-image: url(chrome://browser/skin/webRTC-sharingDevice-16@2x.png);
}
- .webRTC-shareMicrophone-notification-icon,
- #webRTC-shareMicrophone-notification-icon {
+ .webRTC-shareMicrophone-notification-icon {
list-style-image: url(chrome://browser/skin/webRTC-shareMicrophone-16@2x.png);
}
- .webRTC-sharingMicrophone-notification-icon,
- #webRTC-sharingMicrophone-notification-icon {
+ .webRTC-sharingMicrophone-notification-icon {
list-style-image: url(chrome://browser/skin/webRTC-sharingMicrophone-16@2x.png);
}
- .webRTC-shareScreen-notification-icon,
- #webRTC-shareScreen-notification-icon {
+ .webRTC-shareScreen-notification-icon {
list-style-image: url(chrome://browser/skin/webRTC-shareScreen-16@2x.png);
}
- .webRTC-sharingScreen-notification-icon,
- #webRTC-sharingScreen-notification-icon {
+ .webRTC-sharingScreen-notification-icon {
list-style-image: url(chrome://browser/skin/webRTC-sharingScreen-16@2x.png);
}
.popup-notification-icon[popupid="webRTC-sharingDevices"],
.popup-notification-icon[popupid="webRTC-shareDevices"] {
list-style-image: url(chrome://browser/skin/webRTC-shareDevice-64@2x.png);
}
@@ -346,81 +325,75 @@
.popup-notification-icon[popupid="webRTC-sharingScreen"],
.popup-notification-icon[popupid="webRTC-shareScreen"] {
list-style-image: url(chrome://browser/skin/webRTC-shareScreen-64@2x.png);
}
%ifdef XP_MACOSX
/* OSX only until we have icons for Windows and Linux */
- .geo-notification-icon,
- #geo-notification-icon {
+ .geo-notification-icon {
list-style-image: url(chrome://browser/skin/Geolocation-16@2x.png);
}
- .indexedDB-notification-icon,
- #indexedDB-notification-icon {
+ .indexedDB-notification-icon {
list-style-image: url(chrome://global/skin/icons/question-32.png);
}
- #login-fill-notification-icon,
- #password-notification-icon {
+ .password-notification-icon {
list-style-image: url(chrome://mozapps/skin/passwordmgr/key-16@2x.png);
}
- #plugins-notification-icon {
+ .plugins-notification-icon {
list-style-image: url(chrome://browser/skin/notification-pluginNormal@2x.png);
}
- #plugins-notification-icon.plugin-hidden {
+ .plugins-notification-icon.plugin-hidden {
list-style-image: url(chrome://browser/skin/notification-pluginAlert@2x.png);
}
- #plugins-notification-icon.plugin-blocked {
+ .plugins-notification-icon.plugin-blocked {
list-style-image: url(chrome://browser/skin/notification-pluginBlocked@2x.png);
}
- #plugins-notification-icon {
+ .plugins-notification-icon {
-moz-image-region: rect(0, 32px, 32px, 0);
}
- #plugins-notification-icon:hover {
+ .plugins-notification-icon:hover {
-moz-image-region: rect(0, 64px, 32px, 32px);
}
- #plugins-notification-icon:active {
+ .plugins-notification-icon:active {
-moz-image-region: rect(0, 96px, 32px, 64px);
}
- .pointerLock-notification-icon,
- #pointerLock-notification-icon {
+ .pointerLock-notification-icon {
list-style-image: url(chrome://browser/skin/pointerLock-16@2x.png);
}
- .translate-notification-icon,
- #translate-notification-icon {
+ .translate-notification-icon {
list-style-image: url(chrome://browser/skin/translation-16@2x.png);
-moz-image-region: rect(0px, 32px, 32px, 0px);
}
- .translated-notification-icon,
- #translated-notification-icon {
+ .translated-notification-icon {
list-style-image: url(chrome://browser/skin/translation-16@2x.png);
-moz-image-region: rect(0px, 64px, 32px, 32px);
}
.popup-notification-icon[popupid="geolocation"] {
list-style-image: url(chrome://browser/skin/Geolocation-64@2x.png);
}
.popup-notification-icon[popupid="pointerLock"] {
list-style-image: url(chrome://browser/skin/pointerLock-64@2x.png);
}
.popup-notification-icon[popupid="servicesInstall"] {
list-style-image: url(chrome://browser/skin/social/services-64@2x.png);
}
- #servicesInstall-notification-icon {
+ .servicesInstall-notification-icon {
list-style-image: url(chrome://browser/skin/social/services-16@2x.png);
}
%endif
}
--- a/toolkit/components/passwordmgr/test/browser/browser_filldoorhanger.js
+++ b/toolkit/components/passwordmgr/test/browser/browser_filldoorhanger.js
@@ -20,17 +20,17 @@ add_task(function* test_fill() {
formSubmitURL: "https://example.com",
username: "username",
password: "password",
}));
// The anchor icon may be shown during the initial page load in the new tab,
// so we have to set up the observers first. When we receive the notification
// from PopupNotifications.jsm, we check it is the one for the right anchor.
- let anchor = document.getElementById("login-fill-notification-icon");
+ let anchor = document.querySelector(".login-fill-notification-icon");
let promiseAnchorShown =
TestUtils.topicObserved("PopupNotifications-updateNotShowing",
() => anchor.hasAttribute("showing"));
yield BrowserTestUtils.withNewTab({
gBrowser,
url: "https://example.com/browser/toolkit/components/" +
"passwordmgr/test/browser/form_basic.html",
--- a/toolkit/modules/PopupNotifications.jsm
+++ b/toolkit/modules/PopupNotifications.jsm
@@ -35,18 +35,18 @@ const TELEMETRY_STAT_DISMISSAL_NOT_NOW =
const TELEMETRY_STAT_OPEN_SUBMENU = 10;
const TELEMETRY_STAT_LEARN_MORE = 11;
const TELEMETRY_STAT_REOPENED_OFFSET = 20;
var popupNotificationsMap = new WeakMap();
var gNotificationParents = new WeakMap;
-function getAnchorFromBrowser(aBrowser, aAnchorID) {
- let attrPrefix = aAnchorID ? aAnchorID.replace("notification-icon", "") : "";
+function getAnchorFromBrowser(aBrowser, aAnchorClass) {
+ let attrPrefix = aAnchorClass ? aAnchorClass.replace("notification-icon", "") : "";
let anchor = aBrowser.getAttribute(attrPrefix + ICON_ANCHOR_ATTRIBUTE) ||
aBrowser[attrPrefix + ICON_ANCHOR_ATTRIBUTE] ||
aBrowser.getAttribute(ICON_ANCHOR_ATTRIBUTE) ||
aBrowser[ICON_ANCHOR_ATTRIBUTE];
if (anchor) {
if (anchor instanceof Ci.nsIDOMXULElement) {
return anchor;
}
@@ -55,21 +55,21 @@ function getAnchorFromBrowser(aBrowser,
return null;
}
/**
* Notification object describes a single popup notification.
*
* @see PopupNotifications.show()
*/
-function Notification(id, message, anchorID, mainAction, secondaryActions,
+function Notification(id, message, anchorClass, mainAction, secondaryActions,
browser, owner, options) {
this.id = id;
this.message = message;
- this.anchorID = anchorID;
+ this.anchorClass = anchorClass;
this.mainAction = mainAction;
this.secondaryActions = secondaryActions || [];
this.browser = browser;
this.owner = owner;
this.options = options || {};
this._dismissed = false;
this.wasDismissed = false;
@@ -78,17 +78,17 @@ function Notification(id, message, ancho
this.browser.ownerDocument.defaultView);
this.timeCreated = this.owner.window.performance.now();
}
Notification.prototype = {
id: null,
message: null,
- anchorID: null,
+ anchorClass: null,
mainAction: null,
secondaryActions: null,
browser: null,
owner: null,
options: null,
timeShown: null,
/**
@@ -110,26 +110,26 @@ Notification.prototype = {
*/
remove: function Notification_remove() {
this.owner.remove(this);
},
get anchorElement() {
let iconBox = this.owner.iconBox;
- let anchorElement = getAnchorFromBrowser(this.browser, this.anchorID);
+ let anchorElement = getAnchorFromBrowser(this.browser, this.anchorClass);
if (!iconBox)
return anchorElement;
- if (!anchorElement && this.anchorID)
- anchorElement = iconBox.querySelector("#"+this.anchorID);
+ if (!anchorElement && this.anchorClass)
+ anchorElement = iconBox.querySelector("." + this.anchorClass);
// Use a default anchor icon if it's available
if (!anchorElement)
- anchorElement = iconBox.querySelector("#default-notification-icon") ||
+ anchorElement = iconBox.querySelector(".default-notification-icon") ||
iconBox;
return anchorElement;
},
reshow: function() {
this.owner._reshowNotifications(this.anchorElement, this.browser);
},
@@ -259,18 +259,18 @@ PopupNotifications.prototype = {
* be null.
* @param id
* A unique ID that identifies the type of notification (e.g.
* "geolocation"). Only one notification with a given ID can be visible
* at a time. If a notification already exists with the given ID, it
* will be replaced.
* @param message
* The text to be displayed in the notification.
- * @param anchorID
- * The ID of the element that should be used as this notification
+ * @param anchorClass
+ * The class of the element in the iconbox that should be used as this notification
* popup's anchor. May be null, in which case the notification will be
* anchored to the iconBox.
* @param mainAction
* A JavaScript object literal describing the notification button's
* action. If present, it must have the following properties:
* - label (string): the button's label.
* - accessKey (string): the button's accessKey.
* - callback (function): a callback to be invoked when the button is
@@ -347,17 +347,17 @@ PopupNotifications.prototype = {
* opens the URL in a new tab.
* displayURI:
* The nsIURI of the page the notification came
* from. If present, this will be displayed above the message.
* If the nsIURI represents a file, the path will be displayed,
* otherwise the hostPort will be displayed.
* @returns the Notification object corresponding to the added notification.
*/
- show: function PopupNotifications_show(browser, id, message, anchorID,
+ show: function PopupNotifications_show(browser, id, message, anchorClass,
mainAction, secondaryActions, options) {
function isInvalidAction(a) {
return !a || !(typeof(a.callback) == "function") || !a.label || !a.accessKey;
}
if (!browser)
throw "PopupNotifications_show: invalid browser";
if (!id)
@@ -366,17 +366,17 @@ PopupNotifications.prototype = {
throw "PopupNotifications_show: invalid mainAction";
if (secondaryActions && secondaryActions.some(isInvalidAction))
throw "PopupNotifications_show: invalid secondaryActions";
if (options && options.hideNotNow &&
(!secondaryActions || !secondaryActions.length ||
!secondaryActions.concat(mainAction).some(action => action.dismiss)))
throw "PopupNotifications_show: 'Not Now' item hidden without replacement";
- let notification = new Notification(id, message, anchorID, mainAction,
+ let notification = new Notification(id, message, anchorClass, mainAction,
secondaryActions, browser, this, options);
if (options && options.dismissed)
notification.dismissed = true;
let existingNotification = this.getNotification(id, browser);
if (existingNotification)
this._remove(existingNotification);
@@ -867,35 +867,36 @@ PopupNotifications.prototype = {
}
}
},
_updateAnchorIcons: function PopupNotifications_updateAnchorIcons(notifications,
anchorElements) {
for (let anchorElement of anchorElements) {
anchorElement.setAttribute(ICON_ATTRIBUTE_SHOWING, "true");
- // Use the anchorID as a class along with the default icon class as a
- // fallback if anchorID is not defined in CSS. We always use the first
+ // Use the anchorClass as a class along with the default icon class as a
+ // fallback. We always use the first
// notifications icon, so in the case of multiple notifications we'll
// only use the default icon.
- if (anchorElement.classList.contains("notification-anchor-icon")) {
+ if (anchorElement.classList.contains("notification-anchor-icon") &&
+ anchorElement.classList.contains("default-notification-icon")) {
// remove previous icon classes
- let className = anchorElement.className.replace(/([-\w]+-notification-icon\s?)/g,"")
+ let className = anchorElement.className.replace(/([-\w]+-notification-icon\s?)/g, "");
if (notifications.length > 0) {
// Find the first notification this anchor used for.
let notification = notifications[0];
for (let n of notifications) {
if (n.anchorElement == anchorElement) {
notification = n;
break;
}
}
// With this notification we can better approximate the most fitting
// style.
- className = notification.anchorID + " " + className;
+ className = notification.anchorClass + " " + className;
}
anchorElement.className = className;
}
}
},
_showIcons: function PopupNotifications_showIcons(aCurrentNotifications) {
for (let notification of aCurrentNotifications) {