241570 2022-06-13 14:29:01 -0700 WebKit doesn't re-resolve em-valued properties to account for font-size transitions 2023-01-07 02:08:26 -0800 1 1 1 Unclassified WebKit Animations Safari 15 Unspecified Unspecified RESOLVED DUPLICATE 210963 InRadar P2 Normal --- 1 dholbert webkit-unassigned dino emilio graouts graouts heycam koivisto mmaxfield webkit-bug-importer oldest_to_newest 1875614 0 460214 dholbert 2022-06-13 14:29:01 -0700 Created attachment 460214 testcase 1 STR: 1. Load attached testcase. 2. Hover the orange area. ACTUAL RESULTS: The orange area's width suddenly jumps to twice its original width. EXPECTED RESULTS: The orange area's width should grow gradually (in response to the font-size transition). NOTES: The element here has a width specified in `em` units, and hovering triggers a change to `font-size` which triggers a CSS transition. That should add a value for `font-size` to the cascade, per https://www.w3.org/TR/css-transitions-1/#application , which should in turn influence the resolution of `em`-valued properties. Safari 15.5 gives ACTUAL RESULTS. Firefox and Chrome give EXPECTED RESULTS. 1875620 1 dholbert 2022-06-13 14:40:39 -0700 Note: I ran across this bug due to a bug report in Firefox, which turned out to be the reporter inadvertently depending on this WebKit bug. (Chrome matches Firefox's behavior FWIW.) That report was https://bugzilla.mozilla.org/show_bug.cgi?id=1774014, which I closed as invalid since Firefox and Chrome are pretty-clearly following the spec. WebKit happens to match the reporter's expectations over there, but I'm pretty sure that's just an accident and is essentially due to this bug here. If/when you fix this bug, I suspect you'll match Firefox and Chrome on the jsfiddle and attached testcase on https://bugzilla.mozilla.org/show_bug.cgi?id=1774014 . 1875754 2 webkit-bug-importer 2022-06-14 05:41:03 -0700 <rdar://problem/95105214> 1875756 3 graouts 2022-06-14 06:03:55 -0700 Thanks for filing this Daniel. Do you know whether this is already covered by WPT? 1875759 4 graouts 2022-06-14 06:10:24 -0700 I think this might be covered by the css/css-transitions/transition-base-response-*.html tests that WebKit is the sole engine to fail :( 1875822 5 460235 graouts 2022-06-14 11:00:01 -0700 Created attachment 460235 CSS Animation of font-size combined with relative width value Adding another test where we use a CSS Animation to animate font-size. In that example, the em-based width is never updated. 1875875 6 dholbert 2022-06-14 14:52:14 -0700 (In reply to Antoine Quint from comment #3) > Thanks for filing this Daniel. Thanks for taking a look! > Do you know whether this is already covered > by WPT? I don't know offhand, no (though it sounds like you might've subsequently found some related WPT tests). 1923781 7 koivisto 2023-01-07 02:08:26 -0800 This was fixed in <https://commits.webkit.org/258514@main> *** This bug has been marked as a duplicate of bug 210963 *** 460214 2022-06-13 14:29:01 -0700 2022-06-13 14:29:01 -0700 testcase 1 test-transition.html text/html 388 dholbert PCFET0NUWVBFIGh0bWw+CjxzdHlsZT4KLnRlc3QgewogICAgdHJhbnNpdGlvbi1kdXJhdGlvbjog MnM7CiAgICB0cmFuc2l0aW9uLXByb3BlcnR5OiBmb250LXNpemU7CiAgICBmb250LXNpemU6IDIw cHg7CiAgICB3aWR0aDogOGVtOyAvKiBOT1RFOiBlbSB1bml0cywgd2hvc2UgcmVzb2x2ZWQgdmFs dWUgc2hvdWxkIHRyYWNrIHRoZSB0cmFuc2l0aW9uZWQgJ2ZvbnQtc2l6ZScgKi8KICAgIGJhY2tn cm91bmQ6IG9yYW5nZTsKIH0KCi50ZXN0OmhvdmVyIHsKICAgIGZvbnQtc2l6ZTogNDBweDsKfQo8 L3N0eWxlPgpUaGUgb3JhbmdlIGFyZWEncyB3aWR0aCBzaG91bGQgZ3JvdyBncmFkdWFsbHkgd2hl biB5b3UgaG92ZXIgaXQ6CjxkaXYgY2xhc3M9InRlc3QiPkhvdmVyPC9kaXY+Cg== 460235 2022-06-14 11:00:01 -0700 2022-06-14 11:00:01 -0700 CSS Animation of font-size combined with relative width value font-size-animation-with-width-em-value.html text/html 374 graouts PCFET0NUWVBFIGh0bWw+CjxzdHlsZT4KLnRlc3QgewogICAgZm9udC1zaXplOiAyMHB4OwogICAg d2lkdGg6IDhlbTsgLyogTk9URTogZW0gdW5pdHMsIHdob3NlIHJlc29sdmVkIHZhbHVlIHNob3Vs ZCB0cmFjayB0aGUgdHJhbnNpdGlvbmVkICdmb250LXNpemUnICovCiAgICBiYWNrZ3JvdW5kOiBv cmFuZ2U7Cn0KCi50ZXN0OmhvdmVyIHsKICAgIGFuaW1hdGlvbjogZ3JvdyAyczsKfQoKQGtleWZy YW1lcyBncm93IHsKICAgIHRvIHsgZm9udC1zaXplOiA0MHB4IH0KfQoKPC9zdHlsZT4KVGhlIG9y YW5nZSBhcmVhJ3Mgd2lkdGggc2hvdWxkIGdyb3cgZ3JhZHVhbGx5IHdoZW4geW91IGhvdmVyIGl0 Ogo8ZGl2IGNsYXNzPSJ0ZXN0Ij5Ib3ZlcjwvZGl2Pgo=