Bug 307788
| Summary: | [scroll-animations] WPT test `view-timelines/contain-alignment.html` fails | ||
|---|---|---|---|
| Product: | WebKit | Reporter: | Antoine Quint <graouts> |
| Component: | Animations | Assignee: | Antoine Quint <graouts> |
| Status: | RESOLVED FIXED | ||
| Severity: | Normal | CC: | graouts, karlcow, webkit-bug-importer |
| Priority: | P2 | Keywords: | InRadar |
| Version: | WebKit Nightly Build | ||
| Hardware: | Unspecified | ||
| OS: | Unspecified | ||
| See Also: | https://github.com/web-platform-tests/wpt/pull/57818 | ||
| Bug Depends on: | |||
| Bug Blocks: | 307797 | ||
Antoine Quint
We are failing https://wpt.fyi/results/scroll-animations/view-timelines/contain-alignment.html.
| Attachments | ||
|---|---|---|
| Add attachment proposed patch, testcase, etc. |
Radar WebKit Bug Importer
<rdar://problem/170309501>
Antoine Quint
The test has an issue:
@keyframes bg {
from { background-color: rgb(254, 0, 0); }
to { background-color: rgb(0 254, 0); }
}
Note the missing comma in the `to` value.
That said, once that is fixed, we still fail all of the tests at progress `0`.
If I add `console.log(element.getBoundingClientRect())` within the `forEach()` and comment out the assertions, you'll notice that for the "c" element we get these values:
== Firefox ==
left: 24
top: 141.3333282470703
width: 32
height: 42.66667175292969
== Chrome ==
left: 24
top: 141.3359375
width: 32
height: 42.6640625
== Safari ==
left: 24
top: 141.34375
width: 32
height: 42.671875
You'll notice how top/height are different in all browsers. Since Firefox doesn't yet have an implement for view timelines – at least not in the default configuration for Firefox Nightly – I can't comment on what this yields in the animation model, but for Chrome and Safari this yields the following state for the "c" element:
== Chrome ==
anim.currentTime: -0.0038549015072670014%
anim.effect.getComputedTiming().progress: 0
== Safari ==
anim.currentTime: -0.007709102323286032%
anim.effect.getComputedTiming().progress: null
I'm not sure if this is something we should fix by adding a bit more tolerance at the "before"/"after" phase threshold, allowing for `-0.007709102323286032` to round to `0` and thus yield a progress of `0`, or if it's something we should fix at the layout level when querying the element's metrics in `ViewTimeline::cacheCurrentTime()`.
Antoine Quint
We can solve this by adding a little tolerance when computing the current time of an animation attached to a view timeline near the 0% and 100% thresholds. We'll compute that tolerance based on a fixed point value, such as 0.1pt.
Antoine Quint
Pull request: https://github.com/WebKit/WebKit/pull/58793
Antoine Quint
Submitted web-platform-tests pull request: https://github.com/web-platform-tests/wpt/pull/57818
EWS
Committed 307693@main (915bfc026f21): <https://commits.webkit.org/307693@main>
Reviewed commits have been landed. Closing PR #58793 and removing active labels.