Bug 173027 – Pseudo-elements (::after) in shadow roots don't animate

• Status: RESOLVED
• Resolution: FIXED
• Component: CSS

[Keanu Lee]

E.g. Inside a shadow root:

<style>
    div::after {
      display: inline-block;
      content: 'boo';
      animation: spin 1s infinite;
    }
</style>

Repo: http://output.jsbin.com/kuwado

Expected: The text should have a rotate animation.

Actual: It does not.

[Laurent Pellegrino]

The issue is still present in Safari 11.0.2. Any updates?

[Radar WebKit Bug Importer]

<rdar://problem/42842994>

[Antoine Quint]

I tried and this test fails with the new animation code path as well as the old one. The test works fine in Chrome Canary and Firefox Nightly.

[Antoine Quint]

We fail to start the animation under AnimationTimeline::updateCSSAnimationsForElement() because shouldConsiderAnimation() returns false in this statement:

    if (auto* styleScope = Style::Scope::forOrdinal(element, animation.nameStyleScopeOrdinal()))
        return styleScope->resolver().isAnimationNameValid(name);

Indeed, m_keyframesRuleMap is empty and so we cannot validate the animation name.

[Antoine Quint]

Style::Resolver::addKeyframeStyle() is called but not on the same style resolver used in shouldConsiderAnimation().

[Antoine Quint]

Created attachment 400329 [details]
Test

[Antti Koivisto]

Created attachment 401327 [details]
patch

[Antoine Quint]

Comment on attachment 401327 [details]
patch

View in context: https://bugs.webkit.org/attachment.cgi?id=401327&action=review

> Source/WebCore/ChangeLog:15
> +        The keyfram code that computes the style already does this correctly.

Typo: keyfram.

[Antti Koivisto]

Created attachment 401329 [details]
patch

[EWS]

Committed r262711: <https://trac.webkit.org/changeset/262711>

All reviewed patches have been landed. Closing bug and clearing flags on attachment 401329 [details].