Active animations should effectively imply equivalent will-change

#41412936 Filed 2018-09-10 P4 / S5 Area: Blink > Animation / Paint

Summary

The web-animations spec says a property targeted by a current or in-effect animation should act as if will-change includes it. Blink did this for opacity and transform, but filter and backdrop-filter animations did not establish a containing block for fixed / absolutely positioned descendants the way will-change: filter does.

This only shows while the animation is current but not in effect -- most obviously during its start delay. A running filter animation applies a filter value every frame, so the element is already a containing block; only the delay exposes the missing side effect.

Expected vs actual

EXPECTED A position: fixed child inside an element with an active filter animation is contained by that element (positioned relative to it), matching will-change: filter.

ACTUAL (unpatched) The fixed child escapes to the viewport because the animated element is not treated as a containing block.

Live reproducer

Each dashed amber box is an .ancestor holding a red position: fixed child pinned to top:0; left:0. If the ancestor is a containing block, the red box sits at its top-left; otherwise the red box jumps to the viewport's top-left corner.

Baseline: will-change: filter

fixed child
Always a containing block. Red box should stay inside.

Test: filter animation in start delay

fixed child
Animation targets filter but is still in a 1h delay (no filter applied). Should behave like the baseline once the fix ships.
Measuring...

Links

Issue 41412936

web-animations: animation side effects

filter-effects-1: filter creates a containing block