Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Update the web-animations description #2251

Open
wants to merge 2 commits into
base: main
Choose a base branch
from

Conversation

flackr
Copy link
Contributor

@flackr flackr commented Nov 15, 2024

Update the web-animations description to include

  • Construction of an Animation directly
  • Querying and modifying CSS animations and transitions retrieved via getAnimations()

This fixes #2244.

…and modifying CSS animations and transitions.
@github-actions github-actions bot added the feature definition Creating or defining new features or groups of features. label Nov 15, 2024
@ddbeck ddbeck added the blocked Blocked waiting for something external label Nov 19, 2024
Copy link
Contributor

@captainbrosset captainbrosset left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Suggesting some changes to the description.
Also based on my comment here #2244 (comment) I would add the following BCD keys to the feature:

  • api.Document.getAnimations
  • api.Element.getAnimations
  • api.ShadowRoot.getAnimations

Copy link
Collaborator

@ddbeck ddbeck left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

OK, I've caught up on the discussion here and in the original issue. I've got some ideas for the description (to avoid losing the context of Element and such) and an idea to fix the computed status too. Thank you!

@@ -1,5 +1,5 @@
name: Web animations
description: The `animate()` method of `Element` objects programmatically animates elements over time and can synchronize the animations of multiple elements.
description: The `animate()` method, together with the `Animation` interface, animates an element over time, possibly synchronizing the animations of multiple elements. The `getAnimations()` method queries and modifies current CSS animations, transitions, and web animations.
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Hmm, after reading this it's almost as if we're trying to do too much to tease out the individual pieces of the API. Instead, I'm wondering if we can't give an overview and hint at what things to go look up in the docs. What do you think of something like this?

Suggested change
description: The `animate()` method, together with the `Animation` interface, animates an element over time, possibly synchronizing the animations of multiple elements. The `getAnimations()` method queries and modifies current CSS animations, transitions, and web animations.
description: The `animate()` method of `Element` objects, the `document.getAnimations()` method, and the `Animation` interface animate elements over time and coordinate elements' scripted animations, CSS animations, and transitions.

@@ -1,5 +1,5 @@
name: Web animations
description: The `animate()` method of `Element` objects programmatically animates elements over time and can synchronize the animations of multiple elements.
description: The `animate()` method, together with the `Animation` interface, animates an element over time, possibly synchronizing the animations of multiple elements. The `getAnimations()` method queries and modifies current CSS animations, transitions, and web animations.
spec: https://drafts.csswg.org/web-animations-1/
caniuse: web-animation
group: animation
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

It's out of range of the diff, so I can't directly suggest it, but to match the description and fully resolve #2244 we also need to change which keys drive the headline status. This will also line us more closely with caniuse.

You'll need this in the current YAML file:

status:
  compute_from:
    - api.Element.animate
    - api.Animation
    - api.Document.getAnimations

and you'll need to run npm install and npm run dist and commit the results.

@ddbeck ddbeck removed the blocked Blocked waiting for something external label Feb 17, 2025
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
feature definition Creating or defining new features or groups of features.
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Revise web-animations feature
3 participants