KeyframeEffect

Web animations web-animations

Baseline: Widely available on the web, in every major browser since Sep 2020, and long enough to count on (since Mar 2023).

niso: Partial 91%. 3301 of 3589 subtests pass, by system: Linux 91%, macOS 91%. Engines: QuickJS, the engine niso's WPT run uses; Node and Porffor have no recorded run. WPT results recorded at f3b4fa8, 2026-11-10; web-features 3.45.0. WPT tests · niso's support · Animation, AnimationEffect, AnimationPlaybackEvent, AnimationTimeline

KeyframeEffect is an interface in idl/web-animations.webidl, inheriting AnimationEffect, exposed in Window. What it does is on MDN; this page says what niso has of it.

Keyframes cross flattened: for each keyframe its offset (“” for null), easing, composite and property count, then property, value pairs. Those going in name CSS properties; those coming out, from keyframes(), add the computed offset after the offset and name IDL attributes.

Status

The web features its members belong to, each with its Baseline status on the web and how much of the feature’s WPT suite passes in niso (see Web platform support).

Feature	On the web	In niso	Members
Web animations	Widely available	Partial 91% 3301 of 3589 subtests pass	7

Members

constructor

constructor

[NisoGlue] constructor(Element? target, object? keyframes, optional (unrestricted double or KeyframeEffectOptions) options = {});

target

attribute

attribute Element? target;

int32_t niso_keyframe_effect_get_target(niso_dom* dom, niso_handle self, niso_handle* out);
int32_t niso_keyframe_effect_set_target(niso_dom* dom, niso_handle self, niso_handle value);

pseudoElement

attribute

attribute DOMString? pseudoElement;

int32_t niso_keyframe_effect_get_pseudo_element(niso_dom* dom, niso_handle self, niso_str* out);
int32_t niso_keyframe_effect_set_pseudo_element(niso_dom* dom, niso_handle self, const char* value, size_t value_len);

composite

attribute

attribute CompositeOperation composite;

int32_t niso_keyframe_effect_get_composite(niso_dom* dom, niso_handle self, niso_str* out);
int32_t niso_keyframe_effect_set_composite(niso_dom* dom, niso_handle self, const char* value, size_t value_len);

getKeyframes()

operation

[NisoGlue] sequence<object> getKeyframes();

setKeyframes()

operation

[NisoGlue] undefined setKeyframes(object? keyframes);

create()

static operation not in JS

[NisoInternal] static KeyframeEffect create(Element? target);

int32_t niso_keyframe_effect_create(niso_dom* dom, niso_handle target, niso_handle* out);

copy()

static operation not in JS

[NisoInternal] static KeyframeEffect copy(KeyframeEffect source);

int32_t niso_keyframe_effect_copy(niso_dom* dom, niso_handle source, niso_handle* out);

keyframes()

operation not in JS

[NisoInternal] sequence<DOMString> keyframes();

int32_t niso_keyframe_effect_keyframes(niso_dom* dom, niso_handle self, niso_strs* out);

replaceKeyframes()

operation not in JS

[NisoInternal] undefined replaceKeyframes(sequence<DOMString> keyframes);

int32_t niso_keyframe_effect_replace_keyframes(niso_dom* dom, niso_handle self, const niso_str* keyframes, size_t keyframes_len);

propertyName()

static operation not in JS

[NisoInternal] static DOMString? propertyName(DOMString attribute);

int32_t niso_keyframe_effect_property_name(niso_dom* dom, const char* attribute, size_t attribute_len, niso_str* out);

The animatable CSS property an IDL attribute name in a keyframe names, or null.

checkEasing()

static operation not in JS

[NisoInternal] static undefined checkEasing(DOMString easing);

int32_t niso_keyframe_effect_check_easing(niso_dom* dom, const char* easing, size_t easing_len);

Not in niso yet

Members the web has, by the BCD keys web-features 3.45.0 lists, that idl/ doesn’t declare. The list is partial: web-features lists only the keys it maps to a feature.

• iterationComposite (iterationComposite)