--- a/browser/components/customizableui/CustomizeMode.jsm
+++ b/browser/components/customizableui/CustomizeMode.jsm
@@ -771,17 +771,19 @@ CustomizeMode.prototype = {
     }
   },
 
   addToPanel(aNode) {
     aNode = this._getCustomizableChildForNode(aNode);
     if (aNode.localName == "toolbarpaletteitem" && aNode.firstChild) {
       aNode = aNode.firstChild;
     }
-    CustomizableUI.addWidgetToArea(aNode.id, CustomizableUI.AREA_PANEL);
+    let panel = gPhotonStructure ? CustomizableUI.AREA_FIXED_OVERFLOW_PANEL
+                                 : CustomizableUI.AREA_PANEL;
+    CustomizableUI.addWidgetToArea(aNode.id, panel);
     if (!this._customizing) {
       CustomizableUI.dispatchToolboxEvent("customizationchange");
     }
   },
 
   removeFromArea(aNode) {
     aNode = this._getCustomizableChildForNode(aNode);
     if (aNode.localName == "toolbarpaletteitem" && aNode.firstChild) {

--- a/browser/components/customizableui/content/panelUI.inc.xul
+++ b/browser/components/customizableui/content/panelUI.inc.xul
@@ -327,52 +327,16 @@
           <label id="PanelUI-panic-warning">&panicButton.view.undoWarning;</label>
         </vbox>
         <button id="PanelUI-panic-view-button"
                 label="&panicButton.view.forgetButton;"/>
       </vbox>
     </panelview>
 
   </panelmultiview>
-  <!-- These menupopups are located here to prevent flickering,
-       see bug 492960 comment 20. -->
-  <menupopup id="customizationPanelItemContextMenu">
-    <menuitem oncommand="gCustomizeMode.addToToolbar(document.popupNode)"
-              closemenu="single"
-              class="customize-context-moveToToolbar"
-              accesskey="&customizeMenu.moveToToolbar.accesskey;"
-              label="&customizeMenu.moveToToolbar.label;"/>
-    <menuitem oncommand="gCustomizeMode.removeFromArea(document.popupNode)"
-              closemenu="single"
-              class="customize-context-removeFromPanel"
-              accesskey="&customizeMenu.removeFromMenu.accesskey;"
-              label="&customizeMenu.removeFromMenu.label;"/>
-    <menuseparator/>
-    <menuitem command="cmd_CustomizeToolbars"
-              class="viewCustomizeToolbar"
-              accesskey="&viewCustomizeToolbar.accesskey;"
-              label="&viewCustomizeToolbar.label;"/>
-  </menupopup>
-
-  <menupopup id="customizationPaletteItemContextMenu">
-    <menuitem oncommand="gCustomizeMode.addToToolbar(document.popupNode)"
-              class="customize-context-addToToolbar"
-              accesskey="&customizeMenu.addToToolbar.accesskey;"
-              label="&customizeMenu.addToToolbar.label;"/>
-    <menuitem oncommand="gCustomizeMode.addToPanel(document.popupNode)"
-              class="customize-context-addToPanel"
-              accesskey="&customizeMenu.addToPanel.accesskey;"
-              label="&customizeMenu.addToPanel.label;"/>
-  </menupopup>
-
-  <menupopup id="customizationPanelContextMenu">
-    <menuitem command="cmd_CustomizeToolbars"
-              accesskey="&customizeMenu.addMoreItems.accesskey;"
-              label="&customizeMenu.addMoreItems.label;"/>
-  </menupopup>
 </panel>
 
 <panel id="widget-overflow"
        role="group"
        type="arrow"
        noautofocus="true"
        position="bottomcenter topright"
        hidden="true">
@@ -484,16 +448,51 @@
                      checkboxhidden="true"
                      hidden="true">
     <popupnotificationcontent id="update-restart-notification-content" orient="vertical">
       <description id="update-restart-description">&updateRestart.message;</description>
     </popupnotificationcontent>
   </popupnotification>
 </panel>
 
+<menupopup id="customizationPanelItemContextMenu">
+  <menuitem oncommand="gCustomizeMode.addToToolbar(document.popupNode)"
+            closemenu="single"
+            class="customize-context-moveToToolbar"
+            accesskey="&customizeMenu.moveToToolbar.accesskey;"
+            label="&customizeMenu.moveToToolbar.label;"/>
+  <menuitem oncommand="gCustomizeMode.removeFromArea(document.popupNode)"
+            closemenu="single"
+            class="customize-context-removeFromPanel"
+            accesskey="&customizeMenu.removeFromMenu.accesskey;"
+            label="&customizeMenu.removeFromMenu.label;"/>
+  <menuseparator/>
+  <menuitem command="cmd_CustomizeToolbars"
+            class="viewCustomizeToolbar"
+            accesskey="&viewCustomizeToolbar.accesskey;"
+            label="&viewCustomizeToolbar.label;"/>
+</menupopup>
+
+<menupopup id="customizationPaletteItemContextMenu">
+  <menuitem oncommand="gCustomizeMode.addToToolbar(document.popupNode)"
+            class="customize-context-addToToolbar"
+            accesskey="&customizeMenu.addToToolbar.accesskey;"
+            label="&customizeMenu.addToToolbar.label;"/>
+  <menuitem oncommand="gCustomizeMode.addToPanel(document.popupNode)"
+            class="customize-context-addToPanel"
+            accesskey="&customizeMenu.addToPanel.accesskey;"
+            label="&customizeMenu.addToPanel.label;"/>
+</menupopup>
+
+<menupopup id="customizationPanelContextMenu">
+  <menuitem command="cmd_CustomizeToolbars"
+            accesskey="&customizeMenu.addMoreItems.accesskey;"
+            label="&customizeMenu.addMoreItems.label;"/>
+</menupopup>
+
 <panel id="appMenu-popup"
        class="cui-widget-panel"
        role="group"
        type="arrow"
        hidden="true"
        flip="slide"
        position="bottomcenter topright"
        noautofocus="true">

--- a/browser/components/customizableui/content/panelUI.js
+++ b/browser/components/customizableui/content/panelUI.js
@@ -536,16 +536,19 @@ const PanelUI = {
   },
 
   updateOverflowStatus() {
     let hasKids = this.overflowFixedList.hasChildNodes();
     if (hasKids && !this.navbar.hasAttribute("nonemptyoverflow")) {
       this.navbar.setAttribute("nonemptyoverflow", "true");
       this.overflowPanel.setAttribute("hasfixeditems", "true");
     } else if (!hasKids && this.navbar.hasAttribute("nonemptyoverflow")) {
+      if (this.overflowPanel.state != "closed") {
+        this.overflowPanel.hidePopup();
+      }
       this.overflowPanel.removeAttribute("hasfixeditems");
       this.navbar.removeAttribute("nonemptyoverflow");
     }
   },
 
   onWidgetAfterDOMChange(aNode, aNextNode, aContainer, aWasRemoval) {
     if (gPhotonStructure && aContainer == this.overflowFixedList) {
       this.updateOverflowStatus();

--- a/browser/components/customizableui/test/browser.ini
+++ b/browser/components/customizableui/test/browser.ini
@@ -153,9 +153,10 @@ skip-if = os == "mac"
 [browser_panelUINotifications.js]
 [browser_panelUINotifications_fullscreen.js]
 [browser_panelUINotifications_multiWindow.js]
 [browser_switch_to_customize_mode.js]
 [browser_synced_tabs_menu.js]
 [browser_check_tooltips_in_navbar.js]
 [browser_editcontrols_update.js]
 subsuite = clipboard
+[browser_photon_customization_context_menus.js]
 [browser_remote_tabs_button.js]

--- a/browser/components/customizableui/test/browser_overflow_use_subviews.js
+++ b/browser/components/customizableui/test/browser_overflow_use_subviews.js
@@ -1,25 +1,26 @@
 "use strict";
 
 const kOverflowPanel = document.getElementById("widget-overflow");
 
 var gOriginalWidth;
-registerCleanupFunction(function*() {
+registerCleanupFunction(async function() {
   kOverflowPanel.removeAttribute("animate");
   window.resizeTo(gOriginalWidth, window.outerHeight);
+  await waitForCondition(() => !document.getElementById("nav-bar").hasAttribute("overflowing"));
   CustomizableUI.reset();
 });
 
 /**
  * This checks that subview-compatible items show up as subviews rather than
- * re-anchored panels. If we ever remove the character encoding widget, please
+ * re-anchored panels. If we ever remove the developer widget, please
  * replace this test with another subview - don't remove it.
  */
-add_task(async function check_character_encoding_subview_in_overflow() {
+add_task(async function check_developer_subview_in_overflow() {
   kOverflowPanel.setAttribute("animate", "false");
   gOriginalWidth = window.outerWidth;
 
   CustomizableUI.addWidgetToArea("developer-button", CustomizableUI.AREA_NAVBAR);
 
   let navbar = document.getElementById(CustomizableUI.AREA_NAVBAR);
   ok(!navbar.hasAttribute("overflowing"), "Should start with a non-overflowing toolbar.");
   window.resizeTo(400, window.outerHeight);
@@ -34,18 +35,16 @@ add_task(async function check_character_
   let developerView = document.getElementById("PanelUI-developer");
   let button = document.getElementById("developer-button");
   let subviewShownPromise = subviewShown(developerView);
   button.click();
   await subviewShownPromise;
   is(developerView.closest("panel"), kOverflowPanel, "Should be inside the panel");
   kOverflowPanel.hidePopup();
   await Promise.resolve(); // wait for popup to hide fully.
-
-  CustomizableUI.reset();
 });
 
 /**
  * This checks that non-subview-compatible items still work correctly.
  * Ideally we should make the downloads panel and bookmarks/library item
  * proper subview items, then this test can go away, and potentially we can
  * simplify some of the subview anchoring code.
  */

copy from browser/components/customizableui/test/browser_880164_customization_context_menus.js
copy to browser/components/customizableui/test/browser_photon_customization_context_menus.js
--- a/browser/components/customizableui/test/browser_880164_customization_context_menus.js
+++ b/browser/components/customizableui/test/browser_photon_customization_context_menus.js
@@ -3,20 +3,23 @@
  * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
 
 "use strict";
 
 requestLongerTimeout(2);
 
 const isOSX = (Services.appinfo.OS === "Darwin");
 
+const overflowButton = document.getElementById("nav-bar-overflow-button");
+const overflowPanel = document.getElementById("widget-overflow");
+
 // Right-click on the home button should
 // show a context menu with options to move it.
 add_task(async function() {
-  await SpecialPowers.pushPrefEnv({set: [["browser.photon.structure.enabled", false]]});
+  await SpecialPowers.pushPrefEnv({set: [["browser.photon.structure.enabled", true]]});
   let contextMenu = document.getElementById("toolbar-context-menu");
   let shownPromise = popupShown(contextMenu);
   let homeButton = document.getElementById("home-button");
   EventUtils.synthesizeMouse(homeButton, 2, 2, {type: "contextmenu", button: 2 });
   await shownPromise;
 
   let expectedEntries = [
     [".customize-context-moveToPanel", true],
@@ -142,67 +145,70 @@ add_task(async function() {
 });
 
 // Right-click on the searchbar and moving it to the menu
 // and back should move the search-container instead.
 add_task(async function() {
   let searchbar = document.getElementById("searchbar");
   gCustomizeMode.addToPanel(searchbar);
   let placement = CustomizableUI.getPlacementOfWidget("search-container");
-  is(placement.area, CustomizableUI.AREA_PANEL, "Should be in panel");
+  is(placement.area, CustomizableUI.AREA_FIXED_OVERFLOW_PANEL, "Should be in panel");
 
-  let shownPanelPromise = promisePanelShown(window);
-  PanelUI.toggle({type: "command"});
+  let shownPanelPromise = popupShown(overflowPanel);
+  overflowButton.click();
   await shownPanelPromise;
-  let hiddenPanelPromise = promisePanelHidden(window);
-  PanelUI.toggle({type: "command"});
+  let hiddenPanelPromise = popupHidden(overflowPanel);
+  overflowButton.click();
   await hiddenPanelPromise;
 
   gCustomizeMode.addToToolbar(searchbar);
   placement = CustomizableUI.getPlacementOfWidget("search-container");
   is(placement.area, CustomizableUI.AREA_NAVBAR, "Should be in navbar");
   gCustomizeMode.removeFromArea(searchbar);
   placement = CustomizableUI.getPlacementOfWidget("search-container");
   is(placement, null, "Should be in palette");
   CustomizableUI.reset();
   placement = CustomizableUI.getPlacementOfWidget("search-container");
   is(placement.area, CustomizableUI.AREA_NAVBAR, "Should be in navbar");
 });
 
-// Right-click on an item within the menu panel should
+// Right-click on an item within the panel should
 // show a context menu with options to move it.
 add_task(async function() {
-  let shownPanelPromise = promisePanelShown(window);
-  PanelUI.toggle({type: "command"});
+  CustomizableUI.addWidgetToArea("new-window-button", CustomizableUI.AREA_FIXED_OVERFLOW_PANEL);
+  let shownPanelPromise = popupShown(overflowPanel);
+  overflowButton.click();
   await shownPanelPromise;
 
   let contextMenu = document.getElementById("customizationPanelItemContextMenu");
   let shownContextPromise = popupShown(contextMenu);
   let newWindowButton = document.getElementById("new-window-button");
   ok(newWindowButton, "new-window-button was found");
   EventUtils.synthesizeMouse(newWindowButton, 2, 2, {type: "contextmenu", button: 2});
   await shownContextPromise;
 
-  is(PanelUI.panel.state, "open", "The PanelUI should still be open.");
+  is(overflowPanel.state, "open", "The overflow panel should still be open.");
 
   let expectedEntries = [
     [".customize-context-moveToToolbar", true],
     [".customize-context-removeFromPanel", true],
     ["---"],
     [".viewCustomizeToolbar", true]
   ];
   checkContextMenu(contextMenu, expectedEntries);
 
   let hiddenContextPromise = popupHidden(contextMenu);
   contextMenu.hidePopup();
   await hiddenContextPromise;
 
-  let hiddenPromise = promisePanelHidden(window);
-  PanelUI.toggle({type: "command"});
+  let hiddenPromise = popupHidden(overflowPanel);
+  overflowButton.click();
   await hiddenPromise;
+
+  CustomizableUI.removeWidgetFromArea("new-window-button");
 });
 
 // Right-click on the home button while in customization mode
 // should show a context menu with options to move it.
 add_task(async function() {
   await startCustomizing();
   let contextMenu = document.getElementById("toolbar-context-menu");
   let shownPromise = popupShown(contextMenu);
@@ -248,16 +254,17 @@ add_task(async function() {
   let hiddenContextPromise = popupHidden(contextMenu);
   contextMenu.hidePopup();
   await hiddenContextPromise;
 });
 
 // Right-click on an item in the panel while in customization mode
 // should show a context menu with options to move it.
 add_task(async function() {
+  CustomizableUI.addWidgetToArea("new-window-button", CustomizableUI.AREA_FIXED_OVERFLOW_PANEL);
   let contextMenu = document.getElementById("customizationPanelItemContextMenu");
   let shownPromise = popupShown(contextMenu);
   let newWindowButton = document.getElementById("wrapper-new-window-button");
   EventUtils.synthesizeMouse(newWindowButton, 2, 2, {type: "contextmenu", button: 2});
   await shownPromise;
 
   let expectedEntries = [
     [".customize-context-moveToToolbar", true],
@@ -265,22 +272,24 @@ add_task(async function() {
     ["---"],
     [".viewCustomizeToolbar", false]
   ];
   checkContextMenu(contextMenu, expectedEntries);
 
   let hiddenContextPromise = popupHidden(contextMenu);
   contextMenu.hidePopup();
   await hiddenContextPromise;
+  CustomizableUI.removeWidgetFromArea("new-window-button");
   await endCustomizing();
 });
 
 // Test the toolbarbutton panel context menu in customization mode
 // without opening the panel before customization mode
 add_task(async function() {
+  CustomizableUI.addWidgetToArea("new-window-button", CustomizableUI.AREA_FIXED_OVERFLOW_PANEL);
   this.otherWin = await openAndLoadWindow(null, true);
 
   await new Promise(resolve => waitForFocus(resolve, this.otherWin));
 
   await startCustomizing(this.otherWin);
 
   let contextMenu = this.otherWin.document.getElementById("customizationPanelItemContextMenu");
   let shownPromise = popupShown(contextMenu);
@@ -295,25 +304,27 @@ add_task(async function() {
     [".viewCustomizeToolbar", false]
   ];
   checkContextMenu(contextMenu, expectedEntries, this.otherWin);
 
   let hiddenContextPromise = popupHidden(contextMenu);
   contextMenu.hidePopup();
   await hiddenContextPromise;
   await endCustomizing(this.otherWin);
+  CustomizableUI.removeWidgetFromArea("new-window-button");
   await promiseWindowClosed(this.otherWin);
   this.otherWin = null;
 
   await new Promise(resolve => waitForFocus(resolve, window));
 });
 
 // Bug 945191 - Combined buttons show wrong context menu options
 // when they are in the toolbar.
 add_task(async function() {
+  CustomizableUI.addWidgetToArea("zoom-controls", CustomizableUI.AREA_FIXED_OVERFLOW_PANEL);
   await startCustomizing();
   let contextMenu = document.getElementById("customizationPanelItemContextMenu");
   let shownPromise = popupShown(contextMenu);
   let zoomControls = document.getElementById("wrapper-zoom-controls");
   EventUtils.synthesizeMouse(zoomControls, 2, 2, {type: "contextmenu", button: 2});
   await shownPromise;
   // Execute the command to move the item from the panel to the toolbar.
   contextMenu.childNodes[0].doCommand();
@@ -348,62 +359,67 @@ add_task(async function() {
   hiddenPromise = popupHidden(contextMenu);
   contextMenu.hidePopup();
   await hiddenPromise;
   await resetCustomization();
 });
 
 // Bug 947586 - After customization, panel items show wrong context menu options
 add_task(async function() {
+  info("Check panel context menu is correct after customization");
   await startCustomizing();
   await endCustomizing();
 
-  await PanelUI.show();
+  CustomizableUI.addWidgetToArea("new-window-button", CustomizableUI.AREA_FIXED_OVERFLOW_PANEL);
+  let shownPanelPromise = popupShown(overflowPanel);
+  overflowButton.click();
+  await shownPanelPromise;
 
   let contextMenu = document.getElementById("customizationPanelItemContextMenu");
   let shownContextPromise = popupShown(contextMenu);
   let newWindowButton = document.getElementById("new-window-button");
   ok(newWindowButton, "new-window-button was found");
   EventUtils.synthesizeMouse(newWindowButton, 2, 2, {type: "contextmenu", button: 2});
   await shownContextPromise;
 
-  is(PanelUI.panel.state, "open", "The PanelUI should still be open.");
+  is(overflowPanel.state, "open", "The panel should still be open.");
 
   let expectedEntries = [
     [".customize-context-moveToToolbar", true],
     [".customize-context-removeFromPanel", true],
     ["---"],
     [".viewCustomizeToolbar", true]
   ];
   checkContextMenu(contextMenu, expectedEntries);
 
   let hiddenContextPromise = popupHidden(contextMenu);
   contextMenu.hidePopup();
   await hiddenContextPromise;
 
-  let hiddenPromise = promisePanelHidden(window);
-  PanelUI.hide();
+  let hiddenPromise = popupHidden(overflowPanel);
+  overflowButton.click();
   await hiddenPromise;
+  CustomizableUI.removeWidgetFromArea("new-window-button");
 });
 
 
 // Bug 982027 - moving icon around removes custom context menu.
 add_task(async function() {
   let widgetId = "custom-context-menu-toolbarbutton";
   let expectedContext = "myfancycontext";
   let widget = createDummyXULButton(widgetId, "Test ctxt menu");
   widget.setAttribute("context", expectedContext);
   CustomizableUI.addWidgetToArea(widgetId, CustomizableUI.AREA_NAVBAR);
   is(widget.getAttribute("context"), expectedContext, "Should have context menu when added to the toolbar.");
 
   await startCustomizing();
   is(widget.getAttribute("context"), "", "Should not have own context menu in the toolbar now that we're customizing.");
   is(widget.getAttribute("wrapped-context"), expectedContext, "Should keep own context menu wrapped when in toolbar.");
 
-  let panel = PanelUI.contents;
+  let panel = document.getElementById("widget-overflow-fixed-list");
   simulateItemDrag(widget, panel);
   is(widget.getAttribute("context"), "", "Should not have own context menu when in the panel.");
   is(widget.getAttribute("wrapped-context"), expectedContext, "Should keep own context menu wrapped now that we're in the panel.");
 
   simulateItemDrag(widget, document.getElementById("nav-bar").customizationTarget);
   is(widget.getAttribute("context"), "", "Should not have own context menu when back in toolbar because we're still customizing.");
   is(widget.getAttribute("wrapped-context"), expectedContext, "Should keep own context menu wrapped now that we're back in the toolbar.");