Customize responsive mode presets in Firefox devtools

gistfile1.js

/**
 * USE AT YOUR OWN RISK !!!
 *
 * In about:config set devtools.chrome.enabled to true;
 * Open the Scratchpad, select Environment / Browser and run this script
 * 
 * DON'T forget to then switch back Environment to Content and devtools.chrome.enabled to false
 *
 * @see http://mxr.mozilla.org/mozilla-central/source/browser/devtools/responsivedesign/responsivedesign.jsm#39
 */
var presets = [
  // Predefined
  {key: "320x480", width: 320, height: 480},    // iPhone, B2G, with <meta viewport>
  {key: "360x640", width: 360, height: 640},    // Android 4, phones, with <meta viewport>
  {key: "768x1024", width: 768, height: 1024},   // iPad, with <meta viewport>
  {key: "800x1280", width: 800, height: 1280},   // Android 4, Tablet, with <meta viewport>
  {key: "980x1280", width: 980, height: 1280},
  {key: "1280x600", width: 1280, height: 600},
  {key: "1280x600", width: 1280, height: 600},
  {key: "1920x900", width: 1920, height: 900},

  // Custom
  {key: "800x600", width: 800, height: 600}
];
if (Services.prefs.prefHasUserValue('webdeveloper.resize.count')) {
  let nbResize = Services.prefs.getIntPref('webdeveloper.resize.count');
  for (let i = 0; i < nbResize; i++) {
    let w = Services.prefs.getIntPref('webdeveloper.resize.' + (i+1) + '.width');
        h = Services.prefs.getIntPref('webdeveloper.resize.' + (i+1) + '.height');
    presets.push({
      key: w + 'x' + 'h',
      width: w,
      height: h
    });
  }
}
Services.prefs.setCharPref("devtools.responsiveUI.presets", JSON.stringify(presets));

Import Web Developer Toolbar options, if available.