Bug 200803 - Applying dynamic styling via :host causes shadow elements to render improperly
Summary: Applying dynamic styling via :host causes shadow elements to render improperly
Status: RESOLVED CONFIGURATION CHANGED
Alias: None
Product: WebKit
Classification: Unclassified
Component: DOM (show other bugs)
Version: Safari 12
Hardware: Unspecified Unspecified
: P2 Normal
Assignee: Nobody
URL:
Keywords: InRadar
Depends on:
Blocks: 148695
  Show dependency treegraph
 
Reported: 2019-08-15 17:39 PDT by Jan Miksovsky
Modified: 2020-03-26 13:18 PDT (History)
6 users (show)

See Also:


Attachments
Repro case for bug (1.12 KB, text/html)
2019-08-15 17:39 PDT, Jan Miksovsky
no flags Details

Note You need to log in before you can comment on or make changes to this bug.
Description Jan Miksovsky 2019-08-15 17:39:22 PDT
Created attachment 376451 [details]
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.
Comment 1 Radar WebKit Bug Importer 2019-08-16 22:34:41 PDT
<rdar://problem/54420420>
Comment 2 Ryosuke Niwa 2019-10-07 14:08:08 PDT
I can still reproduce this with trunk WebKit.
Comment 3 Ryosuke Niwa 2020-03-26 13:18:15 PDT
This appears to be fixed now (as of Safari 13.1)