I use JavaScript bookmarklets in Mozilla Firefox to open my email, calendar, chat, etc. in pop-up child windows without a toolbar or menu bar. I do this in order to save screen real-estate, and to prevent me from using those windows for browsing and keep them visible all the time. I’ve been wondering how to have pop-up windows without the address bar....

Mozilla has a legitimate reason for ensuring the address bar is always visible - so that users can’t be misled by popups - thus, the address bar cannot be hidden by code. But, there is a way to work around this, proceed with caution, as it is a global change.

Problem

I’ve shared a few of my bookmarklets before, one of which is to open a browser window of a specific size using window.open(). The parameter toolbar=0 will open a child window without a toolbar, e.g.

javascript:(()=>{window.open("https://www.google.com/","_g","width=800,height=400,toolbar=0")?.focus()})()

Firefox will open the window that looks like this - and as you can see the address bar is still visible though not editable:

Firefox window.open() with address bar

Workaround

The workaround to hide the address bar involves creating a userChrome.css style to override Firefox’s default behaviour, so that the address bar is hidden when the toolbar is hidden.

I found the solution on this Mozilla Support Forum, to which Jefferson Scher, jscher2000, provided the answer. Mr. Scher has a web site that goes into a lot more detail about customizing Firefox styling with userChrome to reduce whitespace, to hide unwanted menu items, and more!

Here is what I did for Firefox Developer Edition on macOS:

  • First, to find out the current user profile folder:
    • in the Firefox address bar, navigate to about:support,
    • hit the Show in Finder button to open the profile folder, which on macOS looks like /Users/[user]/Library/Application Support/Firefox/Profiles/[some_random_string].dev-edition-default.

Firefox about:support profile folder

  • Next, in the profile folder (not in parent Profiles folder please), create a folder called chrome.
  • And, in the chrome folder, create a file called userChrome.css which contains:
#main-window[chromehidden*="toolbar"] #nav-bar {
  visibility:collapse;
}
  • Then, to setup Firefox to use this configuration, navigate to about:config.
  • Note that editing the Firefox settings is not recommended - click Accept the Risk and Continue if you understand the risks and wish to proceed!
  • Find the toolkit.legacyUserProfileCustomizations.stylesheets setting (search for for userprofile)...
  • And click the button (with the two arrows) to toggle false to true.

Firefox about:config with legacyUserProfileCustomizations.stylesheets enabled

  • Close the tab, and then close Firefox completely.
  • Finally, re-start Firefox and re-try the bookmarklet, and this time you will get pop-up windows without the address bar:

Firefox window.open() without address bar

Aside: You may also be interested to in a bookmarklet to make a Firefox window full-screen when using macOS split view mode, to hide the address bar, toolbar and tabs.