Fix CSS step timing functions `jump-both`, `jump-start`, `start` at timestamp 0; Early return when possible by yezhizhen · Pull Request #342 · servo/stylo

yezhizhen · 2026-03-23T10:53:52Z

The keyframe selection used <= for normal direction, causing the first keyframe to be selected at progress 0; changed to < for normal direction (kept <= for reverse to avoid Fix CSS step timing functions jump-both, jump-start, start at timestamp 0; Early return when possible #342 (comment)) and added direction‑aware step‑function handling.
Guard against division‑by‑zero for zero‑length keyframe intervals.

Make early return happen earlier:

total_progress ≥ 1.0 and total_progress < 0 now handled immediately. Also make it direction aware.
At timestamp 0, for normal direction, non‑jump step functions (jump‑end, jump‑none, end) now return the start‑keyframe value early, instead of proceeding to interpolation.
Zero-interval: we exit early to avoid division‑by‑zero in percentage_between_keyframes

Any ancestors of this commit are from upstream mozilla-central, with some filtering and renaming. Our patches and sync tooling start here. The sync tooling has all been squashed into this commit, based on: https://github.com/servo/stylo/commits/64731e10dc8ef87ef52aa2fb9f988c3b2530f3a7

This is a rebase of ab75cec Signed-off-by: Oriol Brufau <obrufau@igalia.com>

Signed-off-by: Oriol Brufau <obrufau@igalia.com>

- Bump stylo_* to 0.13.0 - Bump selectors to 0.36.0 Signed-off-by: Oriol Brufau <obrufau@igalia.com>

Required for firing events for contenteditable Signed-off-by: Tim van der Lippe <tvanderlippe@gmail.com>

This way it can be shared among Gecko and Servo. Stylo PR: servo/servo#43085 Upstream: https://bugzilla.mozilla.org/show_bug.cgi?id=2021743 Signed-off-by: Oriol Brufau <obrufau@igalia.com>

…holder` and `::marker` (#322) The `::placeholder` pseudo element should be a public pseudo element. And, both `::placeholder` and `::marker` should have a property restriction as defined in the spec. In stylo, the property restriction has been computed in `PropertyFlags`. Servo PR: servo/servo#43053 Signed-off-by: stevennovaryo <steven.novaryo@gmail.com>

This enables `jump-start`, `jump-end`, `jump-none`, `jump-both`. The feature is left here 7 years ago. As tested with examples, all `step-easing-function`s work as expected. Servo PR: servo/servo#43061 --------- Signed-off-by: Euclid Ye <yezhizhenjiakang@gmail.com> Signed-off-by: Euclid Ye <yezhizhenjiakang@gmail.com>>

This change does two things: 1. Restores Servo's original theme colors from before support for system color was added. 2. Eliminates the selection of default system color based on the color scheme of the system. This code was dead code since `is_dark_color_scheme` always returns `false`. Servo PR: servo/servo#43107 Signed-off-by: Martin Robinson <mrobinson@igalia.com>

Adds a new file `style/device/mod.rs` with the `Device` logic that is common for Gecko and Servo. The Gecko-specific logic for `Device` is moved into `style/device/gecko.rs`, and the previous `style/gecko/media_queries.rs` is removed. The Servo-specific logic for `Device` is moved into `style/device/servo.rs`. The previous `servo/media_queries.rs` also had logic for media features, which is now moved into `style/servo/media_features.rs` for consistency with Gecko. Servo PR: servo/servo#43146 Signed-off-by: Oriol Brufau <obrufau@igalia.com>

This makes Servo use the same `ListStyleType` as Gecko. In particular: - `counter()` and `counters()` will no longer accept a `none` style. - `list-style-type` will now accept a string. - Both `list-style-type` and counters will now accept arbitrary keywords. However, Servo's flavor of Stylo will still reject `@counter-style` rules. So non-predefined keywords will just default to `decimal`. - Both `list-style-type` and counters will now accept `symbols()`. Signed-off-by: Oriol Brufau <obrufau@igalia.com>

This PR enables parsing `first-letter` pseudo element for servo. An accompanying servo PR (servo/servo#43027) is open --------- Signed-off-by: Minghua Wu <michael.wu1107@gmail.com> Signed-off-by: minghuaw <michael.wu1107@gmail.com> Co-authored-by: Oriol Brufau <obrufau@igalia.com>

Signed-off-by: Alex Touchet <26315797+atouchet@users.noreply.github.com>

This isn't really used. Nowadays we always test incremental layout as it's considered an essential feature of the functioning of Servo. After servo/servo#43207, Servo will no longer use this feature. Signed-off-by: Martin Robinson <mrobinson@igalia.com>

The independently versioned crates in this workspace haven't had any changes since the last release according to git.

Already landed upstream: https://bugzilla.mozilla.org/show_bug.cgi?id=2023380 Servo PR: servo/servo#43368 Signed-off-by: Oriol Brufau <obrufau@igalia.com>

#330 moved the module into `style/device` but forgot to remove the old declaration. That's why `cargo fmt` currently fails on `main`: ``` Error writing files: failed to resolve mod `media_queries`: /home/alaska/stylo/style/gecko/media_queries.rs does not exist ``` Signed-off-by: Simon Wülker <simon.wuelker@arcor.de>

We currently never start animations that have no keyframes. That is not correct. While such an animation will never change any styles, it should still fire `animationstart` and `animationend` events at the correct time, and that requires the animation to start first. Servo companion PR: servo/servo#43454 Signed-off-by: Simon Wülker <simon.wuelker@arcor.de>

Loirooriol · 2026-03-23T11:54:06Z

style/servo/animation.rs

                    .iter()
                    .rev()
-                    .position(|step| total_progress as f32 <= 1. - step.start_percentage)
+                    .position(|step| (total_progress as f32) <= 1. - step.start_percentage)


Should this be < too?

Actually we shouldn't. Otherwise for reversed direction at timestamp 0, we jump while we shouldn't for jump-start, jump-both, start.

But there's more severe problem I've been trying to fix based on horrible test results..

Loirooriol · 2026-03-23T14:17:24Z

style/servo/animation.rs

+        // At progress 0, we need to handle step functions specially
+        // for "jump-both, jump-start, start" step functions.
+        if total_progress == 0.0 {
+            if let TimingFunction::Steps(_steps, pos) = &prev_keyframe.timing_function {


I tend to think this seems the wrong place to handle timing functions. Shouldn't it be handled in calculate_step_output()?

It is handled there. But previously never get the chance to reach there (L723) due to early return.

The test result looks decent.

There's only one failure case that I hope to check tomorrow.

Agreed to Oriol. Btw I also find PropertyAnimation below weird, as it's resolving the timing function for every property. I imagine a better process would be:

Use timing_function.calculate_output() to resolve the progress to a resolved_progress, which is number in [0, 1]

Use prev_keyframe if resolved_progress is 0; Use next_keyframe is resolved_progress is 1

Otherwise, calculate a linear interpolation between the two keyframes at resolved_progress

In this way we don't need handle special handling of any timing function here.

Shouldn't it be handled in calculate_step_output()?

fn calculate_step_output() is shared with Firefox. But Firefox doesn't have the problem we have here :/
This PR only changes Servo specific code.

Signed-off-by: Euclid Ye <yezhizhenjiakang@gmail.com>

yezhizhen

We also made early return happen earlier in various cases, instead of proceed to interpolation.

See "Make early return happen earlier" in description.

Signed-off-by: Euclid Ye <yezhizhenjiakang@gmail.com>

yezhizhen · 2026-03-24T05:51:44Z

style/servo/animation.rs

            Some(index) => &self.computed_steps[index],
-            None => return,
+            None => {
+                debug_assert!(false, "next_keyframe_index should always be Some");


This is because:

We always have steps at 0% and 100%

stylo/style/servo/animation.rs

Lines 174 to 175 in a4f1d69

debug_assert!(intermediate_steps.first().unwrap().start_percentage == 0.);

debug_assert!(intermediate_steps.last().unwrap().start_percentage == 1.);

This always exists for total_progress in [0,1), no matter reverse or normal.

style/servo/animation.rs

simonwuelker · 2026-03-24T08:48:37Z

style/servo/animation.rs

+        // Detect zero interval. Prevent division by zero from percentage_between_keyframes.
+        if Some(prev_keyframe_index) == next_keyframe_index {


The % between two keyframes should never be zero, because if it was then IntermediateComputedKeyframe::generate_from_keyframes should have coalesced those two frames.

If you're seeing two keyframes with the same % then I suspect the bug is in that function and not here.

It is not a bug of that function, but the result of index computation.

For example, reverse direction at total_progress == 0.0 can trigger the equality.

Signed-off-by: Euclid Ye <euclid.ye@huawei.com>

xiaochengh · 2026-04-01T07:52:08Z

Looks like there will be some extended discussion regarding the step functions.

Can we split the "early return when possible" part into a different PR and land it first?

delan and others added 26 commits March 5, 2026 04:42

Commit our changes on top of upstream Stylo

a5eabbd

This is a rebase of ab75cec Signed-off-by: Oriol Brufau <obrufau@igalia.com>

Fixup for https://phabricator.services.mozilla.com/D281332

b9eb42d

Signed-off-by: Oriol Brufau <obrufau@igalia.com>

Fixup for https://phabricator.services.mozilla.com/D280938

025b43a

Signed-off-by: Oriol Brufau <obrufau@igalia.com>

Fixup for https://phabricator.services.mozilla.com/D280243

cfae27b

Signed-off-by: Oriol Brufau <obrufau@igalia.com>

Fixup for https://phabricator.services.mozilla.com/D282398

4724d93

Signed-off-by: Oriol Brufau <obrufau@igalia.com>

Fixup for https://phabricator.services.mozilla.com/D284054

a79e275

Signed-off-by: Oriol Brufau <obrufau@igalia.com>

Fixup for https://phabricator.services.mozilla.com/D284378

9202ae5

Signed-off-by: Oriol Brufau <obrufau@igalia.com>

Fixup for https://phabricator.services.mozilla.com/D284172

58f6965

Signed-off-by: Oriol Brufau <obrufau@igalia.com>

Fixup for https://phabricator.services.mozilla.com/D284297

4ddfe54

Signed-off-by: Oriol Brufau <obrufau@igalia.com>

Bump versions

ecf17b5

- Bump stylo_* to 0.13.0 - Bump selectors to 0.36.0 Signed-off-by: Oriol Brufau <obrufau@igalia.com>

Add beforeinput as atom (#326)

f34b80b

Required for firing events for contenteditable Signed-off-by: Tim van der Lippe <tvanderlippe@gmail.com>

Add logic for registering custom properties from script (#325)

1d21770

This way it can be shared among Gecko and Servo. Stylo PR: servo/servo#43085 Upstream: https://bugzilla.mozilla.org/show_bug.cgi?id=2021743 Signed-off-by: Oriol Brufau <obrufau@igalia.com>

Replace Travis CI badge with GitHub workflow (#332)

d38712e

Signed-off-by: Alex Touchet <26315797+atouchet@users.noreply.github.com>

Bump the workspace version (#334)

8278e5a

The independently versioned crates in this workspace haven't had any changes since the last release according to git.

Bump selectors for readme update. (#335)

635e1a1

Adopt "tables inherit color from body quirk" from Gecko (#333)

f9d9406

Already landed upstream: https://bugzilla.mozilla.org/show_bug.cgi?id=2023380 Servo PR: servo/servo#43368 Signed-off-by: Oriol Brufau <obrufau@igalia.com>

yezhizhen changed the title ~~(To be updated) Fix quantization~~ (To be updated) Fix step quantization Mar 23, 2026

Loirooriol reviewed Mar 23, 2026

View reviewed changes

yezhizhen force-pushed the fix-quantization branch from 72f666e to e9c20d2 Compare March 23, 2026 14:13

Loirooriol reviewed Mar 23, 2026

View reviewed changes

yezhizhen force-pushed the fix-quantization branch from e9c20d2 to 82c89aa Compare March 23, 2026 14:29

overhaul

4ecadfc

Signed-off-by: Euclid Ye <yezhizhenjiakang@gmail.com>

yezhizhen force-pushed the fix-quantization branch from 9a19a15 to 61e8a21 Compare March 23, 2026 16:50

raw

ecb0a95

Signed-off-by: Euclid Ye <yezhizhenjiakang@gmail.com>

yezhizhen force-pushed the fix-quantization branch from 61e8a21 to ecb0a95 Compare March 24, 2026 04:59

yezhizhen requested a review from xiaochengh March 24, 2026 05:16

yezhizhen changed the title ~~(To be updated) Fix step quantization~~ Fix CSS step timing functions jump-both, jump-start, start at timestamp 0 Mar 24, 2026

yezhizhen changed the title ~~Fix CSS step timing functions jump-both, jump-start, start at timestamp 0~~ Fix CSS step timing functions jump-both, jump-start, start at timestamp 0 Mar 24, 2026

yezhizhen changed the title ~~Fix CSS step timing functions jump-both, jump-start, start at timestamp 0~~ Fix CSS step timing functions jump-both, jump-start, start at timestamp 0; Early return when possible Mar 24, 2026

yezhizhen commented Mar 24, 2026

View reviewed changes

yezhizhen marked this pull request as ready for review March 24, 2026 05:31

use debug_assert

6d1e8dd

Signed-off-by: Euclid Ye <yezhizhenjiakang@gmail.com>

yezhizhen commented Mar 24, 2026

View reviewed changes

yezhizhen mentioned this pull request Mar 24, 2026

css: Make animation faster, direction-aware and more robust at endpoints servo/servo#43594

Open

simonwuelker reviewed Mar 24, 2026

View reviewed changes

Simon's comment

1a41cbe

Signed-off-by: Euclid Ye <euclid.ye@huawei.com>

yezhizhen force-pushed the fix-quantization branch from 08c6e3f to 1a41cbe Compare March 24, 2026 09:26

Loirooriol force-pushed the main branch from 2159d82 to 6cfce6f Compare April 2, 2026 23:51

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Fix CSS step timing functions `jump-both`, `jump-start`, `start` at timestamp 0; Early return when possible#342

Fix CSS step timing functions `jump-both`, `jump-start`, `start` at timestamp 0; Early return when possible#342
yezhizhen wants to merge 30 commits intomainfrom
fix-quantization

yezhizhen commented Mar 23, 2026 •

edited

Loading

Uh oh!

Loirooriol Mar 23, 2026

Uh oh!

yezhizhen Mar 23, 2026 •

edited

Loading

Uh oh!

Loirooriol Mar 23, 2026

Uh oh!

yezhizhen Mar 23, 2026

Uh oh!

This comment was marked as outdated.

Uh oh!

xiaochengh Mar 30, 2026

Uh oh!

yezhizhen Mar 31, 2026

Uh oh!

yezhizhen left a comment

Uh oh!

yezhizhen Mar 24, 2026

Uh oh!

Uh oh!

simonwuelker Mar 24, 2026

Uh oh!

yezhizhen Mar 24, 2026

Uh oh!

xiaochengh commented Apr 1, 2026

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

11 participants

	debug_assert!(intermediate_steps.first().unwrap().start_percentage == 0.);
	debug_assert!(intermediate_steps.last().unwrap().start_percentage == 1.);

		// Detect zero interval. Prevent division by zero from percentage_between_keyframes.
		if Some(prev_keyframe_index) == next_keyframe_index {

Conversation

yezhizhen commented Mar 23, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Make early return happen earlier:

Uh oh!

Choose a reason for hiding this comment

Uh oh!

yezhizhen Mar 23, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

This comment was marked as outdated.

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

yezhizhen left a comment

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

xiaochengh commented Apr 1, 2026

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

11 participants

yezhizhen commented Mar 23, 2026 •

edited

Loading

yezhizhen Mar 23, 2026 •

edited

Loading