CODEWITHSUNDEEP
javascripthtmlfirefoxfirefox-addonfirefox-addon-webextensions
Patrick
Patrick

Reputation: 162

Firefox extension popup won't resize

I'm working on porting an extension from Chrome to Firefox. The popup has several different sized elements which can be shown. The issue that I'm running into is when the elements are changed or the body is resized the 'window' that the popup is displayed in does not resize.

This issue doesn't seem to exist in chrome, does anyone know what I'm doing wrong or is this a bug in Firefox? I've included the code which changes the size of the body below, this works in chrome, but does not seem to work in Firefox.

$('body').ready(function(){
  $('body').animate({
    'width':500,
    'height':500
  },500); 
});

I've also tried this with $('body').css() in case animate() was the issue, neither work.

Additionally, if I add a background to the body and shrink it, then the background can be seen changing size without the containing window changing size.

Edit: Adding more information to clarify the issue

The extension is a WebExtension add-on (https://developer.mozilla.org/en-US/Add-ons/WebExtensions)

manifest.json

{
  "manifest_version": 2,
  "browser_action": {
    "default_popup": "popup.htm"
  },
  "description": "Example extension",
  "icons": {
    "128": "example.png"
  },
  "name": "Example Extension",
  "version": "1",
  "applications":{
    "gecko":{
      "id":"[email protected]"
    }
  }
}

popup.htm

<!DOCTYPE HTML>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <script type=text/javascript src="js/jquery.js"></script>
    <script type=text/javascript src="js/popup.js"></script>
</head>
<style>
body{
  width:200px;
  height:200px;

  border:1px solid black;
}
</style>
<body>
  <button id=reset type=button>200x200px</button>
  <button id=shrink type=button>100x100px</button>
</body>
</html>

js/popup.js

$('body').ready(function (){
  $('#reset').bind('click',function(){
    $('body').css({
      width:200,
      height:200
    });
  });
  $('#shrink').bind('click',function(){
    $('body').css({
      width:100,
      height:100
    });
  });
});

When the above extension is loaded, the popup shows correctly with its initial size (200x200). However, when the body is resized, the popup's size is not updated. This same extension works as expected (popup resizes) within Chrome.

Upvotes: 8

Views: 3703

Answers (1)

Patrick
Patrick

Reputation: 162

Well it looks like this is actually bug within Firefox which is being addressed

https://bugzilla.mozilla.org/show_bug.cgi?id=1215025

Upvotes: 4

Related Questions