200803 2019-08-15 17:39:22 -0700 Applying dynamic styling via :host causes shadow elements to render improperly 2020-03-26 13:18:15 -0700 1 1 1 Unclassified WebKit DOM Safari 12 Unspecified Unspecified RESOLVED CONFIGURATION CHANGED InRadar P2 Normal --- 148695 1 jan webkit-unassigned emilio graouts koivisto rniwa simon.fraser webkit-bug-importer oldest_to_newest 1561855 0 376451 jan 2019-08-15 17:39:22 -0700 Created attachment 376451 Repro case for bug We've seen a regression in a recent Safari release (not sure when it occurred) that prevents a web component of ours from rendering properly in response to user interaction. We've isolated a minimum repro case at https://jsbin.com/xariwib/edit?html,output (or see attachment). Expect: Clicking the buttons in the demo toggles their "selected" class, which ends up applying :host styling to show their selection state. This works as expected in Chrome and Firefox. Actual: in Safari 12+, the buttons begin to move or disappear. 1562420 1 webkit-bug-importer 2019-08-16 22:34:41 -0700 <rdar://problem/54420420> 1577503 2 rniwa 2019-10-07 14:08:08 -0700 I can still reproduce this with trunk WebKit. 1634523 3 rniwa 2020-03-26 13:18:15 -0700 This appears to be fixed now (as of Safari 13.1) 376451 2019-08-15 17:39:22 -0700 2019-08-15 17:39:22 -0700 Repro case for bug webkitHostRenderRepro.html text/html 1152 jan PCFET0NUWVBFIGh0bWw+CjxodG1sIGxhbmc9ImVuIj4KICA8aGVhZD4KICAgIDxtZXRhIGNoYXJz ZXQ9InV0Zi04Ij4KICAgIDx0aXRsZT5SZXBhaW50IGlzc3VlcyB1c2luZyA6aG9zdCBzdHlsaW5n PC90aXRsZT4KICAgIDxzY3JpcHQgdHlwZT0ibW9kdWxlIj4KICAgICAgY2xhc3MgTXlFbGVtZW50 IGV4dGVuZHMgSFRNTEVsZW1lbnQgewogICAgICAgIGNvbnN0cnVjdG9yKCkgewogICAgICAgICAg c3VwZXIoKTsKICAgICAgICAgIHRoaXMuYXR0YWNoU2hhZG93KHsgbW9kZTogJ29wZW4nIH0pOwog ICAgICAgICAgdGhpcy5zaGFkb3dSb290LmlubmVySFRNTCA9IGAKICAgICAgICAgICAgPHN0eWxl PgogICAgICAgICAgICAgICNpbm5lciB7CiAgICAgICAgICAgICAgICBjb2xvcjogaW5oZXJpdDsK ICAgICAgICAgICAgICAgIHBvc2l0aW9uOiByZWxhdGl2ZTsKICAgICAgICAgICAgICB9CiAgICAg IAogICAgICAgICAgICAgIDpob3N0KC5zZWxlY3RlZCkgewogICAgICAgICAgICAgICAgY29sb3I6 IGRvZGdlcmJsdWU7CiAgICAgICAgICAgICAgICB6LWluZGV4OiAxOwogICAgICAgICAgICAgIH0K ICAgICAgICAgICAgPC9zdHlsZT4KICAgICAgICAgICAgPGJ1dHRvbiBpZD0iaW5uZXIiPgogICAg ICAgICAgICAgIDxzbG90Pjwvc2xvdD4KICAgICAgICAgICAgPC9idXR0b24+CiAgICAgICAgICBg OwogICAgICAgICAgdGhpcy5hZGRFdmVudExpc3RlbmVyKCdjbGljaycsICgpID0+IHsKICAgICAg ICAgICAgdGhpcy5jbGFzc0xpc3QudG9nZ2xlKCdzZWxlY3RlZCcpOwogICAgICAgICAgfSk7CiAg ICAgICAgfQogICAgICB9CiAgICAgIGN1c3RvbUVsZW1lbnRzLmRlZmluZSgnbXktZWxlbWVudCcs IE15RWxlbWVudCk7ICAgIAogICAgPC9zY3JpcHQ+CiAgPC9oZWFkPgogIDxib2R5PgogICAgPHA+ CiAgICAgIENsaWNrIHRoZSBidXR0b25zIHRvIHRvZ2dsZSB0aGVpciBjb2xvci4gSW4gU2FmYXJp LCB0aGV5IGJlZ2luIHRvIG1vdmUgYXJvdW5kIG9yIGRpc2FwcGVhci4KICAgIDwvcD4KICAgIDxk aXYgc3R5bGU9ImRpc3BsYXk6IGdyaWQ7Ij4KICAgICAgPG15LWVsZW1lbnQ+T25lPC9teS1lbGVt ZW50PgogICAgICA8bXktZWxlbWVudD5Ud288L215LWVsZW1lbnQ+CiAgICA8L2Rpdj4KICA8L2Jv ZHk+CjwvaHRtbD4K