code review and feedback changes

src/js/background/backgroundLogic.js

@@ -1,4 +1,3 @@
-const NUMBER_OF_KEYBOARD_SHORTCUTS = 2;
 const DEFAULT_TAB = "about:newtab";
 const backgroundLogic = {
   NEW_TAB_PAGES: new Set([
@@ -7,10 +6,11 @@ const backgroundLogic = {
     "about:home",
     "about:blank"
   ]),
+  NUMBER_OF_KEYBOARD_SHORTCUTS: 2,
   unhideQueue: [],
   init() {
     browser.commands.onCommand.addListener(function (command) {
-      for (let i=0; i < NUMBER_OF_KEYBOARD_SHORTCUTS; i++) {
+      for (let i=0; i < this.NUMBER_OF_KEYBOARD_SHORTCUTS; i++) {
         const key = "open_container_" + i;
         const cookieStoreId = identityState.keyboardShortcut[key];
         if (command === key) {

src/js/background/identityState.js

@@ -1,5 +1,3 @@
-const NUM_OF_KEYBOARD_SHORTCUTS = 2;
-
 window.identityState = {
   keyboardShortcut: {},
   storageArea: {
@@ -51,7 +49,7 @@ window.identityState = {
     },
 
     async loadKeyboardShortcuts () {
-      for (let i=0; i < NUM_OF_KEYBOARD_SHORTCUTS; i++) {
+      for (let i=0; i < backgroundLogic.NUMBER_OF_KEYBOARD_SHORTCUTS; i++) {
         const key = "open_container_" + i;
         const storageObject = await this.area.get(key);
         identityState.keyboardShortcut[key] = storageObject[key];

src/js/pageAction.js

@@ -16,10 +16,9 @@ async function init() {
           </div>
         </div>
         <span class="menu-text">${identity.name}</span>`;
-
-    fragment.appendChild(tr);
-
+    
     tr.appendChild(td);
+    fragment.appendChild(tr);
 
     Utils.addEnterHandler(tr, async () => {
       Utils.alwaysOpenInContainer(identity);

src/js/popup.js

@@ -725,6 +725,17 @@ Logic.registerPanel(P_CONTAINER_INFO, {
   async prepare() {
     const identity = Logic.currentIdentity();
 
+    const newTab = document.querySelector("#open-new-tab-in-info");
+    Utils.addEnterHandler(newTab, () => {
+      try {
+        browser.tabs.create({
+          cookieStoreId: identity.cookieStoreId
+        });
+        window.close();
+      } catch (e) {
+        window.close();
+      }
+    });
     // Populating the panel: name and icon
     document.getElementById("container-info-title").textContent = identity.name;
     
@@ -922,7 +933,7 @@ Logic.registerPanel(MANAGE_CONTAINERS_PICKER, {
       <table class="menu">
         <tr class="menu-item hover-highlight" id="new-container" tabindex="0">
           <td>
-            <div class="menu-icon new-container-icon">+
+            <div class="menu-icon"><img alt="New Container" src="/img/new-16.svg" />
             </div>
             <span class="menu-text">New Container</span>
           </td>