WebKit Bugzilla
Attachment 360715 Details for
Bug 191816
: [css-scroll-snap] scroll-snap-align not honored on child with non-visible overflow
Home
|
New
|
Browse
|
Search
|
[?]
|
Reports
|
Requests
|
Help
|
New Account
|
Log In
Remember
[x]
|
Forgot Password
Login:
[x]
[patch]
Patch
bug-191816-20190131124207.patch (text/plain), 9.11 KB, created by
Frédéric Wang (:fredw)
on 2019-01-31 03:42:09 PST
(
hide
)
Description:
Patch
Filename:
MIME Type:
Creator:
Frédéric Wang (:fredw)
Created:
2019-01-31 03:42:09 PST
Size:
9.11 KB
patch
obsolete
>Subversion Revision: 240707 >diff --git a/Source/WebCore/ChangeLog b/Source/WebCore/ChangeLog >index 120c31f46a3df27188261e5363cdaad3648ac205..ec7cdb63a8d36b05050864ecdbb97c2aa71248e6 100644 >--- a/Source/WebCore/ChangeLog >+++ b/Source/WebCore/ChangeLog >@@ -1,3 +1,31 @@ >+2019-01-31 Frederic Wang <fwang@igalia.com> >+ >+ [css-scroll-snap] scroll-snap-align not honored on child with non-visible overflow >+ https://bugs.webkit.org/show_bug.cgi?id=191816 >+ >+ Reviewed by NOBODY (OOPS!). >+ >+ This patch fixes a bug that prevents children of a scroll container to create snap positions >+ when they have non-visible overflow. This happens because for such a child, the function >+ RenderBox::findEnclosingScrollableContainer() will return the child itself rather than the >+ scroll container. To address that issue, we introduce a new >+ RenderObject::enclosingScrollableContainerForSnapping() helper function that ensures that >+ a real RenderBox ancestor is returned. >+ >+ Test: css3/scroll-snap/scroll-snap-children-with-overflow.html >+ >+ * page/scrolling/AxisScrollSnapOffsets.cpp: >+ (WebCore::updateSnapOffsetsForScrollableArea): Use enclosingScrollableContainerForSnapping() >+ so that we don't skip children with non-visible overflow. >+ * rendering/RenderLayerModelObject.cpp: >+ (WebCore::RenderLayerModelObject::styleDidChange): Ditto. The new function calls >+ enclosingBox(). >+ * rendering/RenderObject.cpp: >+ (WebCore::RenderObject::enclosingScrollableContainerForSnapping const): Return >+ the scrollable container of the enclosing box. If it is actually the render object itself >+ then start the search from the parent box instead. >+ * rendering/RenderObject.h: Declare enclosingScrollableContainerForSnapping(). >+ > 2019-01-29 Rob Buis <rbuis@igalia.com> > > Align with Fetch on data: URLs >diff --git a/Source/WebCore/page/scrolling/AxisScrollSnapOffsets.cpp b/Source/WebCore/page/scrolling/AxisScrollSnapOffsets.cpp >index 020753847a0d84171930e2e6f3e5e4d9d48c7af3..8c14ccc9d1d774dca170007ec0f9083aa773a8da 100644 >--- a/Source/WebCore/page/scrolling/AxisScrollSnapOffsets.cpp >+++ b/Source/WebCore/page/scrolling/AxisScrollSnapOffsets.cpp >@@ -223,7 +223,7 @@ void updateSnapOffsetsForScrollableArea(ScrollableArea& scrollableArea, HTMLElem > LOG(Scrolling, "Computing scroll snap offsets in snap port: %s", snapPortOrAreaToString(scrollSnapPort).utf8().data()); > #endif > for (auto* child : scrollContainer->view().boxesWithScrollSnapPositions()) { >- if (child->findEnclosingScrollableContainer() != scrollContainer) >+ if (child->enclosingScrollableContainerForSnapping() != scrollContainer) > continue; > > // The bounds of the child element's snap area, where the top left of the scrolling container's border box is the origin. >diff --git a/Source/WebCore/rendering/RenderLayerModelObject.cpp b/Source/WebCore/rendering/RenderLayerModelObject.cpp >index 06fccde877916f96203765ba8e69cf8dc20b76da..76cffc350e2d9ecf2ef8d2555d7f5e0cf94cf23d 100644 >--- a/Source/WebCore/rendering/RenderLayerModelObject.cpp >+++ b/Source/WebCore/rendering/RenderLayerModelObject.cpp >@@ -219,7 +219,7 @@ void RenderLayerModelObject::styleDidChange(StyleDifference diff, const RenderSt > } > } > if (oldStyle && oldStyle->scrollSnapArea() != newStyle.scrollSnapArea()) { >- const RenderBox* scrollSnapBox = enclosingBox().findEnclosingScrollableContainer(); >+ const RenderBox* scrollSnapBox = enclosingScrollableContainerForSnapping(); > if (scrollSnapBox && scrollSnapBox->layer()) { > const RenderStyle& style = scrollSnapBox->style(); > if (style.scrollSnapType().strictness != ScrollSnapStrictness::None) { >diff --git a/Source/WebCore/rendering/RenderObject.cpp b/Source/WebCore/rendering/RenderObject.cpp >index 676017c4c6c77a07b22739f0d567315f276be064..9920ab387b2af9085b01d6ef6df357780e956bc1 100644 >--- a/Source/WebCore/rendering/RenderObject.cpp >+++ b/Source/WebCore/rendering/RenderObject.cpp >@@ -438,6 +438,18 @@ RenderBoxModelObject& RenderObject::enclosingBoxModelObject() const > return *lineageOfType<RenderBoxModelObject>(const_cast<RenderObject&>(*this)).first(); > } > >+const RenderBox* RenderObject::enclosingScrollableContainerForSnapping() const >+{ >+ auto* renderBox = &enclosingBox(); >+ if (auto* scrollableContainer = renderBox->findEnclosingScrollableContainer()) { >+ // The scrollable container for snapping cannot be the node itself. >+ if (scrollableContainer == this) >+ return renderBox->parentBox()->findEnclosingScrollableContainer(); >+ return scrollableContainer; >+ } >+ return nullptr; >+} >+ > RenderBlock* RenderObject::firstLineBlock() const > { > return nullptr; >diff --git a/Source/WebCore/rendering/RenderObject.h b/Source/WebCore/rendering/RenderObject.h >index 97cc0faf9c62ce87d0c38e3cc728d5780499a38e..d08c1db0a2e2f6193620f3a752947e4b98152a77 100644 >--- a/Source/WebCore/rendering/RenderObject.h >+++ b/Source/WebCore/rendering/RenderObject.h >@@ -165,6 +165,7 @@ public: > // Convenience function for getting to the nearest enclosing box of a RenderObject. > WEBCORE_EXPORT RenderBox& enclosingBox() const; > RenderBoxModelObject& enclosingBoxModelObject() const; >+ const RenderBox* enclosingScrollableContainerForSnapping() const; > > // Function to return our enclosing flow thread if we are contained inside one. This > // function follows the containing block chain. >diff --git a/LayoutTests/ChangeLog b/LayoutTests/ChangeLog >index f2ef8ba68e65800a1d33f0d8baf549a71b175489..3ef6c1a3ec7b7b56275161075ed79b25bf55f898 100644 >--- a/LayoutTests/ChangeLog >+++ b/LayoutTests/ChangeLog >@@ -1,3 +1,15 @@ >+2019-01-31 Frederic Wang <fwang@igalia.com> >+ >+ [css-scroll-snap] scroll-snap-align not honored on child with non-visible overflow >+ https://bugs.webkit.org/show_bug.cgi?id=191816 >+ >+ Reviewed by NOBODY (OOPS!). >+ >+ Add a test to verify that children with non-visible overflow create snap offsets. >+ >+ * css3/scroll-snap/scroll-snap-children-with-overflow-expected.txt: Added. >+ * css3/scroll-snap/scroll-snap-children-with-overflow.html: Added. >+ > 2019-01-30 Zan Dobersek <zdobersek@igalia.com> > > Unreviewed WPE gardening. Manage failures in the imported WPT tests, >diff --git a/LayoutTests/css3/scroll-snap/scroll-snap-children-with-overflow-expected.txt b/LayoutTests/css3/scroll-snap/scroll-snap-children-with-overflow-expected.txt >new file mode 100644 >index 0000000000000000000000000000000000000000..7fcb5c0d63a236f79ff31bcc3ef8930e0cceca54 >--- /dev/null >+++ b/LayoutTests/css3/scroll-snap/scroll-snap-children-with-overflow-expected.txt >@@ -0,0 +1,2 @@ >+Scroll-snap offsets are: vertical = { 0, 720, 1440, 2160, 2880, 3600 } >+ >diff --git a/LayoutTests/css3/scroll-snap/scroll-snap-children-with-overflow.html b/LayoutTests/css3/scroll-snap/scroll-snap-children-with-overflow.html >new file mode 100644 >index 0000000000000000000000000000000000000000..7af007939c05e5b7faeb881d95c422714aec0ce9 >--- /dev/null >+++ b/LayoutTests/css3/scroll-snap/scroll-snap-children-with-overflow.html >@@ -0,0 +1,61 @@ >+<!DOCTYPE html> >+<html> >+<head> >+ <style> >+ #container { >+ position: absolute; >+ width: 400px; >+ height: 400px; >+ top: 0; >+ left: 0; >+ scroll-snap-type: y mandatory; >+ overflow-x: hidden; >+ overflow-y: scroll; >+ -webkit-overflow-scrolling: touch; >+ border: 1px black dashed; >+ opacity: 0.75; >+ background-color: #EEE; >+ } >+ >+ .child { >+ width: 400px; >+ height: 400px; >+ scroll-snap-align: end; >+ position: absolute; >+ left: 0; >+ } >+ </style> >+ <script> >+ let write = s => output.innerHTML += s + "<br>"; >+ if (window.testRunner) { >+ testRunner.dumpAsText(); >+ testRunner.waitUntilDone(); >+ } >+ >+ function run() >+ { >+ if (!window.testRunner || !window.internals) { >+ write(`To manually test, verify that scrolling in the container snaps such that the bottom tip of each >+ colored box aligns with the bottom of the scrolling container.`); >+ return; >+ } >+ >+ setTimeout(() => { >+ write("Scroll-snap offsets are: " + internals.scrollSnapOffsets(container)); >+ testRunner.notifyDone(); >+ }, 0); >+ } >+ </script> >+</head> >+<body onload=run()> >+ <div id="container"> >+ <div class="child" style="background-color: red; top: 0px; overflow: visible;"></div> >+ <div class="child" style="background-color: green; top: 720px; overflow: hidden;"></div> >+ <div class="child" style="background-color: blue; top: 1440px; overflow: scroll;"></div> >+ <div class="child" style="background-color: aqua; top: 2160px; overflow: auto;"></div> >+ <div class="child" style="background-color: yellow; top: 2880px; overflow: overlay;"></div> >+ <div class="child" style="background-color: fuchsia; top: 3600px;"></div> >+ </div> >+ <div id="output"></div> >+</body> >+</html>
You cannot view the attachment while viewing its details because your browser does not support IFRAMEs.
View the attachment on a separate page
.
View Attachment As Diff
View Attachment As Raw
Actions:
View
|
Formatted Diff
|
Diff
Attachments on
bug 191816
:
359159
|
360715
|
360748
|
361053