Remove extra await

package.json

@@ -2,7 +2,7 @@
   "name": "testpilot-containers",
   "title": "Multi-Account Containers",
   "description": "Containers helps you keep all the parts of your online life contained in different tabs. Custom labels and color-coded tabs help keep different activities — like online shopping, travel planning, or checking work email — separate.",
-  "version": "8.0.0",
+  "version": "9.0.0",
   "author": "Andrea Marchesini, Luke Crouch and Jonathan Kingston",
   "bugs": {
     "url": "https://github.com/mozilla/multi-account-containers/issues"

src/css/popup.css

@@ -839,6 +839,21 @@ hr {
   padding-inline-start: 17px;
 }
 
+.mozilla-proxy-btn {
+  background-color: black;
+  background-image: url("/img/mozillavpn.png");
+  background-repeat: no-repeat;
+  background-size: 2em 2em;
+  border: 0;
+  border-radius: 2px;
+  color: white;
+  cursor: pointer;
+  height: 30px;
+  inline-size: 100%;
+  line-height: 30px;
+  text-align: center;
+}
+
 .delete-btn {
   background-color: rgba(12, 12, 13, 0.1);
   border: 0;

src/js/background/backgroundLogic.js

@@ -28,6 +28,37 @@ const backgroundLogic = {
     return extensionInfo;
   },
 
+  async getMullvadInfo() {
+    const amIMullvadPath = "https://am.i.mullvad.net/json";
+
+    // TODO: Add some sort of error catching
+    const mullvadFetchData = await fetch(amIMullvadPath)
+      .then((response) => response.json())
+      .then(data => {
+        return data;
+      });
+    return mullvadFetchData;
+  },
+
+  async getMullvadServers() {
+    console.log("getMullvadServers");
+    const mullvadServersPath = "https://stage-vpn.guardian.nonprod.cloudops.mozgcp.net/api/v1/vpn/servers";
+    console.log(`mullvadServersPath: ${mullvadServersPath}`);
+    const response = await fetch(mullvadServersPath, {
+      "credentials": "omit",
+      "headers": {
+        "Accept": "application/json",
+        "Accept-Encoding": "gzip, deflate, br",
+        "Accept-Language": "en-US,en;q=0.5",
+        "Host": "stage-vpn.guardian.nonprod.cloudops.mozgcp.net",
+      },
+      "method": "GET",
+      "mode": "cors"
+    });
+    console.log(`response: ${response}`);
+    return await response.json();
+  },
+
   getUserContextIdFromCookieStoreId(cookieStoreId) {
     if (!cookieStoreId) {
       return false;
@@ -156,7 +187,7 @@ const backgroundLogic = {
       if ("isIsolated" in containerState || remove) {
         delete containerState.isIsolated;
       } else {
-        containerState.isIsolated = "locked";        
+        containerState.isIsolated = "locked";
       }
       return await identityState.storageArea.set(cookieStoreId, containerState);
     } catch (error) {
@@ -376,4 +407,4 @@ const backgroundLogic = {
 };
 
 
-backgroundLogic.init();
+backgroundLogic.init();

src/js/background/messageHandler.js

@@ -106,6 +106,12 @@ const messageHandler = {
           return assignManager._setOrRemoveAssignment(tab.id, m.url, m.newUserContextId, m.value);
         });
         break;
+      case "getMullvadInfo":
+        response = await backgroundLogic.getMullvadInfo();
+        break;
+      case "getMullvadServers":
+        response = await backgroundLogic.getMullvadServers();
+        break;
       }
       return response;
     });

src/js/popup.js

@@ -29,6 +29,7 @@ const ALWAYS_OPEN_IN_PICKER = "always-open-in";
 const P_CONTAINER_INFO = "containerInfo";
 const P_CONTAINER_EDIT = "containerEdit";
 const P_CONTAINER_DELETE = "containerDelete";
+const P_CONTAINER_MOZ_VPN_PROXY = "containerMozVpnProxy";
 const P_CONTAINERS_ACHIEVEMENT = "containersAchievement";
 const P_CONTAINER_ASSIGNMENTS = "containerAssignments";
 
@@ -265,9 +266,6 @@ const Logic = {
       const panelElement = document.querySelector(this.getPanelSelector(panelItem));
       if (!panelElement.classList.contains("hide")) {
         panelElement.classList.add("hide");
-        if ("unregister" in panelItem) {
-          panelItem.unregister();
-        }
       }
     });
     const panelEl = document.querySelector(this.getPanelSelector(this._panels[panel]));
@@ -665,9 +663,6 @@ Logic.registerPanel(P_CONTAINERS_LIST, {
 
   },
 
-  unregister() {
-  },
-
   // This method is called when the panel is shown.
   async prepare() {
     const fragment = document.createDocumentFragment();
@@ -1463,6 +1458,12 @@ Logic.registerPanel(P_CONTAINER_EDIT, {
     Utils.addEnterHandler(deleteButton, () => {
       Logic.showPanel(P_CONTAINER_DELETE, identity);
     });
+
+    const mozillaVpnButton = document.getElementById("mozilla-proxy-button");
+    Utils.addEnterHandler(mozillaVpnButton, () => {
+      Logic.showPanel(P_CONTAINER_MOZ_VPN_PROXY, identity);
+    });
+
     return Promise.resolve(null);
   },
 
@@ -1517,6 +1518,57 @@ Logic.registerPanel(P_CONTAINER_DELETE, {
   },
 });
 
+// P_CONTAINER_MOZ_VPN_PROXY: Choose a Mozilla VPN Proxy node
+// ----------------------------------------------------------------------------
+
+Logic.registerPanel(P_CONTAINER_MOZ_VPN_PROXY, {
+  panelSelector: "#moz-vpn-proxy-panel",
+
+  // This method is called when the object is registered.
+  initialize() {
+    Utils.addEnterHandler(document.querySelector("#choose-moz-vpn-proxy-cancel-link"), () => {
+      Logic.showPreviousPanel();
+    });
+    Utils.addEnterHandler(document.querySelector("#close-moz-vpn-proxy-panel"), () => {
+      Logic.showPreviousPanel();
+    });
+    Utils.addEnterHandler(document.querySelector("#choose-moz-vpn-proxy-ok-link"), async () => {
+      try {
+        alert("assign the proxy to the container here!");
+        Logic.showPanel(P_CONTAINER_INFO, Logic.currentIdentity());
+      } catch (e) {
+        Logic.showPanel(P_CONTAINER_INFO, Logic.currentIdentity());
+      }
+    });
+  },
+
+  // This method is called when the panel is shown.
+  async prepare() {
+    const serversListEl = document.getElementById("choose-moz-vpn-proxy-server-list");
+    const promoEl = document.getElementById("choose-moz-vpn-proxy-promo");
+    const mullvadInfo = await browser.runtime.sendMessage({
+      method: "getMullvadInfo"
+    });
+    console.log(`mullvadInfo: ${mullvadInfo}`);
+    console.log(`mullvadInfo.mullvad_exit_ip: ${mullvadInfo.mullvad_exit_ip}`);
+    if (mullvadInfo.mullvad_exit_ip) {
+      const mullvadServers = await browser.runtime.sendMessage({
+        method: "getMullvadServers"
+      });
+      const serversUl = document.createElement("ul");
+      for (const country of mullvadServers.countries) {
+        const serverLi = document.createElement("li");
+        serverLi.innerHtml = Utils.escaped`${country.name}`;
+        serversUl.appendChild(serverLi);
+      }
+      serversListEl.appendChild(serversUl);
+      promoEl.classList.add("hide");
+      serversListEl.classList.remove("hide");
+    }
+    return Promise.resolve(null);
+  },
+});
+
 // P_CONTAINERS_ACHIEVEMENT: Page for achievement.
 // ----------------------------------------------------------------------------
 

src/js/proxified-containers.js

@@ -111,7 +111,7 @@ proxifiedContainers = {
 
   //Parses a proxy description string of the format type://host[:port] or type://username:password@host[:port] (port is optional)
   parseProxy(proxy_str) {
-    const proxyRegexp = /(?<type>(https?)|(socks4?)):\/\/(\b(?<username>\w+):(?<password>\w+)@)?(?<host>((?:\d{1,3}\.){3}\d{1,3}\b)|(\b(\w+)(\.(\w+))+))(:(?<port>\d+))?/;
+    const proxyRegexp = /(?<type>(https?)|(socks4?)):\/\/(\b(?<username>\w+):(?<password>\w+)@)?(?<host>((?:\d{1,3}\.){3}\d{1,3}\b)|(\b([\w.-]+)(\.([\w.-]+))+))(:(?<port>\d+))?/;
     if (proxyRegexp.test(proxy_str) !== true) {
       return false;
     }

src/manifest.json

@@ -1,7 +1,7 @@
 {
   "manifest_version": 2,
   "name": "Firefox Multi-Account Containers",
-  "version": "8.0.0",
+  "version": "9.0.0",
   "incognito": "not_allowed",
   "description": "Multi-Account Containers helps you keep all the parts of your online life contained in different tabs. Custom labels and color-coded tabs help keep different activities — like online shopping, travel planning, or checking work email — separate.",
   "icons": {
@@ -28,7 +28,9 @@
     "tabs",
     "webRequestBlocking",
     "webRequest",
-    "proxy"
+    "proxy",
+
+    "https://am.i.mullvad.net/json"
   ],
   "optional_permissions": [
     "bookmarks"

src/popup.html

@@ -301,6 +301,7 @@
         </fieldset>
         <fieldset>
           <legend>Proxy (Optional)</legend>
+          <a class="mozilla-proxy-btn" id="mozilla-proxy-button">Use Mozilla VPN</a>
           <input type="text" name="container-proxy" id="edit-container-panel-proxy" maxlength="50" placeholder="type://host:port"/>
         </fieldset>
       </form>
@@ -360,6 +361,28 @@
     </div>
   </div>
 
+  <div class="panel moz-vpn-proxy-panel hide" id="moz-vpn-proxy-panel">
+    <h3 class="title" id="moz-vpn-proxy-title">
+      Mozilla VPN Proxies
+    </h3>
+    <button class="btn-return arrow-left" id="close-moz-vpn-proxy-panel"></button>
+    <hr>
+    <div class="scrollable panel-content choose-moz-vpn-proxy">
+      <div id="choose-moz-vpn-proxy-server-list" class="hide">
+        <h4 class="choose-moz-vpn-proxy-title">Select a proxy server</h4>
+      </div>
+      <div id="choose-moz-vpn-proxy-promo">
+        <h4>Mozilla VPN</h4>
+        <p>You aren't connected to Mozilla VPN.</p>
+        <p>Connect to <a href="https://vpn.mozilla.org">Mozilla VPN</a> to use its proxy.</p>
+      </div>
+    </div>
+    <div class="panel-footer">
+      <a href="#" class="button expanded secondary footer-button cancel-button" id="choose-moz-vpn-proxy-cancel-link">Cancel</a>
+      <a href="#" class="button expanded primary footer-button" id="choose-moz-vpn-proxy-ok-link">OK</a>
+    </div>
+  </div>
+
   <script src="js/utils.js"></script>
   <script src="js/proxified-containers.js"></script>
   <script src="js/popup.js"></script>