User Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64; rv:76.0) Gecko/20100101 Firefox/76.0
Steps to reproduce:
- Use a platform where safe area insets should always be zero (e.g. Windows).
- Play around with anything that uses safe area insets, e.g. https://temp.chrismorgan.info/safe-area-inset.html (shows the numbers and highlights the safe area insets on the viewport).
- Resize the viewport after loading the document.
Although on page load the safe area insets are zero, on resize, the bottom and right safe area insets become non-zero, seeming to duplicating the space allocations of UI elements from the opposite side.
env(safe-area-inset-bottom) becoming 28.5px when the window is maximised, or 25px when the window is not maximised. (These numbers look about right to correspond to the title bar in some way, though not directly as with the sidebar about to be discussed. I also have
#TabsToolbar hidden via userChrome.css, but I don’t believe that’s relevant.)
I have a sidebar (Tree Style Tab) open normally, and when it’s open the browser seems to want to limit the safe area to the screen width minus twice the sidebar width. That is, with a 1500px-wide screen, a maximised window (outerWidth ~1500px) and a 200px sidebar (hence innerWidth 1300px),
safe-area-inset-right will be 200px, and the safe area 1100px wide; unmaximising the window to 1400px wide (innerWidth 1200px),
safe-area-inset-right will be 100px (again safe area 1100px wide). Shrink it further and by 1300px wide (innerWidth 1100px)
safe-area-inset-right will have reached zero, where it will stay. (I confess that I’m now trying to imagine a situation in which negative safe area insets would be reasonable!)
My device has a scaling factor of 2×, but I do not believe that this is relevant—I switched it to 1× briefly to be reasonably sure (though without restarting everything).
The safe area insets should have stayed at zero.
This is a fairly recent regression, probably from the last week, fairly certainly from the last two.