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
2017-10-05 13:29:06 -04:00 · 2017-10-05 13:29:06 -04:00 · a48a301e3c
--- a/browser/tools/mozscreenshots/mozscreenshots/extension/configurations/AppMenu.jsm
+++ b/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");
--- a/browser/tools/mozscreenshots/mozscreenshots/extension/configurations/Buttons.jsm
+++ b/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");
      },
--- a/browser/tools/mozscreenshots/mozscreenshots/extension/configurations/ControlCenter.jsm
+++ b/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;
--- a/browser/tools/mozscreenshots/mozscreenshots/extension/configurations/CustomizeMode.jsm
+++ b/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");
--- a/browser/tools/mozscreenshots/mozscreenshots/extension/configurations/DevTools.jsm
+++ b/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));
--- a/browser/tools/mozscreenshots/mozscreenshots/extension/configurations/LightweightThemes.jsm
+++ b/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",
--- a/browser/tools/mozscreenshots/mozscreenshots/extension/configurations/PermissionPrompts.jsm
+++ b/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);

--- a/browser/tools/mozscreenshots/mozscreenshots/extension/configurations/Preferences.jsm
+++ b/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);
    }
  },
--- a/browser/tools/mozscreenshots/mozscreenshots/extension/configurations/Tabs.jsm
+++ b/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();

--- a/browser/tools/mozscreenshots/mozscreenshots/extension/configurations/TabsInTitlebar.jsm
+++ b/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);
      },
--- a/browser/tools/mozscreenshots/mozscreenshots/extension/configurations/Toolbars.jsm
+++ b/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");
--- a/browser/tools/mozscreenshots/mozscreenshots/extension/configurations/WindowSize.jsm
+++ b/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);