How do we get DOM info for userChrome in 57+

[xichael]

Since DOM Inspector is currently defunct, what other tools are available to find IDs and Classes for editing userChrome.css?

Currently, my goal is to remove these top few items from the bookmark menu, if anyone has the code handy:

[morat]

Try using the Browser Toolbox.

* set devtools.chrome.enabled pref to true
* set devtools.debugger.remote-enabled pref to true
* set devtools.debugger.prompt-connection pref to false (Firefox 65+)
* set devtools.inspector.showAllAnonymousContent pref to true

Browser Toolbox
http://developer.mozilla.org/docs/Tools/Browser_Toolbox

Browser Toolbox - Debugging popups
http://developer.mozilla.org/docs/Tools/Browser_Toolbox#Debugging_popups

Try picking a menuitem in a menupopup using the following buttons.

* Disable popup auto hide
* Pick an element from the page

Code: Select all

/* Firefox userChrome.css */

@namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul");

#BMB_viewBookmarksSidebar,
#BMB_bookmarksShowAllTop,
#BMB_bookmarksShowAllTop + menuseparator,
#BMB_bookmarksToolbar {
  display: none !important;
}

Update:

The "Disable popup auto hide" menu item is in the 3 dots customize menu. The button was removed.

[Brummelchen]

and how to work on webextension popups?
i only get the photon popup code but no content.
and there exist no "Inspect Element" on the popup.

[morat]

@Brummelchen

Try something like:

* open about:debugging
* left click This Firefox or This Nightly on the left side
* left click debug or inspect button for uBlock Origin
* select a normal tab like forums.mozillazine.org
* Disable popup auto hide
* left click uBlock Origin button to open popup
* Select an iframe as the currently targeted document
* select popup.html file
* Pick an element from the page
* left click eye dropper icon or enter element picker mode icon

Debugging
http://developer.mozilla.org/en-US/Add-ons/WebExtensions/Debugging

Code: Select all

/* Firefox userContent.css */

@-moz-document regexp("moz-extension://.*/popup.html") {
  html[id="uBO-popup-panel"] span[id="gotoPick"] {
    background-color: orange !important;
  }
}

Update:

The "Disable popup auto hide" menu item is in the 3 dots customize menu. The button was removed.

[Brummelchen]

i saw this before but i had no idea about - lack of developer knowledge

nah, could not manage it with uB picker. and no code for me. next time, currently occupied with another object. but i had saved the popup to investigate. i have an upcoming idea.

thank you.

[xichael]

Thanks! This is so much better than DOM Inspector!

Here's what I got, by the way:

Code: Select all

#BMB_viewBookmarksSidebar,
#BMB_bookmarksShowAllTop,
#BMB_bookmarksShowAllTop + menuseparator,
#BMB_bookmarksToolbar {
    display: none !important;
}


[morat]

You're welcome.