Summary: | Updating :checked pseudo-class with next-sibling combinator can intermittently fail to re-render background SVG images with transition | ||||||||
---|---|---|---|---|---|---|---|---|---|
Product: | WebKit | Reporter: | krinklemail | ||||||
Component: | CSS | Assignee: | Nobody <webkit-unassigned> | ||||||
Status: | NEW --- | ||||||||
Severity: | Normal | CC: | dino, graouts, hartman.wiki, koivisto, rniwa, sabouhallawa, simon.fraser, volker, webkit-bug-importer, zalan | ||||||
Priority: | P2 | Keywords: | InRadar | ||||||
Version: | Safari Technology Preview | ||||||||
Hardware: | All | ||||||||
OS: | All | ||||||||
Attachments: |
|
Description
krinklemail
2015-02-18 19:13:26 PST
This is still reproducible in the latest Safari Technology Preview (56) and Safari 11.1. Updated test case: https://codepen.io/Krinkle/full/XYWjRZ Expected: Ticking a checkbox makes the tick appear. Unticking a checkbox makes the tick disappear. Actual: The initial state seems to work, but any input from the user is either ignored or applied without the tick appearing. This works as expected in Chrome, Firefox and Edge. Triaging as affecting all Hardware/OS (this issue is reproducible on Mobile Safari/iPhone as well). Tentatively raising important as the impact of this is user confusion and potentially corrupted or unintentional destructive actions, due to the user unable to see whether a checkbox is ticked or unticked. This may affect any number of UI libraries that customise the style of checkboxes on the web. Hm... the URL posted are 404 now. Could you attach a reduced test case if you still have access to it? @Ryosuke Try the link in the 2018 comment, that still works for me. Created attachment 347296 [details]
Reduction
(In reply to Derk-Jan Hartman from comment #4) > @Ryosuke Try the link in the 2018 comment, that still works for me. Thanks. I was able to make a reduction based on this. This is a very convoluted bug. It seems to only reproduce with background SVG images and only when transition is specified. It might be some sort of an animation bug. Created attachment 347298 [details]
Better reduction
On STP63, you may need to reload "better reduction" 4-5 times before you can reproduce it once. It looks like this is a painting or a layout issue because even when the green box fails to render, the computed style of the span has "200% 200%" as the background size. We hit this ASSERT when the test fails: // FIXME: This doesn't take into account the animation timeline so animations will not // restart on page load, nor will two animations in different pages have different timelines. Image* SVGImageCache::imageForRenderer(const RenderObject* renderer) const { auto* image = findImageForRenderer(renderer); if (!image) return &Image::nullImage(); ASSERT(!image->size().isEmpty()); return image; } So this does seem related to animations. I think Said should take a look and advise as I'm not sure how the SVGImageCache should relate to animations. |