diff --git a/features/animation-composition.yml b/features/animation-composition.yml index 804bfe774e..af98b0889a 100644 --- a/features/animation-composition.yml +++ b/features/animation-composition.yml @@ -1,3 +1,4 @@ name: animation-composition description: The `animation-composition` CSS property chooses how to combine animations that affect the same property. spec: https://drafts.csswg.org/css-animations-2/#animation-composition +group: animation diff --git a/features/css-animations.yml b/features/css-animations.yml new file mode 100644 index 0000000000..5b3d877842 --- /dev/null +++ b/features/css-animations.yml @@ -0,0 +1,51 @@ +name: CSS Animations +description: The `animation` CSS property animates an element's style over time, using keyframes described in `@keyframes` rules. +spec: https://drafts.csswg.org/css-animations-2/ +caniuse: css-animation +group: + - animation + - css +status: + compute_from: css.properties.animation +compat_features: + - api.AnimationEvent + - api.AnimationEvent.AnimationEvent + - api.AnimationEvent.animationName + - api.AnimationEvent.elapsedTime + - api.AnimationEvent.pseudoElement + - api.CSSAnimation + - api.CSSAnimation.animationName + - api.CSSKeyframeRule + - api.CSSKeyframeRule.keyText + - api.CSSKeyframeRule.style + - api.CSSKeyframesRule + - api.CSSKeyframesRule.appendRule + - api.CSSKeyframesRule.cssRules + - api.CSSKeyframesRule.deleteRule + - api.CSSKeyframesRule.findRule + - api.CSSKeyframesRule.length + - api.CSSKeyframesRule.name + - css.at-rules.keyframes + - css.properties.animation + - css.properties.animation-delay + - css.properties.animation-direction + - css.properties.animation-direction.alternate + - css.properties.animation-direction.alternate-reverse + - css.properties.animation-direction.normal + - css.properties.animation-direction.reverse + - css.properties.animation-duration + - css.properties.animation-duration.auto + - css.properties.animation-fill-mode + - css.properties.animation-fill-mode.backwards + - css.properties.animation-fill-mode.both + - css.properties.animation-fill-mode.forwards + - css.properties.animation-fill-mode.none + - css.properties.animation-iteration-count + - css.properties.animation-iteration-count.infinite + - css.properties.animation-name + - css.properties.animation-name.none + - css.properties.animation-play-state + - css.properties.animation-play-state.paused + - css.properties.animation-play-state.running + - css.properties.animation-timing-function + - css.properties.animation-timing-function.jump diff --git a/features/css-animations.yml.dist b/features/css-animations.yml.dist new file mode 100644 index 0000000000..70374d72e3 --- /dev/null +++ b/features/css-animations.yml.dist @@ -0,0 +1,182 @@ +# Generated from: css-animations.yml +# Do not edit this file by hand. Edit the source file instead! + +status: + baseline: high + baseline_low_date: 2015-09-30 + baseline_high_date: 2018-03-30 + support: + chrome: "43" + chrome_android: "43" + edge: "12" + firefox: "16" + firefox_android: "16" + safari: "9" + safari_ios: "9" +compat_features: + # baseline: high + # baseline_low_date: 2015-09-30 + # baseline_high_date: 2018-03-30 + # support: + # chrome: "43" + # chrome_android: "43" + # edge: "12" + # firefox: "5" + # firefox_android: "5" + # safari: "9" + # safari_ios: "9" + - api.AnimationEvent + - api.AnimationEvent.animationName + - api.AnimationEvent.elapsedTime + + # ⬇️ Same status as overall feature ⬇️ + # baseline: high + # baseline_low_date: 2015-09-30 + # baseline_high_date: 2018-03-30 + # support: + # chrome: "43" + # chrome_android: "43" + # edge: "12" + # firefox: "16" + # firefox_android: "16" + # safari: "9" + # safari_ios: "9" + - css.at-rules.keyframes + - css.properties.animation + - css.properties.animation-delay + - css.properties.animation-direction + - css.properties.animation-direction.alternate + - css.properties.animation-direction.alternate-reverse + - css.properties.animation-direction.normal + - css.properties.animation-direction.reverse + - css.properties.animation-duration + - css.properties.animation-fill-mode + - css.properties.animation-fill-mode.backwards + - css.properties.animation-fill-mode.both + - css.properties.animation-fill-mode.forwards + - css.properties.animation-fill-mode.none + - css.properties.animation-iteration-count + - css.properties.animation-iteration-count.infinite + - css.properties.animation-name + - css.properties.animation-name.none + - css.properties.animation-play-state + - css.properties.animation-play-state.paused + - css.properties.animation-play-state.running + - css.properties.animation-timing-function + + # baseline: high + # baseline_low_date: 2016-08-02 + # baseline_high_date: 2019-02-02 + # support: + # chrome: "31" + # chrome_android: "31" + # edge: "12" + # firefox: "48" + # firefox_android: "48" + # safari: "9" + # safari_ios: "9" + - api.CSSKeyframeRule + - api.CSSKeyframeRule.keyText + - api.CSSKeyframeRule.style + + # baseline: high + # baseline_low_date: 2016-08-02 + # baseline_high_date: 2019-02-02 + # support: + # chrome: "31" + # chrome_android: "31" + # edge: "12" + # firefox: "48" + # firefox_android: "48" + # safari: "9.1" + # safari_ios: "9.3" + - api.CSSKeyframesRule + - api.CSSKeyframesRule.cssRules + - api.CSSKeyframesRule.deleteRule + - api.CSSKeyframesRule.findRule + - api.CSSKeyframesRule.name + + # baseline: high + # baseline_low_date: 2016-08-02 + # baseline_high_date: 2019-02-02 + # support: + # chrome: "41" + # chrome_android: "41" + # edge: "12" + # firefox: "48" + # firefox_android: "48" + # safari: "9.1" + # safari_ios: "9.3" + - api.CSSKeyframesRule.appendRule + + # baseline: high + # baseline_low_date: 2016-08-02 + # baseline_high_date: 2019-02-02 + # support: + # chrome: "43" + # chrome_android: "43" + # edge: "14" + # firefox: "23" + # firefox_android: "23" + # safari: "9" + # safari_ios: "9" + - api.AnimationEvent.AnimationEvent + + # baseline: high + # baseline_low_date: 2020-03-24 + # baseline_high_date: 2022-09-24 + # support: + # chrome: "68" + # chrome_android: "68" + # edge: "79" + # firefox: "23" + # firefox_android: "23" + # safari: "13.1" + # safari_ios: "13.4" + - api.AnimationEvent.pseudoElement + + # baseline: high + # baseline_low_date: 2020-07-28 + # baseline_high_date: 2023-01-28 + # support: + # chrome: "84" + # chrome_android: "84" + # edge: "84" + # firefox: "75" + # firefox_android: "79" + # safari: "13.1" + # safari_ios: "13.4" + - api.CSSAnimation + - api.CSSAnimation.animationName + + # baseline: high + # baseline_low_date: 2020-09-16 + # baseline_high_date: 2023-03-16 + # support: + # chrome: "77" + # chrome_android: "77" + # edge: "79" + # firefox: "65" + # firefox_android: "65" + # safari: "14" + # safari_ios: "14" + - css.properties.animation-timing-function.jump + + # baseline: low + # baseline_low_date: 2024-03-22 + # support: + # chrome: "123" + # chrome_android: "123" + # edge: "123" + # firefox: "109" + # firefox_android: "109" + # safari: "17" + # safari_ios: "17" + - api.CSSKeyframesRule.length + + # baseline: false + # support: + # chrome: "115" + # chrome_android: "115" + # edge: "115" + - css.properties.animation-duration.auto diff --git a/features/scroll-driven-animations.yml b/features/scroll-driven-animations.yml index e385936963..7fb22158ee 100644 --- a/features/scroll-driven-animations.yml +++ b/features/scroll-driven-animations.yml @@ -1,7 +1,9 @@ name: Scroll-driven animations description: CSS scroll-driven animations are a type of CSS animations that don't run over time, but are instead driven by the user's scroll position. spec: https://drafts.csswg.org/scroll-animations-1/ -group: scrolling +group: + - scrolling + - animation compat_features: - api.ScrollTimeline - api.ScrollTimeline.axis diff --git a/features/svg-animations.yml b/features/svg-animations.yml new file mode 100644 index 0000000000..58d88c6850 --- /dev/null +++ b/features/svg-animations.yml @@ -0,0 +1,99 @@ +name: SVG animations +description: The ``, ``, and `` SVG elements declaratively animate SVG elements. Also known as SMIL. +spec: https://svgwg.org/specs/animations/ +caniuse: svg-smil +group: + - animation + - svg +# Most features are quite old, but only became baseline when Edge adopted Chromium. +status: + compute_from: api.SVGAnimateElement + +compat_features: + - api.SVGAnimateColorElement + - api.SVGAnimateElement + - api.SVGAnimateMotionElement + - api.SVGAnimateTransformElement + - api.SVGAnimatedAngle + - api.SVGAnimatedAngle.animVal + - api.SVGAnimatedAngle.baseVal + - api.SVGAnimatedBoolean + - api.SVGAnimatedBoolean.animVal + - api.SVGAnimatedBoolean.baseVal + - api.SVGAnimatedEnumeration + - api.SVGAnimatedEnumeration.animVal + - api.SVGAnimatedEnumeration.baseVal + - api.SVGAnimatedInteger + - api.SVGAnimatedInteger.animVal + - api.SVGAnimatedInteger.baseVal + - api.SVGAnimatedLength + - api.SVGAnimatedLength.animVal + - api.SVGAnimatedLength.baseVal + - api.SVGAnimatedLengthList + - api.SVGAnimatedLengthList.animVal + - api.SVGAnimatedLengthList.baseVal + - api.SVGAnimatedNumber + - api.SVGAnimatedNumber.animVal + - api.SVGAnimatedNumber.baseVal + - api.SVGAnimatedNumberList + - api.SVGAnimatedNumberList.animVal + - api.SVGAnimatedNumberList.baseVal + - api.SVGAnimatedPreserveAspectRatio + - api.SVGAnimatedPreserveAspectRatio.animVal + - api.SVGAnimatedPreserveAspectRatio.baseVal + - api.SVGAnimatedRect + - api.SVGAnimatedRect.animVal + - api.SVGAnimatedRect.baseVal + - api.SVGAnimatedString + - api.SVGAnimatedString.animVal + - api.SVGAnimatedString.baseVal + - api.SVGAnimatedTransformList + - api.SVGAnimatedTransformList.animVal + - api.SVGAnimatedTransformList.baseVal + - api.SVGAnimationElement + - api.SVGAnimationElement.beginElement + - api.SVGAnimationElement.beginElementAt + - api.SVGAnimationElement.beginEvent_event + - api.SVGAnimationElement.endElement + - api.SVGAnimationElement.endElementAt + - api.SVGAnimationElement.endEvent_event + - api.SVGAnimationElement.getCurrentTime + - api.SVGAnimationElement.getSimpleDuration + - api.SVGAnimationElement.getStartTime + - api.SVGAnimationElement.repeatEvent_event + - api.SVGAnimationElement.requiredExtensions + - api.SVGAnimationElement.systemLanguage + - api.SVGAnimationElement.targetElement + - api.SVGPolygonElement.animatedPoints + - api.SVGPolylineElement.animatedPoints + - api.SVGSVGElement.animationsPaused + - api.SVGSVGElement.pauseAnimations + - api.SVGSVGElement.unpauseAnimations + - svg.elements.animate + - svg.elements.animate.attributeName + - svg.elements.animate.attributeType + - svg.elements.animate.dur + - svg.elements.animate.fill + - svg.elements.animate.from + - svg.elements.animate.href + - svg.elements.animate.repeatCount + - svg.elements.animate.systemLanguage + - svg.elements.animate.to + - svg.elements.animateMotion + - svg.elements.animateMotion.calcMode + - svg.elements.animateMotion.fill + - svg.elements.animateMotion.href + - svg.elements.animateMotion.keyPoints + - svg.elements.animateMotion.origin + - svg.elements.animateMotion.path + - svg.elements.animateMotion.rotate + - svg.elements.animateMotion.systemLanguage + - svg.elements.animateTransform + - svg.elements.animateTransform.by + - svg.elements.animateTransform.fill + - svg.elements.animateTransform.from + - svg.elements.animateTransform.href + - svg.elements.animateTransform.systemLanguage + - svg.elements.animateTransform.to + - svg.elements.animateTransform.type + - svg.global_attributes.class.animation_support diff --git a/features/svg-animations.yml.dist b/features/svg-animations.yml.dist new file mode 100644 index 0000000000..0cad9b86bf --- /dev/null +++ b/features/svg-animations.yml.dist @@ -0,0 +1,380 @@ +# Generated from: svg-animations.yml +# Do not edit this file by hand. Edit the source file instead! + +status: + baseline: high + baseline_low_date: 2020-01-15 + baseline_high_date: 2022-07-15 + support: + chrome: "2" + chrome_android: "18" + edge: "79" + firefox: "4" + firefox_android: "4" + safari: "3" + safari_ios: "1" +compat_features: + # baseline: high + # baseline_low_date: 2015-07-29 + # baseline_high_date: 2018-01-29 + # support: + # chrome: "1" + # chrome_android: "18" + # edge: "12" + # firefox: "1.5" + # firefox_android: "4" + # safari: "3" + # safari_ios: "1" + - api.SVGAnimatedAngle + - api.SVGAnimatedAngle.animVal + - api.SVGAnimatedAngle.baseVal + - api.SVGAnimatedEnumeration + - api.SVGAnimatedEnumeration.animVal + - api.SVGAnimatedEnumeration.baseVal + - api.SVGAnimatedLength + - api.SVGAnimatedLength.animVal + - api.SVGAnimatedLength.baseVal + - api.SVGAnimatedLengthList + - api.SVGAnimatedLengthList.animVal + - api.SVGAnimatedLengthList.baseVal + - api.SVGAnimatedNumber + - api.SVGAnimatedNumber.animVal + - api.SVGAnimatedNumber.baseVal + - api.SVGAnimatedRect + - api.SVGPolygonElement.animatedPoints + - api.SVGPolylineElement.animatedPoints + - api.SVGSVGElement.pauseAnimations + - api.SVGSVGElement.unpauseAnimations + + # baseline: high + # baseline_low_date: 2015-07-29 + # baseline_high_date: 2018-01-29 + # support: + # chrome: "1" + # chrome_android: "18" + # edge: "12" + # firefox: "1.5" + # firefox_android: "4" + # safari: ≤4 + # safari_ios: "1" + - api.SVGAnimatedString + - api.SVGAnimatedString.animVal + - api.SVGAnimatedString.baseVal + - api.SVGAnimatedTransformList + - api.SVGAnimatedTransformList.animVal + - api.SVGAnimatedTransformList.baseVal + + # baseline: high + # baseline_low_date: 2015-07-29 + # baseline_high_date: 2018-01-29 + # support: + # chrome: "1" + # chrome_android: "18" + # edge: "12" + # firefox: "15" + # firefox_android: "15" + # safari: "3" + # safari_ios: "1" + - api.SVGAnimatedRect.animVal + - api.SVGAnimatedRect.baseVal + + # baseline: high + # baseline_low_date: 2015-07-29 + # baseline_high_date: 2018-01-29 + # support: + # chrome: "5" + # chrome_android: "18" + # edge: "12" + # firefox: "1.5" + # firefox_android: "4" + # safari: "5" + # safari_ios: "4" + - api.SVGAnimatedPreserveAspectRatio + + # baseline: high + # baseline_low_date: 2015-07-29 + # baseline_high_date: 2018-01-29 + # support: + # chrome: "5" + # chrome_android: "18" + # edge: "12" + # firefox: "22" + # firefox_android: "22" + # safari: "6" + # safari_ios: "6" + - api.SVGAnimatedPreserveAspectRatio.animVal + - api.SVGAnimatedPreserveAspectRatio.baseVal + + # baseline: high + # baseline_low_date: 2015-07-29 + # baseline_high_date: 2018-01-29 + # support: + # chrome: "6" + # chrome_android: "18" + # edge: "12" + # firefox: "1.5" + # firefox_android: "4" + # safari: "5" + # safari_ios: "4" + - api.SVGAnimatedNumberList + + # baseline: high + # baseline_low_date: 2015-07-29 + # baseline_high_date: 2018-01-29 + # support: + # chrome: "6" + # chrome_android: "18" + # edge: "12" + # firefox: "3" + # firefox_android: "4" + # safari: "5" + # safari_ios: "4" + - api.SVGAnimatedBoolean + - api.SVGAnimatedInteger + + # baseline: high + # baseline_low_date: 2015-07-29 + # baseline_high_date: 2018-01-29 + # support: + # chrome: "6" + # chrome_android: "18" + # edge: "12" + # firefox: "3" + # firefox_android: "4" + # safari: "6" + # safari_ios: "6" + - api.SVGAnimatedBoolean.animVal + - api.SVGAnimatedBoolean.baseVal + - api.SVGAnimatedInteger.animVal + - api.SVGAnimatedInteger.baseVal + - api.SVGAnimatedNumberList.animVal + - api.SVGAnimatedNumberList.baseVal + + # baseline: high + # baseline_low_date: 2020-01-15 + # baseline_high_date: 2022-07-15 + # support: + # chrome: "1" + # chrome_android: "18" + # edge: "79" + # firefox: "1.5" + # firefox_android: "4" + # safari: "3" + # safari_ios: "1" + - api.SVGSVGElement.animationsPaused + + # ⬇️ Same status as overall feature ⬇️ + # baseline: high + # baseline_low_date: 2020-01-15 + # baseline_high_date: 2022-07-15 + # support: + # chrome: "2" + # chrome_android: "18" + # edge: "79" + # firefox: "4" + # firefox_android: "4" + # safari: "3" + # safari_ios: "1" + - api.SVGAnimateElement + - api.SVGAnimateTransformElement + - api.SVGAnimationElement + - svg.elements.animateTransform.fill + + # baseline: high + # baseline_low_date: 2020-01-15 + # baseline_high_date: 2022-07-15 + # support: + # chrome: "2" + # chrome_android: "18" + # edge: "79" + # firefox: "4" + # firefox_android: "4" + # safari: "3" + # safari_ios: "2" + - svg.elements.animateTransform.by + - svg.elements.animateTransform.from + - svg.elements.animateTransform.to + - svg.elements.animateTransform.type + + # baseline: high + # baseline_low_date: 2020-01-15 + # baseline_high_date: 2022-07-15 + # support: + # chrome: "2" + # chrome_android: "18" + # edge: "79" + # firefox: "4" + # firefox_android: "4" + # safari: "3.1" + # safari_ios: "2" + - svg.elements.animate.fill + + # baseline: high + # baseline_low_date: 2020-01-15 + # baseline_high_date: 2022-07-15 + # support: + # chrome: "2" + # chrome_android: "18" + # edge: "79" + # firefox: "4" + # firefox_android: "4" + # safari: "4" + # safari_ios: "3.2" + - api.SVGAnimationElement.beginElement + - api.SVGAnimationElement.beginElementAt + - api.SVGAnimationElement.endElement + - api.SVGAnimationElement.endElementAt + - api.SVGAnimationElement.getCurrentTime + - api.SVGAnimationElement.getSimpleDuration + - api.SVGAnimationElement.getStartTime + - api.SVGAnimationElement.targetElement + - svg.elements.animate.attributeName + - svg.elements.animate.attributeType + - svg.elements.animate.dur + - svg.elements.animate.from + - svg.elements.animate.repeatCount + - svg.elements.animate.to + + # baseline: high + # baseline_low_date: 2020-01-15 + # baseline_high_date: 2022-07-15 + # support: + # chrome: "2" + # chrome_android: "18" + # edge: "79" + # firefox: "12" + # firefox_android: "14" + # safari: "3" + # safari_ios: "1" + - api.SVGAnimationElement.requiredExtensions + - api.SVGAnimationElement.systemLanguage + - svg.elements.animateTransform.systemLanguage + + # baseline: high + # baseline_low_date: 2020-01-15 + # baseline_high_date: 2022-07-15 + # support: + # chrome: "2" + # chrome_android: "18" + # edge: "79" + # firefox: "12" + # firefox_android: "14" + # safari: "3.1" + # safari_ios: "2" + - svg.elements.animate.systemLanguage + + # baseline: high + # baseline_low_date: 2020-01-15 + # baseline_high_date: 2022-07-15 + # support: + # chrome: "5" + # chrome_android: "18" + # edge: "79" + # firefox: "5" + # firefox_android: "5" + # safari: "4" + # safari_ios: "3.2" + - svg.global_attributes.class.animation_support + + # baseline: high + # baseline_low_date: 2020-01-15 + # baseline_high_date: 2022-07-15 + # support: + # chrome: "19" + # chrome_android: "25" + # edge: "79" + # firefox: "4" + # firefox_android: "4" + # safari: "6" + # safari_ios: "6" + - api.SVGAnimateMotionElement + - svg.elements.animateMotion.calcMode + - svg.elements.animateMotion.fill + - svg.elements.animateMotion.keyPoints + - svg.elements.animateMotion.origin + - svg.elements.animateMotion.path + - svg.elements.animateMotion.rotate + + # baseline: high + # baseline_low_date: 2020-01-15 + # baseline_high_date: 2022-07-15 + # support: + # chrome: "19" + # chrome_android: "25" + # edge: "79" + # firefox: "12" + # firefox_android: "14" + # safari: "6" + # safari_ios: "6" + - svg.elements.animateMotion.systemLanguage + + # baseline: high + # baseline_low_date: ≤2020-01-15 + # baseline_high_date: ≤2022-07-15 + # support: + # chrome: "2" + # chrome_android: "18" + # edge: ≤79 + # firefox: "4" + # firefox_android: "4" + # safari: "3" + # safari_ios: "1" + - svg.elements.animateTransform + + # baseline: high + # baseline_low_date: ≤2020-01-15 + # baseline_high_date: ≤2022-07-15 + # support: + # chrome: "2" + # chrome_android: "18" + # edge: ≤79 + # firefox: "4" + # firefox_android: "4" + # safari: "3.1" + # safari_ios: "2" + - svg.elements.animate + + # baseline: high + # baseline_low_date: ≤2020-01-15 + # baseline_high_date: ≤2022-07-15 + # support: + # chrome: "19" + # chrome_android: "25" + # edge: ≤79 + # firefox: "4" + # firefox_android: "4" + # safari: "6" + # safari_ios: "6" + - svg.elements.animateMotion + + # baseline: high + # baseline_low_date: ≤2020-01-15 + # baseline_high_date: ≤2022-07-15 + # support: + # chrome: "50" + # chrome_android: "50" + # edge: ≤79 + # firefox: "51" + # firefox_android: "51" + # safari: "12.1" + # safari_ios: "12.2" + - svg.elements.animate.href + - svg.elements.animateMotion.href + - svg.elements.animateTransform.href + + # baseline: false + # support: + # chrome: "35" + # chrome_android: "35" + # edge: "79" + # firefox: "93" + # firefox_android: "93" + - api.SVGAnimationElement.beginEvent_event + - api.SVGAnimationElement.endEvent_event + - api.SVGAnimationElement.repeatEvent_event + + # baseline: false + # support: + # safari: "3" + # safari_ios: "1" + - api.SVGAnimateColorElement diff --git a/features/web-animations.yml b/features/web-animations.yml index 283d21e52e..3ab0660128 100644 --- a/features/web-animations.yml +++ b/features/web-animations.yml @@ -1,6 +1,70 @@ name: Web animations -description: The web animations API allows you to animate and synchronize the animations of DOM elements. +description: The Web Animations API programmatically animates elements over time, and allows you to synchronize the animations of multiple elements in JavaScript. spec: https://drafts.csswg.org/web-animations-1/ caniuse: web-animation +group: animation status: compute_from: api.Element.animate +compat_features: + - api.Element.animate + - api.Animation + - api.Animation.Animation + - api.Animation.cancel + - api.Animation.cancel_event + - api.Animation.currentTime + - api.Animation.finish + - api.Animation.finish_event + - api.Animation.id + - api.Animation.pause + - api.Animation.play + - api.Animation.playState + - api.Animation.playbackRate + - api.Animation.reverse + - api.Animation.startTime + - api.Animation.effect + - api.AnimationEffect + - api.AnimationEffect.getComputedTiming + - api.AnimationEffect.getTiming + - api.AnimationEffect.updateTiming + - api.KeyframeEffect + - api.KeyframeEffect.KeyframeEffect + - api.KeyframeEffect.target + - api.Animation.pending + - api.Animation.updatePlaybackRate + - api.Animation.finished + - api.Animation.ready + - api.AnimationPlaybackEvent + - api.AnimationPlaybackEvent.AnimationPlaybackEvent + - api.AnimationPlaybackEvent.currentTime + - api.AnimationPlaybackEvent.timelineTime + - api.KeyframeEffect.getKeyframes + - api.KeyframeEffect.setKeyframes + - api.Animation.commitStyles + - api.Animation.persist + - api.Animation.remove_event + - api.Animation.replaceState + - api.Animation.timeline + - api.AnimationTimeline + - api.AnimationTimeline.currentTime + - api.Document.timeline + - api.DocumentTimeline + - api.DocumentTimeline.DocumentTimeline + - api.Document.getAnimations + - api.KeyframeEffect.pseudoElement + - api.KeyframeEffect.composite + - api.KeyframeEffect.iterationComposite + - api.Animation.remove_filling_animation + - api.Element.animate.implicit_tofrom + - api.Element.animate.options_composite_parameter + - api.Element.animate.options_id_parameter + - api.Element.animate.options_iterationComposite_parameter + - api.Element.animate.options_pseudoElement_parameter + - api.Element.animate.options_rangeEnd_parameter + - api.Element.animate.options_rangeStart_parameter + - api.Element.animate.options_timeline_parameter + - api.Element.animationend_event + - api.Element.animationiteration_event + - api.Element.animationstart_event + - api.Element.animationcancel_event + - api.Element.getAnimations + - api.ShadowRoot.getAnimations diff --git a/features/web-animations.yml.dist b/features/web-animations.yml.dist index 4d737c313d..e0beb1924c 100644 --- a/features/web-animations.yml.dist +++ b/features/web-animations.yml.dist @@ -14,6 +14,21 @@ status: safari: "13.1" safari_ios: "13.4" compat_features: + # baseline: high + # baseline_low_date: 2019-12-17 + # baseline_high_date: 2022-06-17 + # support: + # chrome: "79" + # chrome_android: "79" + # edge: "18" + # firefox: "51" + # firefox_android: "51" + # safari: "9" + # safari_ios: "9" + - api.Element.animationend_event + - api.Element.animationiteration_event + - api.Element.animationstart_event + # ⬇️ Same status as overall feature ⬇️ # baseline: high # baseline_low_date: 2020-03-24 @@ -28,6 +43,19 @@ compat_features: # safari_ios: "13.4" - api.Element.animate + # baseline: high + # baseline_low_date: 2020-03-24 + # baseline_high_date: 2022-09-24 + # support: + # chrome: "50" + # chrome_android: "50" + # edge: "79" + # firefox: "48" + # firefox_android: "48" + # safari: "13.1" + # safari_ios: "13.4" + - api.Element.animate.options_id_parameter + # baseline: high # baseline_low_date: 2020-03-24 # baseline_high_date: 2022-09-24 @@ -134,6 +162,7 @@ compat_features: - api.Animation.commitStyles - api.Animation.persist - api.Animation.remove_event + - api.Animation.remove_filling_animation - api.Animation.replaceState - api.Animation.timeline - api.AnimationTimeline @@ -141,6 +170,7 @@ compat_features: - api.Document.timeline - api.DocumentTimeline - api.DocumentTimeline.DocumentTimeline + - api.Element.getAnimations # baseline: high # baseline_low_date: 2020-09-16 @@ -154,7 +184,9 @@ compat_features: # safari: "14" # safari_ios: "14" - api.Document.getAnimations + - api.Element.animate.options_pseudoElement_parameter - api.KeyframeEffect.pseudoElement + - api.ShadowRoot.getAnimations # baseline: low # baseline_low_date: 2022-09-12 @@ -166,8 +198,35 @@ compat_features: # firefox_android: "80" # safari: "16" # safari_ios: "16" + - api.Element.animate.options_composite_parameter - api.KeyframeEffect.composite + # baseline: false + # support: + # chrome: "84" + # chrome_android: "84" + # edge: "84" + # firefox: "75" + # firefox_android: "79" + - api.Element.animate.implicit_tofrom + + # baseline: false + # support: + # chrome: "85" + # chrome_android: "85" + # edge: "85" + # safari: "16" + # safari_ios: "16" + - api.Element.animate.options_timeline_parameter + + # baseline: false + # support: + # firefox: "54" + # firefox_android: "54" + # safari: "13.1" + # safari_ios: "13.4" + - api.Element.animationcancel_event + # baseline: false # support: # firefox: "80" @@ -175,3 +234,17 @@ compat_features: # safari: "16.4" # safari_ios: "16.4" - api.KeyframeEffect.iterationComposite + + # baseline: false + # support: + # chrome: "115" + # chrome_android: "115" + # edge: "115" + - api.Element.animate.options_rangeEnd_parameter + - api.Element.animate.options_rangeStart_parameter + + # baseline: false + # support: + # firefox: "80" + # firefox_android: "80" + - api.Element.animate.options_iterationComposite_parameter diff --git a/groups/animation.yml b/groups/animation.yml new file mode 100644 index 0000000000..ad8e7d09cd --- /dev/null +++ b/groups/animation.yml @@ -0,0 +1,2 @@ +name: Animation +#description: Methods of moving elements.