--- a/browser/base/content/browser-places.js
+++ b/browser/base/content/browser-places.js
@@ -1229,32 +1229,40 @@ var PlacesToolbarHelper = {
   },
 };
 
 /**
  * Handles the bookmarks menu-button in the toolbar.
  */
 
 var BookmarkingUI = {
+  STAR_ID: "star-button",
   BOOKMARK_BUTTON_ID: "bookmarks-menu-button",
   BOOKMARK_BUTTON_SHORTCUT: "addBookmarkAsKb",
   get button() {
     delete this.button;
     let widgetGroup = CustomizableUI.getWidget(this.BOOKMARK_BUTTON_ID);
     return this.button = widgetGroup.forWindow(window).node;
   },
 
-  /* Can't make this a self-deleting getter because it's anonymous content
-   * and might lose/regain bindings at some point. */
   get star() {
+    if (AppConstants.MOZ_PHOTON_THEME) {
+      delete this.star;
+      return this.star = document.getElementById(this.STAR_ID);
+    }
+    /* Can't make this a self-deleting getter because it's anonymous content
+     * and might lose/regain bindings at some point. */
     return document.getAnonymousElementByAttribute(this.button, "anonid",
                                                    "button");
   },
 
   get anchor() {
+    if (AppConstants.MOZ_PHOTON_THEME) {
+      return this.star;
+    }
     if (!this._shouldUpdateStarState()) {
       return null;
     }
     let widget = CustomizableUI.getWidget(this.BOOKMARK_BUTTON_ID)
                                .forWindow(window);
     if (widget.overflowed)
       return widget.anchor;
 
@@ -1284,18 +1292,18 @@ var BookmarkingUI = {
   STATUS_UNSTARRED: 0,
   STATUS_STARRED: 1,
   get status() {
     if (!this._shouldUpdateStarState()) {
       return this.STATUS_UNSTARRED;
     }
     if (this._pendingUpdate)
       return this.STATUS_UPDATING;
-    return this.button.hasAttribute("starred") ? this.STATUS_STARRED
-                                               : this.STATUS_UNSTARRED;
+    return this.broadcaster.hasAttribute("starred") ? this.STATUS_STARRED
+                                                    : this.STATUS_UNSTARRED;
   },
 
   get _starredTooltip() {
     delete this._starredTooltip;
     return this._starredTooltip =
       this._getFormattedTooltip("starButtonOn.tooltip2");
   },
 
@@ -1314,17 +1322,19 @@ var BookmarkingUI = {
   },
 
   /**
    * The type of the area in which the button is currently located.
    * When in the panel, we don't update the button's icon.
    */
   _currentAreaType: null,
   _shouldUpdateStarState() {
-    return this._currentAreaType == CustomizableUI.TYPE_TOOLBAR;
+    // Remove everything checking _shouldUpdateStarState when non-photon goes away.
+    return AppConstants.MOZ_PHOTON_THEME ||
+           this._currentAreaType == CustomizableUI.TYPE_TOOLBAR;
   },
 
   /**
    * The popup contents must be updated when the user customizes the UI, or
    * changes the personal toolbar collapsed status.  In such a case, any needed
    * change should be handled in the popupshowing helper, for performance
    * reasons.
    */
@@ -1333,20 +1343,24 @@ var BookmarkingUI = {
     this._popupNeedsUpdate = true;
   },
 
   onPopupShowing: function BUI_onPopupShowing(event) {
     // Don't handle events for submenus.
     if (event.target != event.currentTarget)
       return;
 
-    // Ideally this code would never be reached, but if you click the outer
-    // button's border, some cpp code for the menu button's so-called XBL binding
-    // decides to open the popup even though the dropmarker is invisible.
-    if (this._currentAreaType == CustomizableUI.TYPE_MENU_PANEL) {
+    // On non-photon, this code should never be reached. However, if you click
+    // the outer button's border, some cpp code for the menu button's XBL
+    // binding decides to open the popup even though the dropmarker is invisible.
+    //
+    // Separately, in Photon, if the button is in the dynamic portion of the
+    // overflow panel, we want to show a subview instead.
+    if (this.button.getAttribute("cui-areatype") == CustomizableUI.TYPE_MENU_PANEL ||
+        (AppConstants.MOZ_PHOTON_THEME && this.button.hasAttribute("overflowedItem"))) {
       this._showSubview();
       event.preventDefault();
       event.stopPropagation();
       return;
     }
 
     let widget = CustomizableUI.getWidget(this.BOOKMARK_BUTTON_ID)
                                .forWindow(window);
@@ -1638,17 +1652,19 @@ var BookmarkingUI = {
     if (aWindow == window) {
       this._isCustomizing = false;
       this.onToolbarVisibilityChange();
     }
   },
 
   init() {
     CustomizableUI.addListener(this);
-    this._updateCustomizationState();
+    if (!AppConstants.MOZ_PHOTON_THEME) {
+      this._updateCustomizationState();
+    }
   },
 
   _hasBookmarksObserver: false,
   _itemGuids: new Set(),
   uninit: function BUI_uninit() {
     this.updateBookmarkPageMenuItem(true);
     CustomizableUI.removeListener(this);
 
@@ -1711,30 +1727,33 @@ var BookmarkingUI = {
        });
   },
 
   _updateStar: function BUI__updateStar() {
     if (!this._shouldUpdateStarState()) {
       if (this.broadcaster.hasAttribute("starred")) {
         this.broadcaster.removeAttribute("starred");
         this.broadcaster.removeAttribute("buttontooltiptext");
+        this.broadcaster.removeAttribute("tooltiptext");
       }
       return;
     }
 
     if (this._itemGuids.size > 0) {
       this.broadcaster.setAttribute("starred", "true");
       this.broadcaster.setAttribute("buttontooltiptext", this._starredTooltip);
-      if (this.button.getAttribute("overflowedItem") == "true") {
+      this.broadcaster.setAttribute("tooltiptext", this._starredTooltip);
+      if (!AppConstants.MOZ_PHOTON_THEME && this.button.getAttribute("overflowedItem") == "true") {
         this.button.setAttribute("label", this._starButtonOverflowedStarredLabel);
       }
     } else {
       this.broadcaster.removeAttribute("starred");
       this.broadcaster.setAttribute("buttontooltiptext", this._unstarredTooltip);
-      if (this.button.getAttribute("overflowedItem") == "true") {
+      this.broadcaster.setAttribute("tooltiptext", this._unstarredTooltip);
+      if (!AppConstants.MOZ_PHOTON_THEME && this.button.getAttribute("overflowedItem") == "true") {
         this.button.setAttribute("label", this._starButtonOverflowedLabel);
       }
     }
   },
 
   /**
    * forceReset is passed when we're destroyed and the label should go back
    * to the default (Bookmark This Page) for OS X.
@@ -1832,32 +1851,35 @@ var BookmarkingUI = {
   },
 
   onCommand: function BUI_onCommand(aEvent) {
     if (aEvent.target != aEvent.currentTarget) {
       return;
     }
 
     // Handle special case when the button is in the panel.
-    let isBookmarked = this._itemGuids.size > 0;
-
-    if (this._currentAreaType == CustomizableUI.TYPE_MENU_PANEL) {
+    if (this.button.getAttribute("cui-areatype") == CustomizableUI.TYPE_MENU_PANEL) {
       this._showSubview();
       return;
     }
     let widget = CustomizableUI.getWidget(this.BOOKMARK_BUTTON_ID)
                                .forWindow(window);
     if (widget.overflowed) {
       // Close the overflow panel because the Edit Bookmark panel will appear.
       widget.node.removeAttribute("closemenu");
     }
+    this.onStarCommand(aEvent);
+  },
 
+  onStarCommand(aEvent) {
     // Ignore clicks on the star if we are updating its state.
     if (!this._pendingUpdate) {
-      if (!isBookmarked)
+      let isBookmarked = this._itemGuids.size > 0;
+      // Disable the old animation in photon
+      if (!isBookmarked && !AppConstants.MOZ_PHOTON_THEME)
         this._showBookmarkedNotification();
       PlacesCommandHook.bookmarkCurrentPage(true);
     }
   },
 
   onCurrentPageContextPopupShowing() {
     this.updateBookmarkPageMenuItem();
   },
@@ -1977,19 +1999,20 @@ var BookmarkingUI = {
   },
   get _starButtonOverflowedStarredLabel() {
     delete this._starButtonOverflowedStarredLabel;
     return this._starButtonOverflowedStarredLabel =
       gNavigatorBundle.getString("starButtonOverflowedStarred.label");
   },
   onWidgetOverflow(aNode, aContainer) {
     let win = aNode.ownerGlobal;
-    if (aNode.id != this.BOOKMARK_BUTTON_ID || win != window)
+    if (AppConstants.MOZ_PHOTON_THEME || aNode.id != this.BOOKMARK_BUTTON_ID || win != window)
       return;
 
+
     let currentLabel = aNode.getAttribute("label");
     if (!this._starButtonLabel)
       this._starButtonLabel = currentLabel;
 
     if (currentLabel == this._starButtonLabel) {
       let desiredLabel = this._itemGuids.size > 0 ? this._starButtonOverflowedStarredLabel
                                                   : this._starButtonOverflowedLabel;
       aNode.setAttribute("label", desiredLabel);
@@ -2000,16 +2023,19 @@ var BookmarkingUI = {
     let win = aNode.ownerGlobal;
     if (aNode.id != this.BOOKMARK_BUTTON_ID || win != window)
       return;
 
     // The view gets broken by being removed and reinserted. Uninit
     // here so popupshowing will generate a new one:
     this._uninitView();
 
+    if (AppConstants.MOZ_PHOTON_THEME)
+      return;
+
     if (aNode.getAttribute("label") != this._starButtonLabel)
       aNode.setAttribute("label", this._starButtonLabel);
   },
 
   QueryInterface: XPCOMUtils.generateQI([
     Ci.nsINavBookmarkObserver
   ])
 };

--- a/browser/base/content/browser.xul
+++ b/browser/base/content/browser.xul
@@ -902,16 +902,24 @@
                        class="urlbar-icon"
                        hidden="true"
                        tooltiptext="&pageReportIcon.tooltip;"
                        onmousedown="gPopupBlockerObserver.onReportButtonMousedown(event);"/>
                 <image id="reader-mode-button"
                        class="urlbar-icon"
                        hidden="true"
                        onclick="ReaderParent.buttonClick(event);"/>
+#ifdef MOZ_PHOTON_THEME
+                <image id="star-button"
+                       class="urlbar-icon"
+                       onclick="BookmarkingUI.onStarCommand(event);">
+                  <observes element="bookmarkThisPageBroadcaster" attribute="starred"/>
+                  <observes element="bookmarkThisPageBroadcaster" attribute="tooltiptext"/>
+                </image>
+#endif
                 <toolbarbutton id="urlbar-zoom-button"
                        onclick="FullZoom.reset();"
                        tooltip="dynamic-shortcut-tooltip"
                        hidden="true"/>
               </hbox>
               <hbox id="userContext-icons" hidden="true">
                 <label id="userContext-label"/>
                 <image id="userContext-indicator"/>
@@ -945,17 +953,21 @@
                      cui-areatype="toolbar"
                      flex="100" persist="width" removable="true">
           <searchbar id="searchbar" flex="1"/>
         </toolbaritem>
 
         <toolbarbutton id="bookmarks-menu-button"
                        class="toolbarbutton-1 chromeclass-toolbar-additional"
                        removable="true"
+#ifdef MOZ_PHOTON_THEME
+                       type="menu"
+#else
                        type="menu-button"
+#endif
                        label="&bookmarksMenuButton.label;"
                        tooltip="dynamic-shortcut-tooltip"
                        anchor="dropmarker"
                        ondragenter="PlacesMenuDNDHandler.onDragEnter(event);"
                        ondragover="PlacesMenuDNDHandler.onDragOver(event);"
                        ondragleave="PlacesMenuDNDHandler.onDragLeave(event);"
                        ondrop="PlacesMenuDNDHandler.onDrop(event);"
                        cui-areatype="toolbar"

--- a/browser/base/content/test/general/browser_bookmark_popup.js
+++ b/browser/base/content/test/general/browser_bookmark_popup.js
@@ -4,17 +4,17 @@
 
 "use strict";
 
 /**
  * Test opening and closing the bookmarks panel.
  */
 
 let bookmarkPanel = document.getElementById("editBookmarkPanel");
-let bookmarkStar = document.getElementById("bookmarks-menu-button");
+let bookmarkStar = BookmarkingUI.star;
 let bookmarkPanelTitle = document.getElementById("editBookmarkPanelTitle");
 let editBookmarkPanelRemoveButtonRect;
 
 StarUI._closePanelQuickForTesting = true;
 
 async function test_bookmarks_popup({isNewBookmark, popupShowFn, popupEditFn,
                                 shouldAutoClose, popupHideFn, isBookmarkRemoved}) {
   await BrowserTestUtils.withNewTab({gBrowser, url: "about:home"}, async function(browser) {

--- a/browser/components/customizableui/test/browser_914138_widget_API_overflowable_toolbar.js
+++ b/browser/components/customizableui/test/browser_914138_widget_API_overflowable_toolbar.js
@@ -8,17 +8,16 @@ var navbar = document.getElementById(Cus
 var overflowList = document.getElementById(navbar.getAttribute("overflowtarget"));
 
 const kTestBtn1 = "test-addWidgetToArea-overflow";
 const kTestBtn2 = "test-removeWidgetFromArea-overflow";
 const kTestBtn3 = "test-createWidget-overflow";
 const kHomeBtn = "home-button";
 const kDownloadsBtn = "downloads-button";
 const kSearchBox = "search-container";
-const kStarBtn = "bookmarks-menu-button";
 
 var originalWindowWidth;
 
 // Adding a widget should add it next to the widget it's being inserted next to.
 add_task(async function() {
   originalWindowWidth = window.outerWidth;
   createDummyXULButton(kTestBtn1, "Test");
   ok(!navbar.hasAttribute("overflowing"), "Should start with a non-overflowing toolbar.");

--- a/browser/components/customizableui/test/browser_984455_bookmarks_items_reparenting.js
+++ b/browser/components/customizableui/test/browser_984455_bookmarks_items_reparenting.js
@@ -68,19 +68,21 @@ function checkSpecialContextMenus() {
     const kSpecialItemIDs = {
       "BMB_bookmarksToolbar": "BMB_bookmarksToolbarPopup",
       "BMB_unsortedBookmarks": "BMB_unsortedBookmarksPopup",
     };
 
     // Open the bookmarks menu button context menus and ensure that
     // they have the proper views attached.
     let shownPromise = bookmarksMenuPanelShown();
-    let dropmarker = document.getAnonymousElementByAttribute(bookmarksMenuButton,
-                                                             "anonid", "dropmarker");
-    EventUtils.synthesizeMouseAtCenter(dropmarker, {});
+    if (!AppConstants.MOZ_PHOTON_THEME) {
+      bookmarksMenuButton = document.getAnonymousElementByAttribute(bookmarksMenuButton,
+                                                                    "anonid", "dropmarker");
+    }
+    EventUtils.synthesizeMouseAtCenter(bookmarksMenuButton, {});
     info("Waiting for bookmarks menu popup to show after clicking dropmarker.")
     await shownPromise;
 
     for (let menuID in kSpecialItemIDs) {
       let menuItem = document.getElementById(menuID);
       let menuPopup = document.getElementById(kSpecialItemIDs[menuID]);
       info("Waiting to open menu for " + menuID);
       shownPromise = popupShown(menuPopup);

--- a/browser/components/places/tests/browser/browser_toolbarbutton_menu_context.js
+++ b/browser/components/places/tests/browser/browser_toolbarbutton_menu_context.js
@@ -13,20 +13,23 @@ add_task(async function testPopup() {
                                 : CustomizableUI.AREA_PANEL;
   CustomizableUI.addWidgetToArea("bookmarks-menu-button", target);
   CustomizableUI.addWidgetToArea("bookmarks-menu-button", CustomizableUI.AREA_NAVBAR, pos);
   info("Checking popup context menu after moving the bookmarks button");
   await checkPopupContextMenu();
 });
 
 async function checkPopupContextMenu() {
-  let dropmarker = document.getAnonymousElementByAttribute(bookmarksMenuButton, "anonid", "dropmarker");
+  let clickTarget = bookmarksMenuButton;
+  if (!AppConstants.MOZ_PHOTON_THEME) {
+    clickTarget = document.getAnonymousElementByAttribute(bookmarksMenuButton, "anonid", "dropmarker");
+  }
   BMB_menuPopup.setAttribute("style", "transition: none;");
   let popupShownPromise = onPopupEvent(BMB_menuPopup, "shown");
-  EventUtils.synthesizeMouseAtCenter(dropmarker, {});
+  EventUtils.synthesizeMouseAtCenter(clickTarget, {});
   info("Waiting for bookmarks menu to be shown.");
   await popupShownPromise;
   let contextMenuShownPromise = onPopupEvent(contextMenu, "shown");
   EventUtils.synthesizeMouseAtCenter(BMB_showAllBookmarks, {type: "contextmenu", button: 2 });
   info("Waiting for context menu on bookmarks menu to be shown.");
   await contextMenuShownPromise;
   ok(!newBookmarkItem.hasAttribute("disabled"), "New bookmark item shouldn't be disabled");
   let contextMenuHiddenPromise = onPopupEvent(contextMenu, "hidden");

--- a/browser/themes/shared/customizableui/panelUI.inc.css
+++ b/browser/themes/shared/customizableui/panelUI.inc.css
@@ -1548,16 +1548,19 @@ toolbarbutton[panel-multiview-anchor="tr
 }
 
 toolbarbutton[panel-multiview-anchor="true"]:-moz-locale-dir(rtl) {
   background-image: url(chrome://browser/skin/customizableui/subView-arrow-back-inverted-rtl.png),
                     linear-gradient(rgba(255,255,255,0.3), transparent);
   background-position: left calc(@menuPanelButtonWidth@ / 2 - var(--panel-ui-exit-subview-gutter-width) + 2px) center;
 }
 
+toolbarpaletteitem[place="palette"] > .toolbarbutton-1 > .toolbarbutton-menu-dropmarker,
+#bookmarks-menu-button[cui-areatype="menu-panel"] > .toolbarbutton-menu-dropmarker,
+#bookmarks-menu-button[overflowedItem] > .toolbarbutton-menu-dropmarker,
 toolbarpaletteitem[place="palette"] > .toolbarbutton-1 > .toolbarbutton-menubutton-dropmarker,
 #bookmarks-menu-button[cui-areatype="menu-panel"] > .toolbarbutton-menubutton-dropmarker {
   display: none;
 }
 
 #search-container[cui-areatype="menu-panel"],
 #wrapper-search-container[place="panel"] {
   width: @menuPanelWidth@;

new file mode 100644
--- /dev/null
+++ b/browser/themes/shared/icons/bookmark-star-on-tray.svg
@@ -0,0 +1,6 @@
+<!-- This Source Code Form is subject to the terms of the Mozilla Public
+   - License, v. 2.0. If a copy of the MPL was not distributed with this
+   - file, You can obtain one at http://mozilla.org/MPL/2.0/. -->
+<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16">
+  <path fill="context-fill" d="M14 16H2a1 1 0 0 1-1-1v-2a1 1 0 0 1 2 0v1h10v-1a1 1 0 0 1 2 0v2a1 1 0 0 1-1 1zM13.961 4.282a.9.9 0 0 0-.723-.609l-3.063-.445L8.805.456a.934.934 0 0 0-1.605 0L5.83 3.228l-3.063.445A.893.893 0 0 0 2.27 5.2l2.217 2.156-.523 3.044a.894.894 0 0 0 1.3.942L8 9.907l2.74 1.439a.888.888 0 0 0 .416.1.9.9 0 0 0 .526-.172.893.893 0 0 0 .355-.874l-.522-3.047 2.22-2.153a.893.893 0 0 0 .226-.918zm-4.367 2.45l.376 2.189L8 7.888 6.035 8.921l.376-2.189-1.592-1.55 2.2-.319L8 2.872l.983 1.991 2.2.319z"/>
+</svg>
\ No newline at end of file

--- a/browser/themes/shared/jar.inc.mn
+++ b/browser/themes/shared/jar.inc.mn
@@ -104,17 +104,21 @@
   skin/classic/browser/arrow-left.svg                 (../shared/icons/arrow-left.svg)
   skin/classic/browser/back.svg                       (../shared/icons/back.svg)
 #ifndef MOZ_PHOTON_THEME
   skin/classic/browser/back-large.svg                 (../shared/icons/back-large.svg)
 #endif
   skin/classic/browser/back-12.svg                    (../shared/icons/back-12.svg)
   skin/classic/browser/bookmark.svg                   (../shared/icons/bookmark.svg)
   skin/classic/browser/bookmark-hollow.svg            (../shared/icons/bookmark-hollow.svg)
+#ifndef MOZ_PHOTON_THEME
   skin/classic/browser/bookmarksMenu.svg              (../shared/icons/bookmarksMenu.svg)
+#else
+  skin/classic/browser/bookmark-star-on-tray.svg      (../shared/icons/bookmark-star-on-tray.svg)
+#endif
   skin/classic/browser/characterEncoding.svg          (../shared/icons/characterEncoding.svg)
   skin/classic/browser/chevron.svg                    (../shared/icons/chevron.svg)
   skin/classic/browser/check.svg                      (../shared/icons/check.svg)
   skin/classic/browser/containers.svg                 (../shared/icons/containers.svg)
   skin/classic/browser/customize.svg                  (../shared/icons/customize.svg)
   skin/classic/browser/developer.svg                  (../shared/icons/developer.svg)
   skin/classic/browser/device-mobile.svg              (../shared/icons/device-mobile.svg)
   skin/classic/browser/device-desktop.svg             (../shared/icons/device-desktop.svg)

--- a/browser/themes/shared/menupanel.inc.css
+++ b/browser/themes/shared/menupanel.inc.css
@@ -13,20 +13,22 @@ toolbarpaletteitem[place="palette"] > :-
   fill: currentColor;
 }
 
 #home-button[cui-areatype="menu-panel"],
 toolbarpaletteitem[place="palette"] > #home-button {
   -moz-image-region: rect(0px, 128px, 32px, 96px);
 }
 
+%ifndef MOZ_PHOTON_THEME
 #bookmarks-menu-button[cui-areatype="menu-panel"],
 toolbarpaletteitem[place="palette"] > #bookmarks-menu-button {
   -moz-image-region: rect(0px, 192px, 32px, 160px);
 }
+%endif
 
 #history-panelmenu[cui-areatype="menu-panel"],
 toolbarpaletteitem[place="palette"] > #history-panelmenu {
   -moz-image-region: rect(0px, 224px, 32px, 192px);
 }
 
 #downloads-button[cui-areatype="menu-panel"],
 toolbarpaletteitem[place="palette"] > #downloads-button {
@@ -265,8 +267,15 @@ toolbarpaletteitem[place="palette"] > #z
 #PanelUI-remotetabs-view-managedevices {
   list-style-image: url("chrome://browser/skin/device-mobile.svg");
 }
 
 #appMenuViewHistorySidebar,
 #PanelUI-remotetabs-view-sidebar {
   list-style-image: url("chrome://browser/skin/sidebars.svg");
 }
+
+%ifdef MOZ_PHOTON_THEME
+#bookmarks-menu-button[cui-areatype="menu-panel"],
+toolbarpaletteitem[place="palette"] > #bookmarks-menu-button {
+  list-style-image: url("chrome://browser/skin/bookmark-star-on-tray.svg");
+}
+%endif

--- a/browser/themes/shared/toolbarbutton-icons.inc.css
+++ b/browser/themes/shared/toolbarbutton-icons.inc.css
@@ -44,32 +44,40 @@ toolbar[brighttext] :-moz-any(@primaryTo
   list-style-image: url("chrome://browser/skin/stop.svg");
 }
 %endif
 
 #home-button[cui-areatype="toolbar"] {
   list-style-image: url("chrome://browser/skin/home.svg");
 }
 
+#star-button,
 #bookmarks-menu-button[cui-areatype="toolbar"] {
   list-style-image: url("chrome://browser/skin/bookmark-hollow.svg");
 }
 
+#star-button[starred],
 #bookmarks-menu-button[cui-areatype="toolbar"][starred] {
   list-style-image: url("chrome://browser/skin/bookmark.svg");
 }
 
 toolbar:not([brighttext]) #bookmarks-menu-button[cui-areatype="toolbar"][starred] > .toolbarbutton-menubutton-button {
   -moz-context-properties: fill;
   fill: var(--toolbarbutton-icon-fill-attention);
 }
 
+%ifdef MOZ_PHOTON_THEME
+#bookmarks-menu-button[cui-areatype="toolbar"] > .toolbarbutton-icon {
+  list-style-image: url("chrome://browser/skin/bookmark-star-on-tray.svg");
+}
+%else
 #bookmarks-menu-button[cui-areatype="toolbar"] > .toolbarbutton-menubutton-dropmarker > .dropmarker-icon {
   list-style-image: url("chrome://browser/skin/bookmarksMenu.svg");
 }
+%endif
 
 #history-panelmenu[cui-areatype="toolbar"] {
   list-style-image: url("chrome://browser/skin/history.svg");
 }
 
 #downloads-button[cui-areatype="toolbar"] {
 %ifdef MOZ_PHOTON_THEME
   list-style-image: url("chrome://browser/skin/download-arrow-with-bar.svg");

--- a/testing/firefox-ui/tests/puppeteer/test_places.py
+++ b/testing/firefox-ui/tests/puppeteer/test_places.py
@@ -1,14 +1,14 @@
 # This Source Code Form is subject to the terms of the Mozilla Public
 # License, v. 2.0. If a copy of the MPL was not distributed with this
 # file, You can obtain one at http://mozilla.org/MPL/2.0/.
 
 from firefox_puppeteer import PuppeteerMixin
-from marionette_driver import By, Wait
+from marionette_driver import Wait
 from marionette_harness import MarionetteTestCase
 
 
 class TestPlaces(PuppeteerMixin, MarionetteTestCase):
 
     def setUp(self):
         super(TestPlaces, self).setUp()
 
@@ -42,17 +42,17 @@ class TestPlaces(PuppeteerMixin, Marione
           return urls;
         """)
 
     def test_plugins(self):
         # TODO: Once we use a plugin, add a test case to verify that the data will be removed
         self.puppeteer.places.clear_plugin_data()
 
     def test_bookmarks(self):
-        star_button = self.marionette.find_element(By.ID, 'bookmarks-menu-button')
+        star_button = self.marionette.execute_script("return BookmarkingUI.star")
 
         # Visit URLs and bookmark them all
         for url in self.urls:
             with self.marionette.using_context('content'):
                 self.marionette.navigate(url)
 
             Wait(self.marionette).until(
                 lambda _: self.puppeteer.places.is_bookmark_star_button_ready())