Commit f623278e authored by Vladimir Levin's avatar Vladimir Levin Committed by Commit Bot

SubtreeVisibility: add paint containment.

This patch aligns the code with the new requirement to have paint
containment on subtree-visibility != visible elements.

R=cbiesinger@chromium.org, chrishtr@chromium.org

Change-Id: I0e6b04e013f906b1c52329448f008f365be1a171
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/2144358
Commit-Queue: vmpstr <vmpstr@chromium.org>
Reviewed-by: default avatarChris Harrelson <chrishtr@chromium.org>
Reviewed-by: default avatarChristian Biesinger <cbiesinger@chromium.org>
Cr-Commit-Position: refs/heads/master@{#758067}
parent e4f7c9c7
......@@ -138,10 +138,11 @@ void DisplayLockContext::SetRequestedState(ESubtreeVisibility state) {
void DisplayLockContext::AdjustElementStyle(ComputedStyle* style) const {
if (state_ == ESubtreeVisibility::kVisible)
return;
// If not visible, element gains style and layout containment. If skipped, it
// also gains size containment.
// If not visible, element gains style, layout, and paint containment. If
// skipped, it also gains size containment.
// https://wicg.github.io/display-locking/#subtree-visibility
auto contain = style->Contain() | kContainsStyle | kContainsLayout;
auto contain =
style->Contain() | kContainsStyle | kContainsLayout | kContainsPaint;
if (IsLocked())
contain |= kContainsSize;
style->SetContain(contain);
......
......@@ -33,13 +33,13 @@ function setUp(container) {
test(() => {
setUp(container);
container.classList.add("hidden");
assert_equals(getComputedStyle(container).contain, "size layout style");
assert_equals(getComputedStyle(container).contain, "size layout style paint");
}, "subtree-visibility: hidden adds contain: size layout style;");
async_test((t) => {
setUp(async_container);
async_container.classList.add("auto");
t.step(() => assert_equals(getComputedStyle(async_container).contain, "size layout style"));
t.step(() => assert_equals(getComputedStyle(async_container).contain, "size layout style paint"));
// Considering this as frame 1:
// At frame 2, the container has size-containment, and intersection
// observations will be delivered at the end of that frame.
......@@ -48,31 +48,31 @@ async_test((t) => {
// At frame 4, the container is no longer size-contained since it is visible.
requestAnimationFrame(() => {
// Frame 2 checks:
t.step(() => assert_equals(getComputedStyle(async_container).contain, "size layout style"));
t.step(() => assert_equals(getComputedStyle(async_container).contain, "size layout style paint"));
requestAnimationFrame(() => {
// Frame 3 checks:
t.step(() => assert_equals(getComputedStyle(async_container).contain, "size layout style"));
t.step(() => assert_equals(getComputedStyle(async_container).contain, "size layout style paint"));
requestAnimationFrame(() => {
// Frame 4 checks:
t.step(() => assert_equals(getComputedStyle(async_container).contain, "layout style"));
t.step(() => assert_equals(getComputedStyle(async_container).contain, "layout style paint"));
t.done();
});
});
});
}, "subtree-visibility: auto adds contain: size layout style;");
}, "subtree-visibility: auto adds contain: size layout style paint;");
test(() => {
setUp(container);
container.classList.add("auto");
container.style = "contain: style;";
assert_equals(getComputedStyle(container).contain, "size layout style");
assert_equals(getComputedStyle(container).contain, "size layout style paint");
container.style = "contain: style layout;";
assert_equals(getComputedStyle(container).contain, "size layout style");
assert_equals(getComputedStyle(container).contain, "size layout style paint");
container.style = "";
assert_equals(getComputedStyle(container).contain, "size layout style");
}, "subtree-visibility: auto adds contain: size layout style, can't be overridden");
assert_equals(getComputedStyle(container).contain, "size layout style paint");
}, "subtree-visibility: auto adds contain: size layout style paint, can't be overridden");
test(() => {
setUp(container);
......@@ -83,5 +83,5 @@ test(() => {
assert_equals(getComputedStyle(container).contain, "size layout style paint");
container.style = "contain: content;";
assert_equals(getComputedStyle(container).contain, "size layout style paint");
}, "subtree-visibility adds contain: size layout style and keeps paint if it exists");
}, "subtree-visibility keeps all containment even when shorthands are specified");
</script>
......@@ -15,6 +15,7 @@
position: relative;
width: 150px;
background: lightblue;
contain: paint;
}
#child {
width: 150px;
......
Markdown is supported
0%
or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment