Commit 35544747 authored by Aleks Totic's avatar Aleks Totic Committed by Commit Bot

[Layout] bugfix: Update scrollable area after overflow recalc

Bug is:

  <container overflow:scroll>
    <target transform:scale(1)>

Initially, container's scrollbars are disabled.
When target changes its scale and grows outside of container,
scrollbars were not updated.
Fix #1 is to call UpdateScrollbarEnabledState. This resulted in
scrollbars being painted, but not clickable.
Fix #2, calling UpdateScrollableAreaSet makes scrollbars
clickable too.
Fix #2 was an educated guess.

Bug: 926167
Change-Id: I02454047c87aaecede9c56db1c02bbd1b21b15c5
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/1704218
Commit-Queue: Aleks Totic <atotic@chromium.org>
Reviewed-by: default avatarStefan Zager <szager@chromium.org>
Cr-Commit-Position: refs/heads/master@{#681091}
parent 8b34445d
......@@ -1229,6 +1229,7 @@ void PaintLayerScrollableArea::UpdateAfterStyleChange(
void PaintLayerScrollableArea::UpdateAfterOverflowRecalc() {
UpdateScrollDimensions();
UpdateScrollbarProportions();
UpdateScrollbarEnabledState();
bool needs_horizontal_scrollbar;
bool needs_vertical_scrollbar;
......@@ -1249,6 +1250,7 @@ void PaintLayerScrollableArea::UpdateAfterOverflowRecalc() {
}
ClampScrollOffsetAfterOverflowChange();
UpdateScrollableAreaSet();
}
IntRect PaintLayerScrollableArea::RectForHorizontalScrollbar(
......
<!DOCTYPE html>
<link rel="help" href="https://crbug.com/926167">
<style>
#container {
width: 200px;
height: 150px;
border: 1px solid black;
overflow: scroll;
}
#target {
width: 100px;
height: 50px;
background: green;
transform: scale(4);
}
</style>
<!-- -->
<div id="container">
<div id="target"></div>
</div>
<!DOCTYPE html>
<title>CSS Overflow: css-overflow-3</title>
<link rel="author" href="mailto:atotic@google.com">
<link rel="help" href="https://crbug.com/926167">
<link rel="match" href="scrollbars-chrome-bug-001-ref.html">
<meta name="assert" content="scrollbars keep up to date with a changing transform">
<style>
#container {
width: 200px;
height: 150px;
border: 1px solid black;
overflow: scroll;
}
#target {
width: 100px;
height: 50px;
background: green;
transform: scale(1);
}
</style>
<!-- -->
<div id="container">
<div id="target"></div>
</div>
<script>
// 1st transform triggers layer creation, and full layout.
// 2nd transform just updates overflow, which does not update scrollbars.
// This triggers the bug.
document.body.offsetTop;
document.querySelector("#target").style.transform = "scale(1.5)";
document.body.offsetTop;
document.querySelector("#target").style.transform = "scale(4.0)";
</script>
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