browser.windows.create - broken with specific height/width on hiDPI screens, macOS
I'm seeing an issue in the latest release of Firefox (103.0.2) & Firefox developer edition (104.0b10) when working with a manifest v2 web extension. The issue is not present in Firefox Developer edition (100.0b9) and below.
When calling browser.windows.create() - passing valid options for height & width is resulting in a completely invalid and unexpected size for the resulting window. The code to reproduce the behavior is below.
This is being run in a background script of the extension.
```
const width = props.width ?? Math.round(window.screen.width * 0.8); const height = props.height ?? Math.round(window.screen.height * 0.8);
// center by default const top = props.top ?? Math.round(window.screen.height / 2 - height / 2); const left = props.left ?? Math.round(window.screen.width / 2 - width / 2);
console.log( `In openWindow width ${width} height ${height} top ${top} left ${left}` );
const newWindow = await browser.windows.create({ url: props.url, width, height, top, left, type: 'popup', });
``` The console.log result is ``` In openWindow width 3072 height 1728 top 216 left 384 ``` These are valid numbers for the screen I am working on (standard 4k displays). I am running 3 screens, all hiDPI - two are default 4k external monitors, the third is the built in laptop display.
I have not yet tested the result on other operating systems - however I am running macOS Monteray v12.4.
When running in version 100.0b9 and below, I see a centered screen ~80% of the monitor width and height appear. When I run in the current versions, I see the window briefly flash at full screen, then immediately downsize to a very small window in the upper left corner.
Please see a brief recording of the working version of Firefox Developer Edition compared to the broken version of standard Firefox here: https://monosnap.com/file/80IEHdqgSVND0ZsXKtXkxVPsNINSQd
I am running the exact same extension build in both versions.
Modified
All Replies (2)
There is a forum for Add-on developers where you might re-post this:
https://discourse.mozilla.org/c/add-ons/development/108
This this:
squad-clients said
const newWindow = await browser.windows.create({ url: props.url, width, height, top, left, type: 'popup', });
the same as this:
const newWindow = await browser.windows.create({ url: props.url, width: width, height: height, top: top, left: left, type: 'popup', });
I'm not sure there is a defined order for the parameters. https://developer.mozilla.org/docs/Mozilla/Add-ons/WebExtensions/API/windows/create
Yes - I'm just using the shorthand assignment when creating the object literal: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Object_initializer#syntax
Your two examples above will be identical.
Thanks for the link to the discourse. I've also posted a bugzilla, since this seems to be a pretty clear regression in between v100 and v103, but I'll add a post in discourse.