How to disable "DevTools Responsive UI">CTRL-SHIFT-M[Linux]

User Help for Mozilla Firefox
Post Reply
belonesox
Posts: 6
Joined: January 13th, 2018, 4:13 am

How to disable "DevTools Responsive UI">CTRL-SHIFT-M[Linux]

Post by belonesox »

How to disable "DevTools Responsive UI" on CTRL-SHIFT-M?

It blocks me lot of functionality ("Add comments on Google Docs", etc) and old recipe
"devtools.responsiveUI.enabled=false" from
http://forums.mozillazine.org/viewtopic ... &t=2550209

not worked for me (Firefox 56.0.2).
Last edited by LIMPET235 on January 16th, 2018, 9:38 am, edited 1 time in total.
Reason: Added [Linux] to the title.
morat
Posts: 6404
Joined: February 3rd, 2009, 6:29 pm

Re: How to disable "DevTools Responsive UI" on CTRL-SHIFT-M?

Post by morat »

The developers removed the devtools.responsiveUI.enabled preference.

http://dxr.mozilla.org/mozilla-esr24/se ... sponsiveUI
http://dxr.mozilla.org/mozilla-release/ ... sponsiveUI

RDM preferences
about:config?filter=responsive

AFAIK, the only way to disable the RDM keyboard shortcut is with the mozilla.cfg file. (for advance users only)

The mozilla.cfg file is for administrators in an enterprise environment.

Code: Select all

// mozilla.cfg file needs to start with a comment line

Components.utils.import("resource://gre/modules/Services.jsm");

// Disable Responsive Design Mode Ctrl+Shift+M Keyboard Shortcut

Services.obs.addObserver(function (aSubject, aTopic, aData) {
  var chromeWindow = aSubject;
  chromeWindow.setTimeout(function () {
    var menuitem = chromeWindow.document.getElementById("menu_responsiveUI");
    var key = chromeWindow.document.getElementById("key_responsiveDesignMode");
    if (menuitem && menuitem.hasAttribute("key")) {
      menuitem.removeAttribute("key");
    }
    if (menuitem && menuitem.hasAttribute("acceltext")) {
      menuitem.removeAttribute("acceltext");
    }
    if (key && key.hasAttribute("oncommand")) {
      key.removeAttribute("oncommand");
    }
  }, 1000);
}, "browser-delayed-startup-finished", false);
Customizing Firefox – Advanced Autoconfig Files
http://mike.kaply.com/2012/03/22/custom ... fig-files/

Demo mozilla.cfg file
http://mike.kaply.com/wp-content/blogs. ... 2/demo.cfg

Observer Notifications
http://developer.mozilla.org/en-US/docs ... ifications

Deploying Firefox in an enterprise environment
http://developer.mozilla.org/en-US/Fire ... deployment
belonesox
Posts: 6
Joined: January 13th, 2018, 4:13 am

Re: How to disable "DevTools Responsive UI" on CTRL-SHIFT-M?

Post by belonesox »

Thank you for reply!

I already tried to switch off all settigns about:config?filter=responsive - not worked :(

Config files are not ideal solution — settings from prefs.js should be synchronized between dozens of laptorps and desktops where I use FF, all this file hacks I have to do manually… brrr

I have read your links, but actually still cannot get how to do it.
I have FF PR installs in Linux Machines with several Linux Distros and some Windows boxes where Firefox installed by chocolatey.

I got that I have to create "autoconfig.js" that called "mozilla.cfg"

Code: Select all

   // Any comment. You must start the file with a comment!
  pref("general.config.filename", "mozilla.cfg");
  pref("general.config.obscure_value", 0);
But where I should place "autoconfig.js" (and "mozilla.cfg")?
From https://developer.mozilla.org/en-US/Fir ... deployment looks like these are global files not bounded to firefox profile, but it looks strange.
Where I should place them, for example, for Linux Distro:
~/.mozilla/firefox/sgdasgdfgd.default ?
or
in /usr/bin, with firefox. ?
belonesox
Posts: 6
Joined: January 13th, 2018, 4:13 am

Re: How to disable "DevTools Responsive UI" on CTRL-SHIFT-M?

Post by belonesox »

I put this code

Code: Select all

// mozilla.cfg file needs to start with a comment line

Components.utils.import("resource://gre/modules/Services.jsm");

// Disable Responsive Design Mode Ctrl+Shift+M Keyboard Shortcut

Services.obs.addObserver(function (aSubject, aTopic, aData) {
  var chromeWindow = aSubject;
  chromeWindow.setTimeout(function () {
    var menuitem = chromeWindow.document.getElementById("menu_responsiveUI");
    var key = chromeWindow.document.getElementById("key_responsiveDesignMode");
    if (menuitem && menuitem.hasAttribute("key")) {
      menuitem.removeAttribute("key");
    }
    if (menuitem && menuitem.hasAttribute("acceltext")) {
      menuitem.removeAttribute("acceltext");
    }
    if (key && key.hasAttribute("oncommand")) {
      key.removeAttribute("oncommand");
    }
  }, 1000);
}, "browser-delayed-startup-finished", false);
to /usr/bin/mozilla.cfg (where /usr/bin/firefox is located)
and put

Code: Select all

// Any comment. You must start the file with a comment!
pref("general.config.filename", "mozilla.cfg");
pref("general.config.obscure_value", 0);
to /usr/lib64/firefox-56.0.2/defaults/preferences/autoconfig.js

Of course restarted...
And still damn "Responsive UI" on CTRL-SHITF-M. :(
morat
Posts: 6404
Joined: February 3rd, 2009, 6:29 pm

Re: How to disable "DevTools Responsive UI" on CTRL-SHIFT-M?

Post by morat »

Sorry, I can't test the code on Linux. I tested the code on Windows. It works for me.

You may be able to disable the RDM keyboard shortcut with the keyconfig extension. AFAIK, it still works with Firefox 56.

trlkly's dorando keyconfig
http://addons.mozilla.org/en-US/firefox ... keyconfig/
http://addons.mozilla.org/en-US/firefox ... /versions/

Edit:

I can disable the key_responsiveDesignMode shortcut with the keyconfig extension, but it re-enables on startup.

I guess the keyconfig extension isn't working in Firefox 56.
morat
Posts: 6404
Joined: February 3rd, 2009, 6:29 pm

Re: How to disable "DevTools Responsive UI" on CTRL-SHIFT-M?

Post by morat »

You can test the code in the scratchpad window.

Instructions:

* open about:config
* set devtools.chrome.enabled to true
* tools > web developer > scratchpad
* environment > browser
* edit > paste (i.e. copy and paste code snippet)
* execute > run

Code: Select all

(function () {

  if (typeof document.getElementsByAttribute == "undefined") {

    alert("Scratchpad: not in browser context");

  } else {

    var menuitem = document.getElementById("menu_responsiveUI");
    var key = document.getElementById("key_responsiveDesignMode");
    if (menuitem && menuitem.hasAttribute("key")) {
      menuitem.removeAttribute("key");
    }
    if (menuitem && menuitem.hasAttribute("acceltext")) {
      menuitem.removeAttribute("acceltext");
    }
    if (key && key.hasAttribute("oncommand")) {
      key.removeAttribute("oncommand");
    }

  }

})();
That code works for me in Firefox 56 and 57.
belonesox
Posts: 6
Joined: January 13th, 2018, 4:13 am

Re: How to disable "DevTools Responsive UI" on CTRL-SHIFT-M?

Post by belonesox »

Yes, the code in Scratchpad works, effectively disabled CTRL-SHIFT-M.

What can be wrong with
/usr/lib64/firefox-56.0.2/defaults/preferences/autoconfig.js
/usr/bin/mozilla.cfg

Placements? How to debug loading of autoconfig,js and mozilla.cfg?
morat
Posts: 6404
Joined: February 3rd, 2009, 6:29 pm

Re: How to disable "DevTools Responsive UI" on CTRL-SHIFT-M?

Post by morat »

The problem may be that the devtools module isn't loaded yet.

Try this:

Code: Select all

// mozilla.cfg file needs to start with a comment line

Components.utils.import("resource://gre/modules/Services.jsm");

// Disable Responsive Design Mode Ctrl+Shift+M Keyboard Shortcut
// Troubleshoot with Browser Console

Services.console.logStringMessage("Autoconfig: test 1");

Services.obs.addObserver(function (aSubject, aTopic, aData) {
  var chromeWindow = aSubject;
  chromeWindow.setTimeout(function () {
    Services.console.logStringMessage("Autoconfig: test 2");
    var menuitem = chromeWindow.document.getElementById("menu_responsiveUI");
    var key = chromeWindow.document.getElementById("key_responsiveDesignMode");
    Services.console.logStringMessage("Autoconfig: menuitem " + !!menuitem);
    Services.console.logStringMessage("Autoconfig: key " + !!key);
    if (menuitem && menuitem.hasAttribute("key")) {
      menuitem.removeAttribute("key");
    }
    if (menuitem && menuitem.hasAttribute("acceltext")) {
      menuitem.removeAttribute("acceltext");
    }
    if (key && key.hasAttribute("oncommand")) {
      key.removeAttribute("oncommand");
    }
  }, 10000);
}, "browser-delayed-startup-finished", false);
I changed the delay to 10 seconds after startup.

My output in the browser console is like so...
Autoconfig: test 1
Autoconfig: test 2
Autoconfig: menuitem true
Autoconfig: key true
Do you get "Autoconfig" messages in the browser console? If not, then the mozilla.cfg file wasn't loaded correctly.

Is the menuitem or key element true or false in the browser console? If both are false, then the elements weren't created yet.
belonesox
Posts: 6
Joined: January 13th, 2018, 4:13 am

Re: How to disable "DevTools Responsive UI">CTRL-SHIFT-M[Lin

Post by belonesox »

Thank you. Looks like firefox in my distro completely ifgnores autoconfig.js

Code: Select all

stas@xxx ~ $ strace firefox 2>&1 | grep autoconfig
stas@xxx ~ $ 
May be some build/configure option for FF exists to enable looking for autoconfig.js?
morat
Posts: 6404
Joined: February 3rd, 2009, 6:29 pm

Re: How to disable "DevTools Responsive UI">CTRL-SHIFT-M[Lin

Post by morat »

Sorry, I don't know how to fix the problem.

P.S.

Someone got the userChrome.js file working with only the userChrome.css file.

The hack may be a workaround if the mozilla.cfg file fails to load correctly.

Firefox Quantum compatible userChrome.js
http://github.com/Sporif/firefox-quantum-userchromejs
http://gist.github.com/Sporif

Luke Baker customizations
http://luke-baker.github.io/

Edit:

I got the following userChrome.js file working with the Sporif hack.

Code: Select all

/* Firefox userChrome.js */

(function () {

if (location == "chrome://browser/content/browser.xul") {

  setTimeout(function () {

    var menuitem = document.getElementById("menu_responsiveUI");
    var key = document.getElementById("key_responsiveDesignMode");
    if (menuitem && menuitem.hasAttribute("key")) {
      menuitem.removeAttribute("key");
    }
    if (menuitem && menuitem.hasAttribute("acceltext")) {
      menuitem.removeAttribute("acceltext");
    }
    if (key && key.hasAttribute("oncommand")) {
      key.removeAttribute("oncommand");
    }

  }, 1000);

}

})();
Last edited by morat on January 19th, 2018, 9:44 am, edited 3 times in total.
User avatar
dickvl
Posts: 54145
Joined: July 18th, 2005, 3:25 am

Re: How to disable "DevTools Responsive UI">CTRL-SHIFT-M[Lin

Post by dickvl »

Both files are probably in the wrong location.
They need both be in the Firefox installation folder (/usr/lib64/firefox-xx.0.xx/) (isn't there a symlink for the current version?).
The mozilla.cfg file at the main level where the firefox script that starts Firefox is located.
The file that calls mozilla.cfg needs to be in the same folder where channekll-prefs.js is located and that is in /defaults/pref.

See Configuration:
https://developer.mozilla.org/en-US/Fir ... deployment
belonesox
Posts: 6
Joined: January 13th, 2018, 4:13 am

Re: How to disable "DevTools Responsive UI">CTRL-SHIFT-M[Lin

Post by belonesox »

Thank all!

Looks like

Code: Select all

/usr/lib64/firefox-56.0.2/defaults/pref/autoconfig.js
/usr/lib64/firefox-56.0.2/mozilla.cfg
is working combo!

Strange, why strace did not show me expected path for "autoconfig.js", now all works as expected:

Code: Select all

stas@stas-custis-desktop ~ $ strace firefox 2>&1 | grep autoconfig
open("/usr/lib64/firefox-56.0.2/defaults/pref/autoconfig.js", O_RDONLY) = 19
stat("/usr/lib64/firefox-56.0.2/defaults/pref/autoconfig.js", {st_mode=S_IFREG|0644, st_size=144, ...}) = 0
stas@stas-custis-desktop ~ $ 
But anyway should be FF setting for this, and it should be disabled by default.
Post Reply