Firefox ESR

The venerable web browser.

App ID:

 firefox-esr 

automatic-app-scaling

4 of 5 Points, the menus are sometimes a little difficult to use and the browser can consume significant RAM. It's one of the better web browsers that runs in Mobian.

This application is installed as part of the core Mobian installation.

You can change the setting in Preferences → General → Tabs unchecking the “Open links in tabs instead of new windows” so that firefox opens new windows instead of tabs. The advantage of this setting is that each window shows up in the list of open apps in the phone shell making it easier to switch between them and close them.

Firefox tends to consume a healthy amount of RAM for each tab/window. Close ones that you are not using.

Web apps can be given access to desktop notifications that are included in the list from other apps such as Chat when you click the top menu bar. This is useful for certain web-based instant messaging systems.

The reload button is not visible on the menu bar. However, you can press and hold on the tab at the top to reveal a context menu where reload is accessible.

To make Firefox scroll more smoothly, go to about:config and set layers.acceleration.force-enabled to true. Some users have reported stability issues with this setting.

If the context menu popping up gets annoying from touching an area of the screen, or there is not a need for it, change the value under about:config and ui.click_hold_context_menus.delay from 500 to 50000. This will not affect the ability to right-click with a mouse.

One major way to increase performance in Firefox slightly (particularly with low-end hardware like the Pinephone) is the possibility to disable animations. Users reported a smoother user experience with following settings, done via about:config:

toolkit.cosmeticAnimations.enabled    false
browser.tabs.animate    false
browser.fullscreen.animate    false
browser.stopReloadAnimation.enabled    false
browser.download.animateNotifications    false
browser.suppress_first_window_animation    true
dom.animations.offscreen-throttling    true

In order to integrate media playback in Firefox into Phosh's media widget (in the top drawer and on the lockscreen), open about:config in Firefox and search for media.hardwaremediakeys.enabled. Set this key's value to true and enjoy.

The above screenshot is using Firefox with the density setting “Touch”. With this setting the back button, the tabs and the address field are larger and therefore, are easier to touch. Please use Customize (in the Hamburger menu) → Density → Touch → Done if you want to have this setting. If you cannot access the Hamburger menu, open about:config, search for browser.uidensity and set it to 2.

For reachability and using the phone one-handed, moving the url toolbar to the bottom of the screen may be easier to navigate pages as Firefox does not currently support gestures to go back or forwards. Add the following to the bottom of /etc/mobile-config-firefox/userChrome.css to move the url toolbar to the bottom of the screen and hide tabs (credit: https://github.com/MrOtherGuy/firefox-csshacks/tree/master/chrome)

/* Moves the main toolbar 
(#nav-bar) to the bottom of the 
window */ 
@-moz-document 
url(chrome://browser/content/browser.xhtml){
  :root:not([inFullscreen]){
    --uc-bottom-toolbar-height: 
    calc(39px + 
    var(--toolbarbutton-outer-padding) 
    )
  }
  :root[uidensity="compact"]:not([inFullscreen]){
    --uc-bottom-toolbar-height: 
    calc(32px + 
    var(--toolbarbutton-outer-padding) 
    )
  }
  #browser, 
  #customization-container{ 
  #margin-bottom: 
  #var(--uc-bottom-toolbar-height,0px) 
  #}
  #nav-bar{
    position: fixed !important; 
    bottom: 0px; display: flex; 
    width: 100%; z-index: 1;
  }
  #nav-bar-customization-target{ 
  #flex-grow: 1; } 
  #urlbar[breakout][breakout-extend]{
    display: flex !important; 
    flex-direction: 
    column-reverse; bottom: 
    -2px !important; /* Change 
    to 3-5 px if using 
    compact_urlbar_megabar.css 
    depending on toolbar 
    density */ top: auto 
    !important;
  }
  .urlbarView-body-inner{ 
  border-top-style: none 
  !important; 
  }
  #context-navigation {
  -moz-box-orient: vertical !important;
  }

}
/* Hides tabs toolbar */
#TabsToolbar{ visibility: collapse !important }
:root[sizemode="fullscreen"] #TabsToolbar > #window-controls{ visibility: 
:visible !important; z-index: 2 } root:not([inFullscreen]) #nav-bar{
  margin-top: calc(0px - var(--uc-toolbar-height));
}

https://www.mozilla.org/en-US/firefox/enterprise/

N/A