Bug 1403680 - Screenshot configurations should supply a relative CSS selector. r=jaws

Each configuration now has the selectors property, an array of strings containing it's css selectors.
These selectors will be used to implement the automated cropping feature.

MozReview-Commit-ID: GNqNiFhwIRk

--HG--
extra : rebase_source : 4a3954f9f28ae3e689ed6f085e818e08b3b3ae56

browser/tools/mozscreenshots/mozscreenshots/extension/configurations/AppMenu.jsm

@@ -16,6 +16,7 @@ this.AppMenu = {
 
   configurations: {
     appMenuClosed: {
+      selectors: ["#appMenu-popup"],
       async applyConfig() {
         let browserWindow = Services.wm.getMostRecentWindow("navigator:browser");
         browserWindow.PanelUI.hide();
@@ -23,6 +24,7 @@ this.AppMenu = {
     },
 
     appMenuMainView: {
+      selectors: ["#appMenu-popup"],
       applyConfig() {
         let browserWindow = Services.wm.getMostRecentWindow("navigator:browser");
         let promise = browserWindow.PanelUI.show();
@@ -32,6 +34,7 @@ this.AppMenu = {
     },
 
     appMenuHistorySubview: {
+      selectors: ["#appMenu-popup"],
       applyConfig() {
         // History has a footer
         if (isCustomizing()) {
@@ -49,6 +52,7 @@ this.AppMenu = {
     },
 
     appMenuHelpSubview: {
+      selectors: ["#appMenu-popup"],
       applyConfig() {
         if (isCustomizing()) {
           return Promise.reject("Can't show subviews while customizing");

browser/tools/mozscreenshots/mozscreenshots/extension/configurations/Buttons.jsm

@@ -19,20 +19,23 @@ this.Buttons = {
 
   configurations: {
     navBarButtons: {
+      selectors: ["#nav-bar"],
       applyConfig: async () => {
         CustomizableUI.addWidgetToArea("screenshot-widget", CustomizableUI.AREA_NAVBAR);
       },
     },
 
     tabsToolbarButtons: {
+      selectors: ["#TabsToolbar"],
       applyConfig: async () => {
         CustomizableUI.addWidgetToArea("screenshot-widget", CustomizableUI.AREA_TABSTRIP);
       },
     },
 
     menuPanelButtons: {
+      selectors: ["#widget-overflow"],
       applyConfig: async () => {
-        CustomizableUI.addWidgetToArea("screenshot-widget", CustomizableUI.AREA_PANEL);
+        CustomizableUI.addWidgetToArea("screenshot-widget", CustomizableUI.AREA_FIXED_OVERFLOW_PANEL);
       },
 
       verifyConfig() {
@@ -45,6 +48,7 @@ this.Buttons = {
     },
 
     custPaletteButtons: {
+      selectors: ["#customization-palette"],
       applyConfig: async () => {
         CustomizableUI.removeWidgetFromArea("screenshot-widget");
       },

browser/tools/mozscreenshots/mozscreenshots/extension/configurations/ControlCenter.jsm

@@ -31,6 +31,7 @@ this.ControlCenter = {
 
   configurations: {
     about: {
+      selectors: ["#identity-popup"],
       async applyConfig() {
         await loadPage("about:home");
         await openIdentityPopup();
@@ -38,6 +39,7 @@ this.ControlCenter = {
     },
 
     localFile: {
+      selectors: ["#identity-popup"],
       async applyConfig() {
         let channel = NetUtil.newChannel({
             uri: "chrome://mozscreenshots/content/lib/mozscreenshots.html",
@@ -57,6 +59,7 @@ this.ControlCenter = {
     },
 
     http: {
+      selectors: ["#identity-popup"],
       async applyConfig() {
         await loadPage(HTTP_PAGE);
         await openIdentityPopup();
@@ -64,6 +67,7 @@ this.ControlCenter = {
     },
 
     httpSubView: {
+      selectors: ["#identity-popup"],
       async applyConfig() {
         await loadPage(HTTP_PAGE);
         await openIdentityPopup(true);
@@ -71,6 +75,7 @@ this.ControlCenter = {
     },
 
     https: {
+      selectors: ["#identity-popup"],
       async applyConfig() {
         await loadPage(HTTPS_PAGE);
         await openIdentityPopup();
@@ -78,6 +83,7 @@ this.ControlCenter = {
     },
 
     httpsSubView: {
+      selectors: ["#identity-popup"],
       async applyConfig() {
         await loadPage(HTTPS_PAGE);
         await openIdentityPopup(true);
@@ -85,6 +91,7 @@ this.ControlCenter = {
     },
 
     singlePermission: {
+      selectors: ["#identity-popup"],
       async applyConfig() {
         let uri = Services.io.newURI(PERMISSIONS_PAGE);
         SitePermissions.set(uri, "camera", SitePermissions.ALLOW);
@@ -95,6 +102,7 @@ this.ControlCenter = {
     },
 
     allPermissions: {
+      selectors: ["#identity-popup"],
       async applyConfig() {
         // TODO: (Bug 1330601) Rewrite this to consider temporary (TAB) permission states.
         // There are 2 possible non-default permission states, so we alternate between them.
@@ -110,6 +118,7 @@ this.ControlCenter = {
     },
 
     mixed: {
+      selectors: ["#identity-popup"],
       async applyConfig() {
         await loadPage(MIXED_CONTENT_URL);
         await openIdentityPopup();
@@ -117,6 +126,7 @@ this.ControlCenter = {
     },
 
     mixedSubView: {
+      selectors: ["#identity-popup"],
       async applyConfig() {
         await loadPage(MIXED_CONTENT_URL);
         await openIdentityPopup(true);
@@ -124,6 +134,7 @@ this.ControlCenter = {
     },
 
     mixedPassive: {
+      selectors: ["#identity-popup"],
       async applyConfig() {
         await loadPage(MIXED_PASSIVE_CONTENT_URL);
         await openIdentityPopup();
@@ -131,6 +142,7 @@ this.ControlCenter = {
     },
 
     mixedPassiveSubView: {
+      selectors: ["#identity-popup"],
       async applyConfig() {
         await loadPage(MIXED_PASSIVE_CONTENT_URL);
         await openIdentityPopup(true);
@@ -138,6 +150,7 @@ this.ControlCenter = {
     },
 
     mixedActive: {
+      selectors: ["#identity-popup"],
       async applyConfig() {
         await loadPage(MIXED_ACTIVE_CONTENT_URL);
         await openIdentityPopup();
@@ -145,6 +158,7 @@ this.ControlCenter = {
     },
 
     mixedActiveSubView: {
+      selectors: ["#identity-popup"],
       async applyConfig() {
         await loadPage(MIXED_ACTIVE_CONTENT_URL);
         await openIdentityPopup(true);
@@ -152,6 +166,7 @@ this.ControlCenter = {
     },
 
     mixedActiveUnblocked: {
+      selectors: ["#identity-popup"],
       async applyConfig() {
         let browserWindow = Services.wm.getMostRecentWindow("navigator:browser");
         let gBrowser = browserWindow.gBrowser;
@@ -163,6 +178,7 @@ this.ControlCenter = {
     },
 
     mixedActiveUnblockedSubView: {
+      selectors: ["#identity-popup"],
       async applyConfig() {
         let browserWindow = Services.wm.getMostRecentWindow("navigator:browser");
         let gBrowser = browserWindow.gBrowser;
@@ -174,6 +190,7 @@ this.ControlCenter = {
     },
 
     httpPassword: {
+      selectors: ["#identity-popup"],
       async applyConfig() {
         await loadPage(HTTP_PASSWORD_PAGE);
         await openIdentityPopup();
@@ -181,6 +198,7 @@ this.ControlCenter = {
     },
 
     httpPasswordSubView: {
+      selectors: ["#identity-popup"],
       async applyConfig() {
         await loadPage(HTTP_PASSWORD_PAGE);
         await openIdentityPopup(true);
@@ -188,6 +206,7 @@ this.ControlCenter = {
     },
 
     trackingProtectionNoElements: {
+      selectors: ["#identity-popup"],
       async applyConfig() {
         Services.prefs.setBoolPref("privacy.trackingprotection.enabled", true);
 
@@ -197,6 +216,7 @@ this.ControlCenter = {
     },
 
     trackingProtectionEnabled: {
+      selectors: ["#identity-popup"],
       async applyConfig() {
         Services.prefs.setBoolPref("privacy.trackingprotection.enabled", true);
         Services.prefs.setIntPref("privacy.trackingprotection.introCount", 20);
@@ -208,6 +228,7 @@ this.ControlCenter = {
     },
 
     trackingProtectionDisabled: {
+      selectors: ["#identity-popup"],
       async applyConfig() {
         let browserWindow = Services.wm.getMostRecentWindow("navigator:browser");
         let gBrowser = browserWindow.gBrowser;

browser/tools/mozscreenshots/mozscreenshots/extension/configurations/CustomizeMode.jsm

@@ -17,6 +17,7 @@ this.CustomizeMode = {
 
   configurations: {
     notCustomizing: {
+      selectors: ["#navigator-toolbox"],
       applyConfig() {
         return new Promise((resolve) => {
           let browserWindow = Services.wm.getMostRecentWindow("navigator:browser");
@@ -38,6 +39,7 @@ this.CustomizeMode = {
     },
 
     customizing: {
+      selectors: ["#navigator-toolbox", "#customization-container"],
       applyConfig() {
         return new Promise((resolve) => {
           let browserWindow = Services.wm.getMostRecentWindow("navigator:browser");

browser/tools/mozscreenshots/mozscreenshots/extension/configurations/DevTools.jsm

@@ -28,6 +28,7 @@ this.DevTools = {
 
     panels.forEach(panel => {
       this.configurations[panel] = {};
+      this.configurations[panel].selectors = ["#toolbox-container"];
       this.configurations[panel].applyConfig = async function() {
         await gDevTools.showToolbox(getTargetForSelectedTab(), panel, "bottom");
         await new Promise(resolve => setTimeout(resolve, 500));
@@ -37,18 +38,22 @@ this.DevTools = {
 
   configurations: {
     bottomToolbox: {
+      selectors: ["#toolbox-container"],
       async applyConfig() {
         await gDevTools.showToolbox(getTargetForSelectedTab(), "inspector", "bottom");
         await new Promise(resolve => setTimeout(resolve, 1000));
       },
     },
     sideToolbox: {
+      selectors: ["#toolbox-container"],
       async applyConfig() {
         await gDevTools.showToolbox(getTargetForSelectedTab(), "inspector", "side");
         await new Promise(resolve => setTimeout(resolve, 500));
       },
     },
     undockedToolbox: {
+      selectors: ["#toolbox-container"],
+      windowType: "devtools:toolbox",
       async applyConfig() {
         await gDevTools.showToolbox(getTargetForSelectedTab(), "inspector", "window");
         await new Promise(resolve => setTimeout(resolve, 500));

browser/tools/mozscreenshots/mozscreenshots/extension/configurations/LightweightThemes.jsm

@@ -27,12 +27,14 @@ this.LightweightThemes = {
 
   configurations: {
     noLWT: {
+      selectors: ["#navigator-toolbox"],
       async applyConfig() {
         LightweightThemeManager.currentTheme = null;
       },
     },
 
     darkLWT: {
+      selectors: ["#navigator-toolbox"],
       applyConfig() {
         LightweightThemeManager.setLocalTheme({
           id:          "black",
@@ -52,6 +54,7 @@ this.LightweightThemes = {
     },
 
     lightLWT: {
+      selectors: ["#navigator-toolbox"],
       applyConfig() {
         LightweightThemeManager.setLocalTheme({
           id:          "white",

browser/tools/mozscreenshots/mozscreenshots/extension/configurations/PermissionPrompts.jsm

@@ -28,6 +28,7 @@ this.PermissionPrompts = {
 
   configurations: {
     shareDevices: {
+      selectors: ["#notification-popup"],
       async applyConfig() {
         await closeLastTab();
         await clickOn("#webRTC-shareDevices");
@@ -35,6 +36,7 @@ this.PermissionPrompts = {
     },
 
     shareMicrophone: {
+      selectors: ["#notification-popup"],
       async applyConfig() {
         await closeLastTab();
         await clickOn("#webRTC-shareMicrophone");
@@ -42,6 +44,7 @@ this.PermissionPrompts = {
     },
 
     shareVideoAndMicrophone: {
+      selectors: ["#notification-popup"],
       async applyConfig() {
         await closeLastTab();
         await clickOn("#webRTC-shareDevices2");
@@ -49,6 +52,7 @@ this.PermissionPrompts = {
     },
 
     shareScreen: {
+      selectors: ["#notification-popup"],
       async applyConfig() {
         await closeLastTab();
         await clickOn("#webRTC-shareScreen");
@@ -56,6 +60,7 @@ this.PermissionPrompts = {
     },
 
     geo: {
+      selectors: ["#notification-popup"],
       async applyConfig() {
         await closeLastTab();
         await clickOn("#geo");
@@ -63,6 +68,7 @@ this.PermissionPrompts = {
     },
 
     persistentStorage: {
+      selectors: ["#notification-popup"],
       async applyConfig() {
         await closeLastTab();
         await clickOn("#persistent-storage");
@@ -70,6 +76,7 @@ this.PermissionPrompts = {
     },
 
     loginCapture: {
+      selectors: ["#notification-popup"],
       async applyConfig() {
         await closeLastTab();
         await clickOn("#login-capture");
@@ -77,6 +84,7 @@ this.PermissionPrompts = {
     },
 
     notifications: {
+      selectors: ["#notification-popup"],
       async applyConfig() {
         await closeLastTab();
         await clickOn("#web-notifications");
@@ -84,6 +92,7 @@ this.PermissionPrompts = {
     },
 
     addons: {
+      selectors: ["#notification-popup"],
       async applyConfig() {
         Services.prefs.setBoolPref("xpinstall.whitelist.required", true);
 
@@ -93,6 +102,7 @@ this.PermissionPrompts = {
     },
 
     addonsNoWhitelist: {
+      selectors: ["#notification-popup"],
       async applyConfig() {
         Services.prefs.setBoolPref("xpinstall.whitelist.required", false);
 

browser/tools/mozscreenshots/mozscreenshots/extension/configurations/Preferences.jsm

@@ -35,6 +35,7 @@ this.Preferences = {
         configName += "-" + customFn.name;
       }
       this.configurations[configName] = {};
+      this.configurations[configName].selectors = ["#browser"];
       this.configurations[configName].applyConfig = prefHelper.bind(null, primary, customFn);
     }
   },

browser/tools/mozscreenshots/mozscreenshots/extension/configurations/Tabs.jsm

@@ -21,6 +21,7 @@ this.Tabs = {
 
   configurations: {
     fiveTabs: {
+      selectors: ["#tabbrowser-tabs"],
       async applyConfig() {
         fiveTabsHelper();
         let browserWindow = Services.wm.getMostRecentWindow("navigator:browser");
@@ -32,6 +33,7 @@ this.Tabs = {
     },
 
     fourPinned: {
+      selectors: ["#tabbrowser-tabs"],
       async applyConfig() {
         fiveTabsHelper();
         let browserWindow = Services.wm.getMostRecentWindow("navigator:browser");
@@ -58,6 +60,7 @@ this.Tabs = {
     },
 
     twoPinnedWithOverflow: {
+      selectors: ["#tabbrowser-tabs"],
       async applyConfig() {
         fiveTabsHelper();
 

browser/tools/mozscreenshots/mozscreenshots/extension/configurations/TabsInTitlebar.jsm

@@ -18,6 +18,7 @@ this.TabsInTitlebar = {
 
   configurations: {
     tabsInTitlebar: {
+      selectors: ["#navigator-toolbox"],
       async applyConfig() {
         if (Services.appinfo.OS == "Linux") {
           return Promise.reject("TabsInTitlebar isn't supported on Linux");
@@ -28,6 +29,7 @@ this.TabsInTitlebar = {
     },
 
     tabsOutsideTitlebar: {
+      selectors: ["#navigator-toolbox", "#titlebar"],
       async applyConfig() {
         Services.prefs.setBoolPref(PREF_TABS_IN_TITLEBAR, false);
       },

browser/tools/mozscreenshots/mozscreenshots/extension/configurations/Toolbars.jsm

@@ -15,6 +15,7 @@ this.Toolbars = {
 
   configurations: {
     onlyNavBar: {
+      selectors: ["#navigator-toolbox"],
       async applyConfig() {
         let browserWindow = Services.wm.getMostRecentWindow("navigator:browser");
         let personalToolbar = browserWindow.document.getElementById("PersonalToolbar");
@@ -24,6 +25,7 @@ this.Toolbars = {
     },
 
     allToolbars: {
+      selectors: ["#navigator-toolbox"],
       async applyConfig() { // Boookmarks and menubar
         let browserWindow = Services.wm.getMostRecentWindow("navigator:browser");
         let personalToolbar = browserWindow.document.getElementById("PersonalToolbar");

browser/tools/mozscreenshots/mozscreenshots/extension/configurations/WindowSize.jsm

@@ -20,6 +20,7 @@ this.WindowSize = {
 
   configurations: {
     maximized: {
+      selectors: [":root"],
       async applyConfig() {
         let browserWindow = Services.wm.getMostRecentWindow("navigator:browser");
         await toggleFullScreen(browserWindow, false);
@@ -36,6 +37,7 @@ this.WindowSize = {
     },
 
     normal: {
+      selectors: [":root"],
       async applyConfig() {
         let browserWindow = Services.wm.getMostRecentWindow("navigator:browser");
         await toggleFullScreen(browserWindow, false);
@@ -47,6 +49,7 @@ this.WindowSize = {
     },
 
     fullScreen: {
+      selectors: [":root"],
       async applyConfig() {
         let browserWindow = Services.wm.getMostRecentWindow("navigator:browser");
         await toggleFullScreen(browserWindow, true);