Actually I wanted to use this bug for fixing test_restyles.html but I accidentally update patches to bug 1413817. :/ I should note comments about test_restyles.html in bug 1413817, but that bug is too long already. Anyway, I found another cumbersome case there. That is 'necessary_update_should_be_invoked'. https://hg.mozilla.org/mozilla-central/file/f0c0fb9182d6/dom/animation/test/mozilla/file_restyles.html#l708 The test case is pretty simple (simpler than others). add_task(async function necessary_update_should_be_invoked() { var div = addDiv(null, { style: 'animation: background-color 100s' }); var animation = div.getAnimations()[0]; await animation.ready; await waitForAnimationFrames(5); // Apply another animation style div.style.animation = 'background-color 110s'; var animation = div.getAnimations()[0]; var markers = await observeStyling(5); is(markers.length, 5, 'Applying animation style with different duration ' + 'should cause restyles on every frame.'); await ensureElementRemoval(div); }); In this test case, we observe 4 restyles instead of 5. That's because when we changed animation style and called getAnimations(), it's in the state between requestAnimationFrame handling and styling process. So once we called getAnimations() there all pending restyles has processed there, and then in the next tick there is no need to process restyle. So, what happens if we drop getAnimations() call there? In stylo, we get 2 restyle markers in the next first tick. Yeah, I can explain that. The first one is for animation-only restyle before applying the new animation style. And the second one is for the second animation-only restyle after applying the new style. Whereas in gecko, we get 3 restyles. I can't explain that. :/

(In reply to Hiroyuki Ikezoe (:hiro) from comment #1) > Actually I wanted to use this bug for fixing test_restyles.html but I > accidentally update patches to bug 1413817. :/ > > I should note comments about test_restyles.html in bug 1413817, but that > bug is too long already. Anyway, I found another cumbersome case there. > That is 'necessary_update_should_be_invoked'. > > https://hg.mozilla.org/mozilla-central/file/f0c0fb9182d6/dom/animation/test/ > mozilla/file_restyles.html#l708 > > The test case is pretty simple (simpler than others). > > add_task(async function necessary_update_should_be_invoked() { > var div = addDiv(null, { style: 'animation: background-color 100s' }); > var animation = div.getAnimations()[0]; > await animation.ready; > await waitForAnimationFrames(5); > // Apply another animation style > div.style.animation = 'background-color 110s'; > var animation = div.getAnimations()[0]; > var markers = await observeStyling(5); > is(markers.length, 5, > 'Applying animation style with different duration ' + > 'should cause restyles on every frame.'); > await ensureElementRemoval(div); > }); > > In this test case, we observe 4 restyles instead of 5. That's because when > we changed animation style and called getAnimations(), it's in the state > between requestAnimationFrame handling and styling process. So once we > called getAnimations() there all pending restyles has processed there, and > then in the next tick there is no need to process restyle. in the *same* tick.

In gecko the three restyles come from 1) EffectCompositor::AddStyleUpdatesTo() which is called from GeckoRestyleManager::UpdateOnlyAnimationStyles() This is equivalent to the first animation-only restyle in stylo. 2) GeckoRestyleManager::ProcessPendingRestyles() right after UpdateOnlyAnimationStyles() This is the one additional restyle. This is done apart from 1) since it UpdateOnlyAnimationStyles() uses its own RestyleTracker. Also I guess this may be a bug in gecko, but there might be some cases that UpdateOnlyAnimationStyles does not cover. 3) UpdateOldAnimationPropertiesWithNew() This is for the new animation style. This symptoms is independent from the conformant Promise handling (bug 1193394), so I am going to reuse this bug for fixing this issue.

Comment on attachment 8928390 [details] Bug 1415729 - Use arrow function in file_restyles.html. https://reviewboard.mozilla.org/r/199598/#review204696 This patch has been moved from bug 1388560. It's been already gotten r+ though.

Comment on attachment 8928390 [details] Bug 1415729 - Use arrow function in file_restyles.html. https://reviewboard.mozilla.org/r/199598/#review204698

Comment on attachment 8928391 [details] Bug 1415729 - Make 'necessary_update_should_be_invoked' test in file_restyles.html more strict. https://reviewboard.mozilla.org/r/199600/#review204700 ::: commit-message-f0381:1 (Diff revision 1) > +Bug 1415729 - Make 'necessary_update_should_be_invoked' test in file_restyles.html more strictier. r?birtles Nit: more strict ::: dom/animation/test/mozilla/file_restyles.html:728 (Diff revision 1) > + } else { > + // There should be three restyles. > + // 1) Animation-only restyle for before applying the new animation style > + // 2) Restyle for applying the new animation style > + // Note: In gecko styling for animations is not separated. > + // 3) Restyle for the new animation 3) Restyle triggered by updating an existing animation (specifically the animation-duration) ?

Thanks!

Pushed by hikezoe@mozilla.com: https://hg.mozilla.org/integration/autoland/rev/feaa174ea944 Use arrow function in file_restyles.html. r=birtles https://hg.mozilla.org/integration/autoland/rev/3d72237c5a0f Make 'necessary_update_should_be_invoked' test in file_restyles.html more strict. r=birtles

https://hg.mozilla.org/mozilla-central/rev/feaa174ea944 https://hg.mozilla.org/mozilla-central/rev/3d72237c5a0f