Hover color transition does not work with incremental layout

[jdm]

<style>
div { transition: color .17s; color: black }
div:hover { color: red; }
</style>
<div>hi there</div>

When run with -i, the color changes to red (with no intervening interpolated colors). Without -i, the text never changes color.

[moonlightdrive]

Hi @jdm I'd like to take a look at this one. Do you have any advice on where to start?

[mbrubeck]

For bugs in incremental layout, my first step is to check that the correct "restyle damage" is inserted when an element's style changes. For CSS transitions, the style change happens in update_style_for_animation. I notice this method's doc comment talks about a damage parameter that no longer exists since 6d67525, which makes me suspicious that this is a regression from that commit.

It looks like it's now up to the caller of update_style_for_animation to insert the correct damage. The function is called in two places: layout::animation::recalc_style_for_animations and style::matching::process_animations. Using a debugger or adding some logging to these functions should help determine which is getting called, and what restyle damage they are inserting.

The restyle damage is calculated based on the differences between "old" and "new" styles (i.e. the computed values before and after the change is applied). Glancing at this code, I'm suspicious that this is taking a snapshot of the "old" values after the animation has been applied to them.

[mrobinson]

This was fixed by #26407. I believe the reason this was failing was that the fragment that contained the text was inheriting the style from its containing box. The code that updated the style for transitions in the layout thread didn't descend into children when updating transitioning inherited properties. Now that animations update style during restyle, inheritance should work properly.