Bug 176101 - Media query with :host inside a custom elements doesn't get updated on window resize
Summary: Media query with :host inside a custom elements doesn't get updated on window...
Status: RESOLVED FIXED
Alias: None
Product: WebKit
Classification: Unclassified
Component: CSS (show other bugs)
Version: Safari 10
Hardware: Mac macOS 10.12
: P2 Normal
Assignee: Nobody
URL:
Keywords: InRadar
Depends on:
Blocks:
 
Reported: 2017-08-30 06:31 PDT by diegocardoso
Modified: 2017-11-14 17:16 PST (History)
9 users (show)

See Also:


Attachments
patch (6.54 KB, patch)
2017-11-14 15:12 PST, Antti Koivisto
no flags Details | Formatted Diff | Diff
patch (6.33 KB, patch)
2017-11-14 15:21 PST, Antti Koivisto
simon.fraser: review+
Details | Formatted Diff | Diff

Note You need to log in before you can comment on or make changes to this bug.
Description diegocardoso 2017-08-30 06:31:12 PDT
I found this issue while trying to reproduce the Bug 170762, so I created a small test case but I used media query to see if the :host() descendants were getting updated properly. But then, I found out that the styles inside @media selectors are not updated after the user resizes the window. 

Take this example inspired by one on the original bug report http://jsbin.com/xuyozoguqu/edit?html,output 

When user clicks on the toggle button, the color of the <p> element should get updated and that works for Safari 11 Tech Preview (though it doesn't work for Safari 10).

If you try to resize the Output iframe, the color is not updated for the host descendants. The styles within @media are applied only if the criteria is matched on the first load and are not being updated whenever the viewport is resized. I have tested it for both Safari 10.1.2 (12603.3.8) and Release 38 (Safari 11.1, WebKit 12605.1.3.1) and both failed for this. I have also tested in Chrome 60.0.3112.113 (Official Build) (64-bit) and it worked as expected.
Comment 1 Radar WebKit Bug Importer 2017-08-30 09:29:41 PDT
<rdar://problem/34163850>
Comment 2 Antti Koivisto 2017-11-14 15:05:33 PST
https://trac.webkit.org/changeset/224535 fixed media queries expect that :host style still fails to update in some cases
Comment 3 Antti Koivisto 2017-11-14 15:12:59 PST
Created attachment 326932 [details]
patch
Comment 4 Build Bot 2017-11-14 15:15:31 PST
Attachment 326932 [details] did not pass style-queue:


ERROR: Source/WebCore/style/StyleScope.cpp:506:  Multi line control clauses should use braces.  [whitespace/braces] [4]
ERROR: Source/WebCore/style/StyleScope.cpp:506:  Weird number of spaces at line-start.  Are you using a 4-space indent?  [whitespace/indent] [3]
ERROR: Source/WebCore/style/StyleScope.cpp:507:  Weird number of spaces at line-start.  Are you using a 4-space indent?  [whitespace/indent] [3]
Total errors found: 3 in 5 files


If any of these errors are false positives, please file a bug against check-webkit-style.
Comment 5 Antti Koivisto 2017-11-14 15:21:28 PST
Created attachment 326933 [details]
patch
Comment 6 WebKit Commit Bot 2017-11-14 16:12:42 PST
Comment on attachment 326933 [details]
patch

Rejecting attachment 326933 [details] from commit-queue.

Failed to run "['/Volumes/Data/EWS/WebKit/Tools/Scripts/webkit-patch', '--status-host=webkit-queues.webkit.org', '--bot-id=webkit-cq-03', 'land-attachment', '--force-clean', '--non-interactive', '--parent-command=commit-queue', 326933, '--port=mac']" exit_code: 2 cwd: /Volumes/Data/EWS/WebKit

Last 500 characters of output:
fs/remotes/origin/master/.rev_map.268f45cc-cd09-0410-ab3c-d52691b4dbfc ...
Currently at 224856 = 13c8da873b53e262b788bfb2945c36df76fdc584
r224857 = 915e5c28f8c64df9691b6d007304b2b785f03abd
r224858 = 7c4b622050f2aa40cb2d8531c87fe42d825df805
r224859 = 60eceb4f1e31232e4bfb04e04deef9db559fdf8e
Done rebuilding .git/svn/refs/remotes/origin/master/.rev_map.268f45cc-cd09-0410-ab3c-d52691b4dbfc
First, rewinding head to replay your work on top of it...
Fast-forwarded master to refs/remotes/origin/master.

Full output: http://webkit-queues.webkit.org/results/5235071
Comment 7 Antti Koivisto 2017-11-14 17:16:07 PST
https://trac.webkit.org/r224864