[css-env-1] Specify viewport environment variable property propagation into subframes

[flackr]

css-env section 2 defines several viewport geometry environment variables. These make sense when used in the the top frame, but I think we should specify when or how these are propagated to sub frames. I created a demo showing a typical example of a subframe using a safe area to avoid drawing into the unsafe region.

On iOS Safari the safe area is always set in sub frames leads to it insetting from the frame box:

In the above screenshot, the phone is in landscape. The camera notch occupies the left of the screen and the application switcher bar occupies the bottom leading to those safe areas. The safe area on the right is presumably added for symmetry.

On Android Chrome, you can see the safe area behavior by fullscreening the frame:

On the fullscreen android view, there is only a left safe area to avoid the camera notch.

However, currently on Android Chrome if you fullscreen the inner frame we don't set the safe area in the main frame even though the main frame should also avoid the notch:

It makes sense that the root frame has those safe areas but the sub frame is positioned by the root frame in a safe area so shouldn't have any safe area. It is possible that the root frame has positioned the sub frame outside of the safe area edges but as a default behavior I don't think we should give the sub frames the safe area.

If you make the subframe fullscreen, then it makes sense that we should begin giving it a safe area since it will draw to the edges of the screen despite its normal placement in the root frame.

TLDR, I'm proposing we specify that for these screen environment variables, subframes should only get their value when they are fullscreen. The main frame should always have the safe area set even when sub frames are full screen, as it does occupy the full screen space and should also avoid the safe area.

[bramus]

TLDR, I'm proposing we specify that for these screen environment variables, subframes should only get their value when they are fullscreen.

SGTM!

[css-meeting-bot]

The CSS Working Group just discussed [css-env-1] Specify viewport environment variable property propagation into subframes, and agreed to the following:

• RESOLVED: top frame and any fullscreen subframes get insets set, but not otherwise

The full IRC log of that discussion

<kbabbitt> flackr: we have safr area inset in environment variables thjat allow authors to avoid placing content in areas not guaranteed to be visibile
<kbabbitt> ...example around notch
<kbabbitt> ...we have a difference i whether those variables are set in subframes
<kbabbitt> ...on Safari it has the same values
<kbabbitt> ...in my demo you can see content in inner frame having same insets even though inner frame is nowhere near edge of screen
<kbabbitt> ...in Chrome we pass these insets through only when frame is fullscreen
<kbabbitt> ...we also set insets on main frame
<kbabbitt> ...proposal is that for inner frames by default we don't pass through insets
<kbabbitt> ...because it's up to the author to position so it avoids that area
<kbabbitt> ...unless frame has been made fullscreen
<kbabbitt> ...any frame that's been made fullscreen gets those insets
<TabAtkins> +1 from me
<fantasai> sgtm
<kbabbitt> astearns: questions?
<kbabbitt> astearns: concerns?
<kbabbitt> Proposed: insets are not passed through to inner frames by default
<kbabbitt> Proposed: top frame and any fullscreen subframes get insets set, but not otherwise
<kbabbitt> astearns: objections?
<kbabbitt> RESOLVED: top frame and any fullscreen subframes get insets set, but not otherwise