Skip to content

Dispatch finite CSS animation events and release host frame demand #113

Description

@wieslawsoltes

Problem

The unchanged VS Code OSS 1.137 browser workbench uses a finite CSS keyframe animation on its language-status icon and removes the wiggle class from an animationend listener. WebScene advances the finite keyframes but never dispatches CSS animationstart, animationiteration, or animationend events. The listener therefore cannot perform its normal cleanup.

A new packaged idle-presentation gate exposed a nondeterministic failure: after the 15-second settled warm-up the visible app sometimes continues presenting at about 120 Hz for the complete five-second sample (608 presents / 5.064 s), while hidden demand is zero. A traced passing run identifies the relevant node as:

span.codicon.codicon-bracket.wiggle
layout: 1208.61, 921, 16, 16
animation-duration: 800ms
animation-iteration-count: 1
rotation keyframes active

VS Code source attaches animationend and removes .wiggle. Chromium dispatches that event; WebScene currently only retains and dispatches transition events.

Required implementation

  • Retain CSS animation event records separately from transition events.
  • Dispatch browser-shaped animationstart, animationiteration, animationend, and cancellation where the implemented animation lifecycle can prove them.
  • Populate animationName, elapsedTime, pseudoElement, bubbles, and cancelable consistently with the platform contract.
  • Dispatch each finite terminal event once even when style recascade/layout occurs during a frame.
  • Allow an animationend listener to remove the triggering class without restarting the completed animation or retaining host frame demand.

Regression and performance gates

  1. Add a native V8 product-neutral regression with a visible finite rotation keyframe, animationend listener, and class removal. Advance host timestamps past the duration and require one event, removed class, and zero host animation-frame demand.
  2. Cover a recascade during the finite animation so its start timestamp and terminal event are stable.
  3. Add/expand a WPT-style CSS animation event contract and compare with Chromium.
  4. Run the packaged Code OSS performance scenario repeatedly. Each run must pass the 5 presents/s visible and 2 presents/s hidden settled-idle budgets, plus the existing CPU, memory, latency, cascade/layout, publication, and panel-mutation budgets.
  5. Re-run fixed-editor visual parity because the status icon is visible in the compared workbench.

Evidence

  • Failing package: artifacts/release-83026140-performance/performance-summary.json
  • Diagnostic traces: artifacts/diagnose-active-animation*
  • Parent gate commit: 83026140
  • WebScene consolidation: 7015c27f
  • AppScene: 581b870
  • Code OSS: 645f29cc / 1.137.0

The implementation belongs in WebScene. VS Code must remain unchanged.

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