[DevTools] Device Mode Is Not Handling Media Queries Correctly
Reported by
kaycebas...@gmail.com,
Mar 7 2017
|
||||||||
Issue descriptionUserAgent: Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/56.0.2924.87 Safari/537.36 Steps to reproduce the problem: 1. Go to https://googlechrome.github.io/devtools-samples/mobile/v1 2. Starting with a wide window, reduce the width of the window. 3. Repeat #2, this time using Device Mode Responsive mode. What is the expected behavior? On a wide layout, you see 4 panels. On a medium layout, you see 2 panels. On a narrow layout, you see 4 panels again. This is when you're not in Device Mode. What went wrong? In Device Mode, it goes 4 panels on widge, 2 panels on medium, and stays at 2 panels on narrow (it should go back to 4 panels). Did this work before? Yes Chrome version: 56.0.2924.87 Channel: stable OS Version: Flash Version: Note that the demo intentionally has a mistake in the narrow media query (`@media (max-width: 599px) and (orientation: landscape)`).
,
Mar 7 2017
I also don't think it was relevant either way
,
Mar 7 2017
,
Mar 8 2017
,
Mar 10 2017
Tried reproducing the issue on Ubuntu 14.04 and Win-10 using chrome reported version #56.0.2924.87 and latest canary #59.0.3036.0. Attached a screen cast for reference. Following are the steps followed to reproduce the issue. ------------ 1. Navigated to https://googlechrome.github.io/devtools-samples/mobile/v1 2. Started with a wide window and observed 2 panels, reduced the size to medium and observed 4 panels, again reduced the size to narrow and observed 2 panels which is contradictory to the statement in the expected behavior of comment #0. 3. Again started with device Mode Responsive mode at 1294x1000 (75%) and observed 2 panels, reduced the size to medium and observed 4 panels and again reduced the size to narrow and observed 4 panels which is contradictory to the statement in the actual behavior of comment #0. kaycebasques@ - Could you please verify the screen cast and please let us know where and what the issue is exactly. Thanks...!!
,
Mar 10 2017
Hi krajshree@, your video reproduces the bug and describes the expected / actual behavior as I described in comment #0. There's some misunderstanding about what I mean by "2 panels" and "4 panels" so let me be more precise: The expected behavior is: Wide (A.K.A. viewport width >= 1000px): 2 rows, 4 columns Medium (A.K.A. 600px <= viewport width <= 999px): 4 rows, 2 columns Narrow (A.K.A. viewport width <= 599px): 2 rows, 4 columns The actual (in Device Mode) is: Wide (A.K.A. viewport width >= 1000px): 2 rows, 4 columns Medium (A.K.A. 600px <= viewport width <= 999px): 4 rows, 2 columns Narrow (A.K.A. viewport width <= 599px): 4 rows, 2 columns (this is where the bug is)
,
Mar 10 2017
Thank you for providing more feedback. Adding requester "krajshree@chromium.org" to the cc list and removing "Needs-Feedback" label. For more details visit https://www.chromium.org/issue-tracking/autotriage - Your friendly Sheriffbot
,
Mar 14 2017
Able to reproduce the issue on Windows 10, mac 10.12.3 and Ubuntu 14.04 using chrome reported version #56.0.2924.87 and latest canary #59.0.3040.0. Bisect Information: ===================== Good build: 49.0.2566.0 Revision(359969) Bad Build : 49.0.2567.0 Revision(360248) Change Log URL: https://chromium.googlesource.com/chromium/src/+log/9b66745fd5bd699d053d2593e11156983c1dfbb1..ba3840db6ae1e8e3cc1cfa7b763d3c93328c7121 From the above change log suspecting below change Review url: https://codereview.chromium.org/1450133003 dgozman@ - Could you please check whether this is caused with respect to your change, if not please help us in assigning it to the right owner. Thanks...!!
,
Mar 21 2017
,
Apr 11 2017
@lushnikov -- Could you please look into the issue and respond to Comment# 8 & 9 which would help us in triaging the issue. Thanks in Advance.
,
Apr 13 2017
,
Dec 6 2017
,
Dec 6 2017
|
||||||||
►
Sign in to add a comment |
||||||||
Comment 1 by kaycebas...@gmail.com
, Mar 7 2017