Support Named View Progress Timelines
Categories
(Core :: CSS Transitions and Animations, enhancement, P3)
Tracking
()
| Tracking | Status | |
|---|---|---|
| firefox114 | --- | fixed |
People
(Reporter: boris, Assigned: boris)
References
(Blocks 3 open bugs, )
Details
(Keywords: dev-doc-complete)
Attachments
(3 files, 2 obsolete files)
| Comment hidden (obsolete) |
|
Assignee | |
Updated•2 years ago
|
|
|
Assignee | |
Updated•1 year ago
|
|
|
Assignee | |
Comment 1•1 year ago
|
||
We temporarily comment out the look up of view-timeline-name.
|
|
Assignee | |
Comment 2•1 year ago
|
||
|
|
Assignee | |
Comment 3•1 year ago
|
||
Basically, we pass the subject rect (in CSSPixel) and the resolved
insets to the compositor thread, and use the viewport size from APZ, to
calculate the offsets in the compositor thread.
|
|
Assignee | |
Comment 4•1 year ago
|
||
TODO: add OMTA tests
|
|
Assignee | |
Comment 5•1 year ago
|
||
So it'd be easier to introduce view timelines by overriding ComputeOffsets().
Basically, we use offsets to control the animation progress.
For scroll-timeline, it's simply 0 to the scroll range.
For view-timeline, its progress is between 0% and 100% if the subject element
is in the view. Otherwise, its progress is outside the range. We will
implement the offset calculation of view-timeline in Bug 1737920.
|
||
Updated•1 year ago
|
|
|
||
Updated•1 year ago
|
|
|
||
Updated•1 year ago
|
|
|
||
Updated•1 year ago
|
|
|
||
Comment 6•1 year ago
|
||
Comment on attachment 9318006 [details]
Bug 1737920 - Part 3: Support view-timeline in the compositor thread.
Revision D170003 was moved to bug 1818346. Setting attachment 9318006 [details] to obsolete.
Pushed by bchiou@mozilla.com: https://hg.mozilla.org/integration/autoland/rev/a6ea19bea427 Part 1: Create ViewTimeline when specifying view-timeline property. r=emilio https://hg.mozilla.org/integration/autoland/rev/4f3a89f4e5c2 Part 2: Calculate offsets for ViewTimeline. r=emilio https://hg.mozilla.org/integration/autoland/rev/15841f7c7d94 Part 3: Look up named view timeline for CSS animations and update WPT expectations. r=emilio
Created web-platform-tests PR https://github.com/web-platform-tests/wpt/pull/39509 for changes under testing/web-platform/tests
|
||
Comment 9•1 year ago
|
||
| bugherder | ||
https://hg.mozilla.org/mozilla-central/rev/a6ea19bea427
https://hg.mozilla.org/mozilla-central/rev/4f3a89f4e5c2
https://hg.mozilla.org/mozilla-central/rev/15841f7c7d94
Upstream PR merged by moz-wptsync-bot
|
||
Comment 11•11 months ago
•
|
||
Is this feature complete, I have added the layout.css.scroll-driven-animations.enabled and it does not seem to be working.
I am using this codepen, to test the expected behaviour. I can see this working in Chrome Canary.
|
|
Assignee | |
Comment 12•11 months ago
•
|
||
(In reply to Dave Letorey from comment #11)
Is this feature complete, I have added the
layout.css.scroll-driven-animations.enabledand it does not seem to be working.
I am using this codepen, to test the expected behaviour. I can see this working in Chrome Canary.
We don't support animation-duration: auto because it is defined in CSS Animation Level 2, so please use any duration other than 0s. (Bug 1804574)
Also, the named timeline range is not supported because it should go to CSS Animation Level 2. There is a bug for it: Bug 1824875.
If you remove the named keyframe selectors (e.g. Just use 0% and 100%) and use 1s for the duration, the scroll-driven animation should work.
|
|
||
Updated•11 months ago
|
|
|
||
Comment 13•11 months ago
|
||
Related Pull Requests: