How do we get DOM info for userChrome in 57+

Discussion about official Mozilla Firefox builds
Post Reply
User avatar
xichael
Posts: 103
Joined: May 28th, 2006, 6:10 pm

How do we get DOM info for userChrome in 57+

Post by 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:

Image
morat
Posts: 6403
Joined: February 3rd, 2009, 6:29 pm

Re: How do we get DOM info for userChrome in 57+

Post by 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
* set devtools.browsertoolbox.scope pref to "everything" (Firefox 110)

Browser Toolbox
http://firefox-source-docs.mozilla.org/ ... index.html

Browser Toolbox - Debugging popups
http://firefox-source-docs.mozilla.org/ ... ing-popups

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

You can check the Disable popup auto hide menu item to debug a popup. The button was removed.

You can use the Pick an element from the page button to inspect an element.

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;
}
Last edited by morat on September 20th, 2023, 6:27 am, edited 16 times in total.
Brummelchen
Posts: 4480
Joined: March 19th, 2005, 10:51 am

Re: How do we get DOM info for userChrome in 57+

Post by 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
Posts: 6403
Joined: February 3rd, 2009, 6:29 pm

Re: How do we get DOM info for userChrome in 57+

Post by 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
* check Disable popup auto hide menu item (button was removed)
* 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

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;
  }
}
Debugging popups
http://firefox-source-docs.mozilla.org/ ... ing-popups
Last edited by morat on September 20th, 2023, 6:26 am, edited 7 times in total.
Brummelchen
Posts: 4480
Joined: March 19th, 2005, 10:51 am

Re: How do we get DOM info for userChrome in 57+

Post by 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.
User avatar
xichael
Posts: 103
Joined: May 28th, 2006, 6:10 pm

Re: How do we get DOM info for userChrome in 57+

Post by 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
Posts: 6403
Joined: February 3rd, 2009, 6:29 pm

Re: How do we get DOM info for userChrome in 57+

Post by morat »

You're welcome.
Post Reply