<!DOCTYPE html><title> In effect animations should effectively apply will-change (i.e. force a stacking context) (ref)</title><linkrel="help"href="https://drafts.csswg.org/web-animations-1/#side-effects-section"><linkrel="author"href="mailto:bokan@chromium.org"><style>.testcase{position:relative;margin:2px;border:1pxsolidblack;width:250px;height:25px;}.label{flex-grow:1;}.container{background-color:lightgrey;margin:4px;display:flex;width:600px;flex-direction:row;justify-content:flex-end;align-items:center;}.pass{width:100%;height:100%;background-color:limegreen;}</style><!-- OPACITY --><!-- Is current - before phase playing forwards --><divclass="container"><divclass="label">Opacity - before phase</div><divclass="testcase"id="opacity-before"><divclass="pass"></div></div></div><!-- Is current - in play--><divclass="container"><divclass="label">Opacity - active phase</div><divclass="testcase"id="opacity-active"><divclass="pass"></div></div></div><!-- Is current - after phase playing backwards--><divclass="container"><divclass="label">Opacity - after phase</div><divclass="testcase"id="opacity-after"><divclass="pass"></div></div></div><!-- TRANSFORM --><!-- Is current - before phase playing forwards --><divclass="container"><divclass="label">Transform - before phase</div><divclass="testcase"id="transform-before"><divclass="pass"></div></div></div><!-- Is current - in play--><divclass="container"><divclass="label">Transform - active phase</div><divclass="testcase"id="transform-active"><divclass="pass"></div></div></div><!-- Is current - after phase playing backwards--><divclass="container"><divclass="label">Transform - after phase</div><divclass="testcase"id="transform-after"><divclass="pass"></div></div></div><!-- BACKGROUND COLOR --><divclass="container"><divclass="label">Background-color - before phase</div><divclass="testcase"id="bgcolor-before"><divclass="pass"></div></div></div><!-- Is current - in play--><divclass="container"><divclass="label">Background-color - active phase</div><divclass="testcase"id="bgcolor-active"><divclass="pass"></div></div></div><!-- Is current - after phase playing backwards--><divclass="container"><divclass="label">Background-color - after phase</div><divclass="testcase"id="bgcolor-after"><divclass="pass"></div></div></div>
