Skip to content

Grouped transform animation vanishes when a round-trip value starts from a float residue #3937

Closed

Description

@didier

I ran into this while porting motion to svelte on top of motion-dom as an experiment, and I think it's a bug.

A looping y: [0, -18, 0] sometimes just vanishes in Chromium. When the grouped transform animation rebuilds mid-cycle, the first keyframe comes back as -1.9387e-30 instead of 0. getEasing only treats an exact 0 as "no change", so it divides by a range of ~1e-30 and you get:

keyframes: ["translateY(-1.9387e-30px)", "translateY(0px)"]
easing:    linear(0 0%, -5.4e+27 0.5%, ...)

Compositor just gives up and the element stops painting.

Quick repro since I can't submit a PR: didier@5742906

Essentially:

animate(element, { y: [0, -18, 0] }, {
    duration: 1.2,
    ease: "easeInOut",
    repeat: Infinity,
    repeatDelay: 0.9,
    delay: 0.66
})

Activity

  1. changed the title [-]grouped transform animation vanishes when a round-trip value starts from a float residue[/-] [+]Grouped transform animation vanishes when a round-trip value starts from a float residue[/+] on Oct 15, 2026
  2. added a commit that references this issue on Oct 16, 2026
    284b77f
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

      Milestone

      No milestone

      Relationships

      None yet

      Development

      No branches or pull requests

      Issue actions