Capybara.disable_animation also disables view transitions

[eric-eye]

Problem

Animations provided by the View Transition API are not disabled when Capybara.disable_animations is set. This can lead to Capybara not being able to interact with certain elements before a view transition has completed.

For a personal project, this manifested as an input which could not be clicked until the transition completed, even though the page content could be ready.

Potential Solution

I wanted to see what it would look like to do the simplest thing possible with Capybara::Server::AnimationDisabler to cover view transitions. While this works, it does betray the "selector" feature of disable_animations, as this behaves the same way even if a selector is supplied as if it were set to true.

As I understand it, the View Transition API's CSS pseudo-selectors do not allow animation characteristics (such as animation-duration) to be changed for individual elements in the normal DOM tree. Instead, they are controlled via named view transitions and pseudo-selectors that exist in their own tree. Transition names also cannot be applied to more than one element, so using a broad selector to assign dummy transition names would likely cause bugs.

I'm curious what others think about this. I didn't want to add a lot of complexity to this API without getting some early feedback. But a couple of possibilities I'd considered:

1. Provide a new config option and extend the AnimationDisabler middleware to support it
2. Provide a new config option and add a new middleware which behaves similarly to AnimationDisabler

I may also be mistaken about not being able to use existing selector-driven approach. If this could be made to work, then that would simplify this problem quite a bit.

[eric-eye]

https://developer.mozilla.org/en-US/docs/Web/CSS/::view-transition-group

My intention is that this would cover the root animation and any named animations.

[eric-eye]

The sequence of events:

1. User clicks link
2. Button slowly fades into view
3. Clicking button reveals a message

I chose this flow because even with animations, the browser is still rendering the content immediately and can be "seen" by Capybara. Issuing a click, however, will not be possible for elements which are animating.