Issue 3887 - Support bringing up the new options page with a specific tab focused

options.js

 /*
  * This file is part of Adblock Plus <https://adblockplus.org/>,
  * Copyright (C) 2006-2016 Eyeo GmbH
  *
  * Adblock Plus is free software: you can redistribute it and/or modify
  * it under the terms of the GNU General Public License version 3 as
  * published by the Free Software Foundation.
  *
  * Adblock Plus is distributed in the hope that it will be useful,
  * but WITHOUT ANY WARRANTY; without even the implied warranty of
@@ skipping 1108 matching lines @@
 
     for (var i = 0; i < shareResources.length; i++)
       checkShareResource(shareResources[i], onResult);
   }
 
   ext.onMessage.addListener(function(message)
   {
     switch (message.type)
     {
       case "app.respond":
-        if (message.action == "addSubscription")
+        switch (message.action)
         {
-          var subscription = message.args[0];
-          var dialog = E("dialog-content-predefined");
-          dialog.querySelector("h3").textContent = subscription.title || "";
-          dialog.querySelector(".url").textContent = subscription.url;
-          openDialog("predefined");
+          case "addSubscription":
+            var subscription = message.args[0];
+            var dialog = E("dialog-content-predefined");
+            dialog.querySelector("h3").textContent = subscription.title || "";
+            dialog.querySelector(".url").textContent = subscription.url;
+            openDialog("predefined");
+            break;
+          case "switchToOptionsSection":

[Thomas Greiner, 2016/04/04 12:46:36]

Detail: Is this specific to the options page? We could make this more generic to
account for a more interesting UX.

e.g. Calling it "focusSection" would put the focus on a section on the page the
message sent to and imply all of the necessary actions to achieve that such as
switching tabs, opening dialogs and highlighting sections.

Note that in the current options page the message type is called "focus-section"
so we could reuse that (and maybe rename "addSubscription" to "add-subscription"
for consistency). There it also not only switches to the tab but highlights the
section as well (something that's missing from this implementation).

[Sebastian Noack, 2016/04/05 13:32:02]

Fine with me using a more generic name that doesn't imply the options page. Any
preference: switchToSection, switchToTab, focusSection, focusTab?
This is going to change with the current rewrite of the old options page anyway,
to comply with whatever we are going to use here. As for consistency, I'd prefer
to stick to the current scheme used by the new options page.
It seems that those aren't working currently anyway. FWIW, I think just
switching to the corresponding tab is good enough. Not that we ever used those
notifications anyway (except for one test with a limited user base).

[Thomas Greiner, 2016/04/06 12:49:12]

I'd suggest "focusSection" to no limit ourselves to tabs.
Ok, that's fine.
Should be fine for now, I agree. It's something we can implement later on when
we use it in some more common feature.

[Sebastian Noack, 2016/04/06 17:38:29]

Done.

+            document.body.setAttribute("data-tab", message.args[0]);
+            break;
         }
         break;
       case "filters.respond":
         onFilterMessage(message.action, message.args[0]);
         break;
       case "prefs.respond":
         onPrefMessage(message.action, message.args[0], false);
         break;
       case "subscriptions.respond":
         onSubscriptionMessage(message.action, message.args[0]);
         break;
     }
   });
 
   ext.backgroundPage.sendMessage(
   {
     type: "app.listen",
-    filter: ["addSubscription"]
+    filter: ["addSubscription", "switchToOptionsSection"]
   });
   ext.backgroundPage.sendMessage(
   {
     type: "filters.listen",
     filter: ["added", "loaded", "removed"]
   });
   ext.backgroundPage.sendMessage(
   {
     type: "prefs.listen",
     filter: ["notifications_ignoredcategories", "notifications_showui",
         "safari_contentblocker", "show_devtools_panel",
         "shouldShowBlockElementMenu"]
   });
   ext.backgroundPage.sendMessage(
   {
     type: "subscriptions.listen",
     filter: ["added", "disabled", "homepage", "lastDownload", "removed",
         "title"]
   });
 
   window.addEventListener("DOMContentLoaded", onDOMLoaded, false);
 })();