forked from mirrors/gecko-dev
9403f169c8
Automatic update from web-platform-tests Implement CompositeBackgroundAttachmentFixed This implements composited background-attachment:fixed when possible. With this feature enabled, if all background-attachment:fixed backgrounds in a frame are composited, the scrollers in the frame won't need repaint on scroll or main-thread scrolling. When possible, background-attachment:fixed background is painted - in the view's transform space; - the display item fills the whole view; - clipped by BackgroundClip (a new paint property node). Bug: 1413872 Change-Id: I334779c4bce086e0407e99fbb85d40656fba565e Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/4443473 Reviewed-by: Philip Rogers <pdr@chromium.org> Reviewed-by: Morten Stenshorne <mstensho@chromium.org> Code-Coverage: Findit <findit-for-me@appspot.gserviceaccount.com> Commit-Queue: Xianzhu Wang <wangxianzhu@chromium.org> Cr-Commit-Position: refs/heads/main@{#1134699} -- wpt-commits: dbffbcf0178a55c2a39a4ce75f2b691cf0e7fbac wpt-pr: 39649
33 lines
1.1 KiB
HTML
33 lines
1.1 KiB
HTML
<!DOCTYPE html>
|
|
<html class="reftest-wait">
|
|
<link rel="help" href="https://www.w3.org/TR/css-break-3/#valdef-box-decoration-break-slice">
|
|
<link rel="help" href="https://www.w3.org/TR/css-backgrounds-3/#background-image">
|
|
<link rel="help" href="https://www.w3.org/TR/css-backgrounds-3/#background-attachment">
|
|
<link rel="match" href="background-attachment-fixed-ref.html">
|
|
<style>
|
|
body {
|
|
overflow: hidden;
|
|
margin: 0;
|
|
}
|
|
</style>
|
|
<div style="height: 300px"></div>
|
|
<div style="width: 320px; height: 200px; columns: 3; column-gap: 10px">
|
|
<div style="height: 600px;
|
|
border: 20px solid transparent;
|
|
box-sizing: border-box;
|
|
padding: 10px;
|
|
background-size: 200px 200px;
|
|
background-image: linear-gradient(blue 50%, green 50%);
|
|
background-clip: content-box;
|
|
background-attachment: fixed">
|
|
</div>
|
|
</div>
|
|
<div style="width: 2000px; height: 2000px"></div>
|
|
<script>
|
|
requestAnimationFrame(() => {
|
|
requestAnimationFrame(() => {
|
|
window.scrollTo(0, 300);
|
|
document.documentElement.classList.remove('reftest-wait');
|
|
});
|
|
});
|
|
</script>
|