New issue
Advanced search Search tips

Issue 907097 link

Starred by 1 user

Issue metadata

Status: Duplicate
Merged: issue 900154
Owner: ----
Closed: Nov 20
Cc:
Components:
EstimatedDays: ----
NextAction: ----
OS: Linux
Pri: 2
Type: Bug



Sign in to add a comment

safe-area-inset environment variables are unreliable with android P's simulated 'cutout' (aka notch)

Reported by davidmax...@gmail.com, Nov 20

Issue description

UserAgent: Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/70.0.3538.102 Safari/537.36

Steps to reproduce the problem:
1. on android p on a phone without notches (eg pixel 2), enable 'double display cutout' in the developer options in settings
2. open chrome on this page: https://jsbin.com/rawavur
3. click on the 'fullscreen' button

A: observe that the padding top/bottom are 30px

4. now close that window, and open some others - I think any pages will do, perhaps start with just one, but then try more than one
5. open https://jsbin.com/rawavur again and click on 'fullscreen'

B: observe that the padding top/bottom are no longer 30px. I've seen 11px and 4px. Observer that the position of the 'fullscreen' button visually matches the reduced padding-top, ie it is 'above' the bottom of the top notch.

What is the expected behavior?
I expect the safe-area-inset values to always be the same, and reflect the size of the notches.

What went wrong?
It varies, seemingly due to other tabs being open. This makes the developer experience frustrating.

Did this work before? N/A 

Does this work in other browsers? N/A

Chrome version: 70.0.3538.102  Channel: n/a
OS Version: 
Flash Version: 

I thought this might be the same with a phone with *real* notches, but a colleague with a Pixel 3, which has real notches, can't seem to reproduce the problem, so I think it is only with the fake ones from the developer options.
 
Mergedinto: 900154
Status: Duplicate (was: Unconfirmed)

Sign in to add a comment