window.outerHeight returns wrong value in Responsive Design mode

RESOLVED FIXED in Firefox 69

Status

defect
P1
normal
RESOLVED FIXED
2 years ago
3 months ago

People

(Reporter: supersonicsnow, Assigned: mtigley)

Tracking

(Blocks 1 bug)

54 Branch
Firefox 69
Points:
---
Dependency tree / graph

Firefox Tracking Flags

(firefox69 fixed)

Details

(Whiteboard: [rdm-mvp])

Attachments

(3 attachments)

Posted image ff-bug.png
User Agent: Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Ubuntu Chromium/53.0.2785.143 Chrome/53.0.2785.143 Safari/537.36

Steps to reproduce:

Using 54.0a2 (2017-03-30) (64-bit)
I started responsive design mode to emulate a few mobile devices.

console.log(window.outerHeight);


Actual results:

window.outerHeight returns a value that has nothing to do with the height of the emulated mobile device screen, it shows a value that is the view area of the main firefox window, which is not in use at the time of emulating a mobile device, and totally irrelevant and harmful to emulating a mobile device properly.


Expected results:

Firefox should return the window height of the emulated mobile device.
Component: Untriaged → Developer Tools: Responsive Design Mode
Thanks for filing!

Looks like this is an issue with both old and new RDM.  So far, we've left these properties alone in RDM.  Chrome does appear to fix them up in their equivalent tool.
Status: UNCONFIRMED → NEW
Ever confirmed: true
Priority: -- → P3
See Also: → 1351487
Whiteboard: [rdm-v2][triage]
Product: Firefox → DevTools
Blocks: rdm-ux
Whiteboard: [rdm-v2][triage] → [rdm-v2][triage][rdm-mvp]
Priority: P3 → P2
Whiteboard: [rdm-v2][triage][rdm-mvp] → [rdm-mvp]
Assignee: nobody → mtigley
Status: NEW → ASSIGNED
Priority: P2 → P1
Assignee: mtigley → nobody
Status: ASSIGNED → NEW
Priority: P1 → P3
Whiteboard: [rdm-mvp] → [rdm-reserve]
Assignee: nobody → mtigley
Status: NEW → ASSIGNED
Priority: P3 → P1
Whiteboard: [rdm-reserve] → [rdm-mvp]

Some observations as I was investigating a potential solution:

The window's outerHeight property is writeable by both chrome and non-chrome, the difference is that if the caller is non-chrome, the value written to outerHeight acts as a Replaceable value. If the caller is chrome, then this value is directly written to window.outerHeight and modifies the window's height dimensions appropriately. See: https://searchfox.org/mozilla-central/source/dom/webidl/Window.webidl#205

Since the window can distinguish between a caller that's either chrome or not, a possible solution is to also do the same by checking the document's InRDMPane property and writing the passed outerHeight value as a Replaceable IDL property. See: https://searchfox.org/mozilla-central/source/dom/base/nsGlobalWindowInner.cpp#6655

I'll try this out.

UPDATE:

After further investigation into this, it makes more sense that the RDM iframe's outer window should just return its inner window's size values as its outer size. The reasoning for this is that the RDM browser will always represent the size of the browser viewport of the device it's simulating. So when we try to retrieve the RDM browser's outer size properties, the iframe's inner window will forward this call to the iframe's outer window. From here, we should check if the document is contained in the RDM pane and return the inner window's size values instead.

Attachment #9066917 - Attachment description: Bug 1352070 - Return the window's inner size values instead of its outer while in RDM. → Bug 1352070 - Part 1: Return the window's inner size values instead of its outer while in RDM.
Attachment #9066917 - Attachment description: Bug 1352070 - Part 1: Return the window's inner size values instead of its outer while in RDM. → Bug 1352070 - Part 1: In RDM, return the inner window size values of the RDM iframe when getting its outer size values via window.outerWidth/outerHeight
No longer blocks: 1107456
See Also: → 1107456
Pushed by mtigley@mozilla.com:
https://hg.mozilla.org/integration/autoland/rev/1986a2058bb1
Part 1: In RDM, return the inner window size values of the RDM iframe when getting its outer size values via window.outerWidth/outerHeight r=smaug
https://hg.mozilla.org/integration/autoland/rev/a3edc47a8b67
Part 2: RDM tests for ensuring that the values for the selected device's outerHeight/outerWidth properties are correct. r=bradwerth
Status: ASSIGNED → RESOLVED
Closed: 3 months ago
Resolution: --- → FIXED
Target Milestone: --- → Firefox 69
You need to log in before you can comment on or make changes to this bug.