Skip to content

Commit

Permalink
Layout shift detection for fixed position
Browse files Browse the repository at this point in the history
With paint properties geometry mapping, we can already correctly detect
layout shift of fixed-position elements because the viewport scroll
offset doesn't exist in the paint property chain of fixed-position
elements.

Also removed the unnecessary layout viewport clip because it's already
applied in LocalToAncestorClipRect to the LayoutView property tree
state.

Change-Id: I0d77bb4fc828b495536b03f8674d8cab35d0f8bd
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/2520330
Reviewed-by: Steve Kobes <skobes@chromium.org>
Commit-Queue: Xianzhu Wang <wangxianzhu@chromium.org>
Cr-Commit-Position: refs/heads/master@{#824480}
  • Loading branch information
wangxianzhu authored and chromium-wpt-export-bot committed Nov 5, 2020
1 parent d64a0cd commit 3a36f4a
Showing 1 changed file with 27 additions and 0 deletions.
27 changes: 27 additions & 0 deletions layout-instability/fixed-position-move.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,27 @@
<!DOCTYPE html>
<title>Layout Instability: movement of fixed position</title>
<link rel="help" href="https://wicg.github.io/layout-instability/" />
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="resources/util.js"></script>
<div id="target" style="position: fixed; top: 100px; width: 300px; height: 200px; background: yellow">
</div>
<script>
promise_test(async () => {
const watcher = new ScoreWatcher;

// Wait for the initial render to complete.
await waitForAnimationFrames(2);

// Modify the position of the div.
target.style.top = '200px';

const expectedScore = computeExpectedScore(300 * (200 + 100), 100);

// Observer fires after the frame is painted.
assert_equals(watcher.score, 0);
await watcher.promise;
assert_equals(watcher.score, expectedScore);
}, 'Movement of fixed position');

</script>

0 comments on commit 3a36f4a

Please sign in to comment.