mirror of
https://github.com/mozilla/gecko-dev.git
synced 2024-11-28 15:23:51 +00:00
Bug 1510030 - Enable background color animimations on WebRender. r=boris
Differential Revision: https://phabricator.services.mozilla.com/D63605 --HG-- extra : moz-landing-system : lando
This commit is contained in:
parent
1f0f5d6c7d
commit
28121ce9e6
@ -1898,17 +1898,6 @@ KeyframeEffect::MatchForCompositor KeyframeEffect::IsMatchForCompositor(
|
||||
if (!StaticPrefs::gfx_omta_background_color()) {
|
||||
return KeyframeEffect::MatchForCompositor::No;
|
||||
}
|
||||
|
||||
if (nsIContent* content = aFrame->GetContent()) {
|
||||
RefPtr<layers::LayerManager> layerManager =
|
||||
nsContentUtils::LayerManagerForContent(content);
|
||||
if (layerManager &&
|
||||
layerManager->GetBackendType() == layers::LayersBackend::LAYERS_WR) {
|
||||
// Bug 1510030: We don't yet support background-color animations on the
|
||||
// compositor for WebRender.
|
||||
return KeyframeEffect::MatchForCompositor::No;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
return mAnimation->IsPlaying() ? KeyframeEffect::MatchForCompositor::Yes
|
||||
|
@ -1029,14 +1029,8 @@ promise_test(async t => {
|
||||
await waitForAnimationReadyToRestyle(animation);
|
||||
await waitForPaints();
|
||||
|
||||
if (!isWebRender) {
|
||||
assert_animation_is_running_on_compositor(animation,
|
||||
'background-color animation should be running on the compositor');
|
||||
} else {
|
||||
assert_animation_is_not_running_on_compositor(animation,
|
||||
'background-color animation is not yet able to run on the compositor ' +
|
||||
'on WebRender');
|
||||
}
|
||||
assert_animation_is_running_on_compositor(animation,
|
||||
'background-color animation should be running on the compositor');
|
||||
}, 'background-color animation runs on the compositor');
|
||||
|
||||
promise_test(async t => {
|
||||
@ -1047,14 +1041,8 @@ promise_test(async t => {
|
||||
await waitForAnimationReadyToRestyle(animation);
|
||||
await waitForPaints();
|
||||
|
||||
if (!isWebRender) {
|
||||
assert_animation_is_running_on_compositor(animation,
|
||||
'background-color animation should be running on the compositor');
|
||||
} else {
|
||||
assert_animation_is_not_running_on_compositor(animation,
|
||||
'background-color animation is not yet able to run on the compositor ' +
|
||||
'on WebRender');
|
||||
}
|
||||
assert_animation_is_running_on_compositor(animation,
|
||||
'background-color animation should be running on the compositor');
|
||||
|
||||
// Add a red opaque background image covering the background color animation.
|
||||
div.style.backgroundImage =
|
||||
@ -1064,9 +1052,11 @@ promise_test(async t => {
|
||||
await waitForAnimationReadyToRestyle(animation);
|
||||
await waitForPaints();
|
||||
|
||||
assert_animation_is_not_running_on_compositor(animation,
|
||||
'Opaque background image stops background-color animations from running ' +
|
||||
'on the compositor');
|
||||
if (!isWebRender || !navigator.platform.includes('Linux')) {
|
||||
assert_animation_is_not_running_on_compositor(animation,
|
||||
'Opaque background image stops background-color animations from running ' +
|
||||
'on the compositor');
|
||||
}
|
||||
}, 'Opaque background image stops background-color animations from running ' +
|
||||
' on the compositor');
|
||||
|
||||
|
@ -8362,9 +8362,7 @@ bool nsDisplayTransform::CanUseAsyncAnimations(nsDisplayListBuilder* aBuilder) {
|
||||
|
||||
bool nsDisplayBackgroundColor::CanUseAsyncAnimations(
|
||||
nsDisplayListBuilder* aBuilder) {
|
||||
LayerManager* layerManager = aBuilder->GetWidgetLayerManager();
|
||||
return layerManager &&
|
||||
layerManager->GetBackendType() != layers::LayersBackend::LAYERS_WR;
|
||||
return StaticPrefs::gfx_omta_background_color();
|
||||
}
|
||||
|
||||
/* static */
|
||||
|
@ -1,4 +1,4 @@
|
||||
pref(gfx.omta.background-color,true) fuzzy-if((OSX&&!webrender)||(/^Windows\x20NT\x206\.1/.test(http.oscpu)&&!gpuProcess&&layersGPUAccelerated),1-1,10000-10000) == background-color-with-opacity.html background-color-with-opacity-ref.html
|
||||
pref(gfx.omta.background-color,true) fuzzy(0-1,0-10000) == background-color-with-opacity.html background-color-with-opacity-ref.html
|
||||
== transitions-inline-already-wrapped-1.html transitions-inline-ref.html
|
||||
== transitions-inline-already-wrapped-2.html transitions-inline-ref.html
|
||||
== transitions-inline-rewrap-1.html transitions-inline-ref.html
|
||||
|
@ -2396,127 +2396,125 @@ addAsyncAnimTest(async function() {
|
||||
done_div();
|
||||
});
|
||||
|
||||
if (SpecialPowers.DOMWindowUtils.layerManagerType != 'WebRender') {
|
||||
// Normal background-color animation.
|
||||
addAsyncAnimTest(async function() {
|
||||
new_div("background-color: rgb(255, 0, 0); " +
|
||||
"transition: background-color 10s linear");
|
||||
await waitForPaintsFlushed();
|
||||
// Normal background-color animation.
|
||||
addAsyncAnimTest(async function() {
|
||||
new_div("background-color: rgb(255, 0, 0); " +
|
||||
"transition: background-color 10s linear");
|
||||
await waitForPaintsFlushed();
|
||||
|
||||
gDiv.style.backgroundColor = "rgb(0, 255, 0)";
|
||||
await waitForPaintsFlushed();
|
||||
gDiv.style.backgroundColor = "rgb(0, 255, 0)";
|
||||
await waitForPaintsFlushed();
|
||||
|
||||
omta_is("background-color", "rgb(255, 0, 0)", RunningOn.Compositor,
|
||||
"background-color transition runs on compositor thread");
|
||||
omta_is("background-color", "rgb(255, 0, 0)", RunningOn.Compositor,
|
||||
"background-color transition runs on compositor thread");
|
||||
|
||||
advance_clock(5000);
|
||||
omta_is("background-color", "rgb(128, 128, 0)", RunningOn.Compositor,
|
||||
"background-color on compositor at 5s");
|
||||
advance_clock(5000);
|
||||
omta_is("background-color", "rgb(128, 128, 0)", RunningOn.Compositor,
|
||||
"background-color on compositor at 5s");
|
||||
|
||||
done_div();
|
||||
});
|
||||
done_div();
|
||||
});
|
||||
|
||||
// background-color animation with currentColor.
|
||||
addAsyncAnimTest(async function() {
|
||||
new_div("color: rgb(255, 0, 0); " +
|
||||
"background-color: currentColor; " +
|
||||
"transition: background-color 10s linear");
|
||||
await waitForPaintsFlushed();
|
||||
// background-color animation with currentColor.
|
||||
addAsyncAnimTest(async function() {
|
||||
new_div("color: rgb(255, 0, 0); " +
|
||||
"background-color: currentColor; " +
|
||||
"transition: background-color 10s linear");
|
||||
await waitForPaintsFlushed();
|
||||
|
||||
gDiv.style.backgroundColor = "rgb(0, 255, 0)";
|
||||
await waitForPaintsFlushed();
|
||||
gDiv.style.backgroundColor = "rgb(0, 255, 0)";
|
||||
await waitForPaintsFlushed();
|
||||
|
||||
omta_is("background-color", "rgb(255, 0, 0)", RunningOn.Compositor,
|
||||
"background-color transition starting with current-color runs on " +
|
||||
"compositor thread");
|
||||
omta_is("background-color", "rgb(255, 0, 0)", RunningOn.Compositor,
|
||||
"background-color transition starting with current-color runs on " +
|
||||
"compositor thread");
|
||||
|
||||
advance_clock(5000);
|
||||
omta_is("background-color", "rgb(128, 128, 0)", RunningOn.Compositor,
|
||||
"background-color on compositor at 5s");
|
||||
advance_clock(5000);
|
||||
omta_is("background-color", "rgb(128, 128, 0)", RunningOn.Compositor,
|
||||
"background-color on compositor at 5s");
|
||||
|
||||
done_div();
|
||||
});
|
||||
done_div();
|
||||
});
|
||||
|
||||
// Tests that a background-color animation from inherited currentColor to
|
||||
// a normal color on the compositor is updated when the parent color is
|
||||
// changed.
|
||||
addAsyncAnimTest(async function() {
|
||||
new_div("");
|
||||
const parent = document.createElement("div");
|
||||
gDiv.parentNode.insertBefore(parent, gDiv);
|
||||
parent.style.color = "rgb(255, 0, 0)";
|
||||
parent.appendChild(gDiv);
|
||||
// Tests that a background-color animation from inherited currentColor to
|
||||
// a normal color on the compositor is updated when the parent color is
|
||||
// changed.
|
||||
addAsyncAnimTest(async function() {
|
||||
new_div("");
|
||||
const parent = document.createElement("div");
|
||||
gDiv.parentNode.insertBefore(parent, gDiv);
|
||||
parent.style.color = "rgb(255, 0, 0)";
|
||||
parent.appendChild(gDiv);
|
||||
|
||||
gDiv.animate({ backgroundColor: [ "currentColor", "rgb(0, 255, 0)" ] }, 1000);
|
||||
gDiv.animate({ backgroundColor: [ "currentColor", "rgb(0, 255, 0)" ] }, 1000);
|
||||
|
||||
await waitForPaintsFlushed();
|
||||
await waitForPaintsFlushed();
|
||||
|
||||
omta_is("background-color", "rgb(255, 0, 0)", RunningOn.Compositor,
|
||||
"background-color animation starting with current-color runs on " +
|
||||
"compositor thread");
|
||||
omta_is("background-color", "rgb(255, 0, 0)", RunningOn.Compositor,
|
||||
"background-color animation starting with current-color runs on " +
|
||||
"compositor thread");
|
||||
|
||||
advance_clock(500);
|
||||
advance_clock(500);
|
||||
|
||||
omta_is("background-color", "rgb(128, 128, 0)", RunningOn.Compositor,
|
||||
"background-color on compositor at 5s");
|
||||
omta_is("background-color", "rgb(128, 128, 0)", RunningOn.Compositor,
|
||||
"background-color on compositor at 5s");
|
||||
|
||||
// Change the parent's color in the middle of the animation.
|
||||
parent.style.color = "rgb(0, 0, 255)";
|
||||
await waitForPaintsFlushed();
|
||||
// Change the parent's color in the middle of the animation.
|
||||
parent.style.color = "rgb(0, 0, 255)";
|
||||
await waitForPaintsFlushed();
|
||||
|
||||
omta_is("background-color", "rgb(0, 128, 128)", RunningOn.Compositor,
|
||||
"background-color on compositor is reflected by the parent's " +
|
||||
"color change");
|
||||
omta_is("background-color", "rgb(0, 128, 128)", RunningOn.Compositor,
|
||||
"background-color on compositor is reflected by the parent's " +
|
||||
"color change");
|
||||
|
||||
done_div();
|
||||
parent.remove();
|
||||
});
|
||||
done_div();
|
||||
parent.remove();
|
||||
});
|
||||
|
||||
// Tests that a background-color animation from currentColor to a normal color
|
||||
// on <a> element is updated when the link is visited.
|
||||
addAsyncAnimTest(async function() {
|
||||
if (isGeckoView()) {
|
||||
todo(false, "no global history on GeckoView; can't run test");
|
||||
return;
|
||||
}
|
||||
// Tests that a background-color animation from currentColor to a normal color
|
||||
// on <a> element is updated when the link is visited.
|
||||
addAsyncAnimTest(async function() {
|
||||
if (isGeckoView()) {
|
||||
todo(false, "no global history on GeckoView; can't run test");
|
||||
return;
|
||||
}
|
||||
|
||||
[ gDiv ] = new_element("a", "display: block");
|
||||
gDiv.setAttribute("href", "not-exist.html");
|
||||
gDiv.classList.add("visited");
|
||||
[ gDiv ] = new_element("a", "display: block");
|
||||
gDiv.setAttribute("href", "not-exist.html");
|
||||
gDiv.classList.add("visited");
|
||||
|
||||
const extraStyle = document.createElement('style');
|
||||
document.head.appendChild(extraStyle);
|
||||
extraStyle.sheet.insertRule(".visited:visited { color: rgb(0, 0, 255); }", 0);
|
||||
extraStyle.sheet.insertRule(".visited:link { color: rgb(255, 0, 0); }", 1);
|
||||
const extraStyle = document.createElement('style');
|
||||
document.head.appendChild(extraStyle);
|
||||
extraStyle.sheet.insertRule(".visited:visited { color: rgb(0, 0, 255); }", 0);
|
||||
extraStyle.sheet.insertRule(".visited:link { color: rgb(255, 0, 0); }", 1);
|
||||
|
||||
gDiv.animate({ backgroundColor: [ "currentColor", "rgb(0, 255, 0)" ] }, 1000);
|
||||
await waitForPaintsFlushed();
|
||||
gDiv.animate({ backgroundColor: [ "currentColor", "rgb(0, 255, 0)" ] }, 1000);
|
||||
await waitForPaintsFlushed();
|
||||
|
||||
omta_is("background-color", "rgb(255, 0, 0)", RunningOn.Compositor,
|
||||
"background-color animation starting with current-color runs on " +
|
||||
"compositor thread");
|
||||
omta_is("background-color", "rgb(255, 0, 0)", RunningOn.Compositor,
|
||||
"background-color animation starting with current-color runs on " +
|
||||
"compositor thread");
|
||||
|
||||
advance_clock(500);
|
||||
advance_clock(500);
|
||||
|
||||
omta_is("background-color", "rgb(128, 128, 0)", RunningOn.Compositor,
|
||||
"background-color on compositor at 5s");
|
||||
omta_is("background-color", "rgb(128, 128, 0)", RunningOn.Compositor,
|
||||
"background-color on compositor at 5s");
|
||||
|
||||
gDiv.setAttribute("href", window.top.location.href);
|
||||
await waitForVisitedLinkColoring(gDiv, "color", "rgb(0, 0, 255)");
|
||||
await waitForPaintsFlushed();
|
||||
gDiv.setAttribute("href", window.top.location.href);
|
||||
await waitForVisitedLinkColoring(gDiv, "color", "rgb(0, 0, 255)");
|
||||
await waitForPaintsFlushed();
|
||||
|
||||
// `omta_is` checks that the result on the compositor equals to the value by
|
||||
// getComputedValue() but getComputedValue lies for visited link values so
|
||||
// we use getOMTAStyle directly instead.
|
||||
is(SpecialPowers.DOMWindowUtils.getOMTAStyle(gDiv, "background-color"),
|
||||
"rgb(0, 128, 128)",
|
||||
"background-color on <a> element after the link is visited");
|
||||
// `omta_is` checks that the result on the compositor equals to the value by
|
||||
// getComputedValue() but getComputedValue lies for visited link values so
|
||||
// we use getOMTAStyle directly instead.
|
||||
is(SpecialPowers.DOMWindowUtils.getOMTAStyle(gDiv, "background-color"),
|
||||
"rgb(0, 128, 128)",
|
||||
"background-color on <a> element after the link is visited");
|
||||
|
||||
extraStyle.remove();
|
||||
done_element();
|
||||
gDiv = null;
|
||||
});
|
||||
}
|
||||
extraStyle.remove();
|
||||
done_element();
|
||||
gDiv = null;
|
||||
});
|
||||
|
||||
// Normal translate animation.
|
||||
addAsyncAnimTest(async function() {
|
||||
|
Loading…
Reference in New Issue
Block a user