Attachment 371290 Details for Bug 198532 – patch

[patch] patch

sticky-async-12.patch (text/plain), 39.90 KB, created by Antti Koivisto on 2019-06-04 09:16:06 PDT

(hide)

Description:

Filename:

MIME Type:

Creator: Antti Koivisto

Created: 2019-06-04 09:16:06 PDT

Size: 39.90 KB

patch

obsolete

>Index: Source/WebCore/ChangeLog
>===================================================================
>--- Source/WebCore/ChangeLog	(revision 246067)
>+++ Source/WebCore/ChangeLog	(working copy)
>@@ -1,3 +1,47 @@
>+2019-06-04  Antti Koivisto  <antti@apple.com>
>+
>+        Sticky positioning is jumpy in many overflow cases
>+        https://bugs.webkit.org/show_bug.cgi?id=198532
>+        <rdar://problem/51400532>
>+
>+        Reviewed by NOBODY (OOPS!).
>+
>+        Tests: scrollingcoordinator/ios/sticky-overflow-no-stacking-context-no-stick-1.html
>+               scrollingcoordinator/ios/sticky-overflow-no-stacking-context-no-stick-2.html
>+               scrollingcoordinator/ios/sticky-overflow-no-stacking-context-stick-1.html
>+               scrollingcoordinator/ios/sticky-overflow-no-stacking-context-stick-2.html
>+               scrollingcoordinator/ios/sticky-overflow-stacking-context-no-stick.html
>+               scrollingcoordinator/ios/sticky-overflow-stacking-context-stick.html
>+
>+        * page/scrolling/ScrollingTree.cpp:
>+        (WebCore::ScrollingTree::notifyRelatedNodesAfterScrollPositionChange):
>+        (WebCore::ScrollingTree::notifyRelatedNodesRecursive):
>+
>+        Simplify for relatedNodeScrollPositionDidChange removal.
>+
>+        * page/scrolling/ScrollingTree.h:
>+        * page/scrolling/ScrollingTreeNode.cpp:
>+        (WebCore::ScrollingTreeNode::relatedNodeScrollPositionDidChange): Deleted.
>+        * page/scrolling/ScrollingTreeNode.h:
>+        * page/scrolling/cocoa/ScrollingTreeFixedNode.mm:
>+        (WebCore::ScrollingTreeFixedNode::applyLayerPositions):
>+        * page/scrolling/cocoa/ScrollingTreePositionedNode.h:
>+        * page/scrolling/cocoa/ScrollingTreePositionedNode.mm:
>+        (WebCore::ScrollingTreePositionedNode::scrollOffsetSinceLastCommit const):
>+
>+        Factor into a function.
>+
>+        (WebCore::ScrollingTreePositionedNode::applyLayerPositions):
>+        (WebCore::ScrollingTreePositionedNode::relatedNodeScrollPositionDidChange): Deleted.
>+
>+        We can't bail out based on changed node as that makes us compute different positions based on what the change root is.
>+        Since all relatedNodeScrollPositionDidChange functions now always simply call applyLayerPositions we can remove the whole thing.
>+
>+        * page/scrolling/cocoa/ScrollingTreeStickyNode.mm:
>+        (WebCore::ScrollingTreeStickyNode::applyLayerPositions):
>+
>+        Implement taking into account that the containing scroller may not be our ancestor.
>+
> 2019-06-04  Zalan Bujtas  <zalan@apple.com>
> 
>         [LFC][IFC] Decouple float placement and line shrinking
>Index: Source/WebCore/page/scrolling/ScrollingTree.cpp
>===================================================================
>--- Source/WebCore/page/scrolling/ScrollingTree.cpp	(revision 245959)
>+++ Source/WebCore/page/scrolling/ScrollingTree.cpp	(working copy)
>@@ -294,28 +294,28 @@ void ScrollingTree::notifyRelatedNodesAf
>     if (is<ScrollingTreeOverflowScrollingNode>(changedNode))
>         additionalUpdateRoots = overflowRelatedNodes().get(changedNode.scrollingNodeID());
> 
>-    notifyRelatedNodesRecursive(changedNode, changedNode);
>+    notifyRelatedNodesRecursive(changedNode);
>     
>     for (auto positionedNodeID : additionalUpdateRoots) {
>         auto* positionedNode = nodeForID(positionedNodeID);
>         if (positionedNode)
>-            notifyRelatedNodesRecursive(changedNode, *positionedNode);
>+            notifyRelatedNodesRecursive(*positionedNode);
>     }
> }
> 
>-void ScrollingTree::notifyRelatedNodesRecursive(ScrollingTreeScrollingNode& changedNode, ScrollingTreeNode& currNode)
>+void ScrollingTree::notifyRelatedNodesRecursive(ScrollingTreeNode& node)
> {
>-    currNode.relatedNodeScrollPositionDidChange(changedNode);
>+    node.applyLayerPositions();
> 
>-    if (!currNode.children())
>+    if (!node.children())
>         return;
> 
>-    for (auto& child : *currNode.children()) {
>+    for (auto& child : *node.children()) {
>         // Never need to cross frame boundaries, since scroll layer adjustments are isolated to each document.
>         if (is<ScrollingTreeFrameScrollingNode>(child))
>             continue;
> 
>-        notifyRelatedNodesRecursive(changedNode, *child);
>+        notifyRelatedNodesRecursive(*child);
>     }
> }
> 
>Index: Source/WebCore/page/scrolling/ScrollingTree.h
>===================================================================
>--- Source/WebCore/page/scrolling/ScrollingTree.h	(revision 245959)
>+++ Source/WebCore/page/scrolling/ScrollingTree.h	(working copy)
>@@ -167,7 +167,7 @@ private:
> 
>     void applyLayerPositionsRecursive(ScrollingTreeNode&);
> 
>-    void notifyRelatedNodesRecursive(ScrollingTreeScrollingNode& changedNode, ScrollingTreeNode& currNode);
>+    void notifyRelatedNodesRecursive(ScrollingTreeNode&);
> 
>     Lock m_treeMutex; // Protects the scrolling tree.
> 
>Index: Source/WebCore/page/scrolling/ScrollingTreeNode.cpp
>===================================================================
>--- Source/WebCore/page/scrolling/ScrollingTreeNode.cpp	(revision 245959)
>+++ Source/WebCore/page/scrolling/ScrollingTreeNode.cpp	(working copy)
>@@ -77,11 +77,6 @@ bool ScrollingTreeNode::isRootNode() con
>     return m_scrollingTree.rootNode() == this;
> }
> 
>-void ScrollingTreeNode::relatedNodeScrollPositionDidChange(const ScrollingTreeScrollingNode&)
>-{
>-    applyLayerPositions();
>-}
>-
> void ScrollingTreeNode::dumpProperties(TextStream& ts, ScrollingStateTreeAsTextBehavior behavior) const
> {
>     if (behavior & ScrollingStateTreeAsTextBehaviorIncludeNodeIDs)
>Index: Source/WebCore/page/scrolling/ScrollingTreeNode.h
>===================================================================
>--- Source/WebCore/page/scrolling/ScrollingTreeNode.h	(revision 245959)
>+++ Source/WebCore/page/scrolling/ScrollingTreeNode.h	(working copy)
>@@ -84,8 +84,6 @@ protected:
>     ScrollingTreeNode(ScrollingTree&, ScrollingNodeType, ScrollingNodeID);
>     ScrollingTree& scrollingTree() const { return m_scrollingTree; }
> 
>-    WEBCORE_EXPORT virtual void relatedNodeScrollPositionDidChange(const ScrollingTreeScrollingNode& changedNode);
>-
>     virtual void applyLayerPositions() = 0;
> 
>     WEBCORE_EXPORT virtual void dumpProperties(WTF::TextStream&, ScrollingStateTreeAsTextBehavior) const;
>Index: Source/WebCore/page/scrolling/cocoa/ScrollingTreePositionedNode.h
>===================================================================
>--- Source/WebCore/page/scrolling/cocoa/ScrollingTreePositionedNode.h	(revision 245959)
>+++ Source/WebCore/page/scrolling/cocoa/ScrollingTreePositionedNode.h	(working copy)
>@@ -46,11 +46,12 @@ public:
>     ScrollPositioningBehavior scrollPositioningBehavior() const { return m_constraints.scrollPositioningBehavior(); }
>     const Vector<ScrollingNodeID>& relatedOverflowScrollingNodes() const { return m_relatedOverflowScrollingNodes; }
> 
>+    FloatSize scrollOffsetSinceLastCommit() const;
>+
> private:
>     ScrollingTreePositionedNode(ScrollingTree&, ScrollingNodeID);
> 
>     void commitStateBeforeChildren(const ScrollingStateNode&) override;
>-    void relatedNodeScrollPositionDidChange(const ScrollingTreeScrollingNode& changedNode) override;
> 
>     void applyLayerPositions() override;
> 
>Index: Source/WebCore/page/scrolling/cocoa/ScrollingTreePositionedNode.mm
>===================================================================
>--- Source/WebCore/page/scrolling/cocoa/ScrollingTreePositionedNode.mm	(revision 245959)
>+++ Source/WebCore/page/scrolling/cocoa/ScrollingTreePositionedNode.mm	(working copy)
>@@ -76,36 +76,33 @@ void ScrollingTreePositionedNode::commit
>         scrollingTree().positionedNodesWithRelatedOverflow().add(scrollingNodeID());
> }
> 
>-void ScrollingTreePositionedNode::applyLayerPositions()
>+FloatSize ScrollingTreePositionedNode::scrollOffsetSinceLastCommit() const
> {
>-    FloatSize scrollOffsetSinceLastCommit;
>+    FloatSize offset;
>     for (auto nodeID : m_relatedOverflowScrollingNodes) {
>         if (auto* node = scrollingTree().nodeForID(nodeID)) {
>             if (is<ScrollingTreeOverflowScrollingNode>(node)) {
>                 auto& overflowNode = downcast<ScrollingTreeOverflowScrollingNode>(*node);
>-                scrollOffsetSinceLastCommit += overflowNode.lastCommittedScrollPosition() - overflowNode.currentScrollPosition();
>+                offset += overflowNode.currentScrollPosition() - overflowNode.lastCommittedScrollPosition();
>             }
>         }
>     }
>-    auto layerOffset = -scrollOffsetSinceLastCommit;
>     if (m_constraints.scrollPositioningBehavior() == ScrollPositioningBehavior::Stationary) {
>         // Stationary nodes move in the opposite direction.
>-        layerOffset = -layerOffset;
>+        return -offset;
>     }
> 
>-    FloatPoint layerPosition = m_constraints.layerPositionAtLastLayout() - layerOffset;
>-
>-    LOG_WITH_STREAM(Scrolling, stream << "ScrollingTreePositionedNode " << scrollingNodeID() << " applyLayerPositions: overflow delta " << scrollOffsetSinceLastCommit << " moving layer to " << layerPosition);
>-
>-    [m_layer _web_setLayerTopLeftPosition:layerPosition - m_constraints.alignmentOffset()];
>+    return offset;
> }
> 
>-void ScrollingTreePositionedNode::relatedNodeScrollPositionDidChange(const ScrollingTreeScrollingNode& changedNode)
>+void ScrollingTreePositionedNode::applyLayerPositions()
> {
>-    if (!m_relatedOverflowScrollingNodes.contains(changedNode.scrollingNodeID()))
>-        return;
>+    auto offset = scrollOffsetSinceLastCommit();
>+    auto layerPosition = m_constraints.layerPositionAtLastLayout() - offset;
>+
>+    LOG_WITH_STREAM(Scrolling, stream << "ScrollingTreePositionedNode " << scrollingNodeID() << " applyLayerPositions: overflow delta " << offset << " moving layer to " << layerPosition);
> 
>-    applyLayerPositions();
>+    [m_layer _web_setLayerTopLeftPosition:layerPosition - m_constraints.alignmentOffset()];
> }
> 
> void ScrollingTreePositionedNode::dumpProperties(TextStream& ts, ScrollingStateTreeAsTextBehavior behavior) const
>Index: Source/WebCore/page/scrolling/cocoa/ScrollingTreeStickyNode.mm
>===================================================================
>--- Source/WebCore/page/scrolling/cocoa/ScrollingTreeStickyNode.mm	(revision 245959)
>+++ Source/WebCore/page/scrolling/cocoa/ScrollingTreeStickyNode.mm	(working copy)
>@@ -67,21 +67,48 @@ void ScrollingTreeStickyNode::commitStat
> 
> void ScrollingTreeStickyNode::applyLayerPositions()
> {
>-    FloatRect constrainingRect;
>+    auto computeLayerPositionForScrollingNode = [&](ScrollingTreeNode& scrollingNode) {
>+        FloatRect constrainingRect;
>+        if (is<ScrollingTreeFrameScrollingNode>(scrollingNode)) {
>+            auto& frameScrollingNode = downcast<ScrollingTreeFrameScrollingNode>(scrollingNode);
>+            constrainingRect = frameScrollingNode.layoutViewport();
>+        } else {
>+            auto& overflowScrollingNode = downcast<ScrollingTreeOverflowScrollingNode>(scrollingNode);
>+            constrainingRect = FloatRect(overflowScrollingNode.currentScrollPosition(), m_constraints.constrainingRectAtLastLayout().size());
>+        }
>+        return m_constraints.layerPositionForConstrainingRect(constrainingRect);
>+    };
>+
>+    auto computeLayerPosition = [&] {
>+        for (auto* ancestor = parent(); ancestor; ancestor = ancestor->parent()) {
>+            if (is<ScrollingTreePositionedNode>(*ancestor)) {
>+                auto& positioningAncestor = downcast<ScrollingTreePositionedNode>(*ancestor);
>+
>+                // FIXME: Do we need to do anything for ScrollPositioningBehavior::Stationary?
>+                if (positioningAncestor.scrollPositioningBehavior() == ScrollPositioningBehavior::Moves) {
>+                    auto overflowNode = scrollingTree().nodeForID(positioningAncestor.relatedOverflowScrollingNodes()[0]);
>+
>+                    auto position = computeLayerPositionForScrollingNode(*overflowNode);
>+
>+                    if (positioningAncestor.layer() == m_layer) {
>+                        // We'll also do the adjustment the positioning node would do.
>+                        position -= positioningAncestor.scrollOffsetSinceLastCommit();
>+                    }
>+                    
>+                    return position;
>+                }
>+            }
>+            if (is<ScrollingTreeScrollingNode>(*ancestor))
>+                return computeLayerPositionForScrollingNode(*ancestor);
>+        }
>+        return FloatPoint();
>+    };
> 
>-    auto* enclosingScrollingNode = parent();
>-    if (is<ScrollingTreeOverflowScrollingNode>(enclosingScrollingNode))
>-        constrainingRect = FloatRect(downcast<ScrollingTreeOverflowScrollingNode>(*enclosingScrollingNode).currentScrollPosition(), m_constraints.constrainingRectAtLastLayout().size());
>-    else if (is<ScrollingTreeFrameScrollingNode>(enclosingScrollingNode))
>-        constrainingRect = downcast<ScrollingTreeFrameScrollingNode>(enclosingScrollingNode)->layoutViewport();
>-    else
>-        return;
>+    auto layerPosition = computeLayerPosition();
> 
>-    FloatPoint layerPosition = m_constraints.layerPositionForConstrainingRect(constrainingRect) - m_constraints.alignmentOffset();
>+    LOG_WITH_STREAM(Scrolling, stream << "ScrollingTreeStickyNode " << scrollingNodeID() << " constrainingRectAtLastLayout " << m_constraints.constrainingRectAtLastLayout() << " last layer pos " << m_constraints.layerPositionAtLastLayout() << " layerPosition " << layerPosition);
> 
>-    LOG_WITH_STREAM(Scrolling, stream << "ScrollingTreeStickyNode " << scrollingNodeID() << " constrainingRect " << constrainingRect << " constrainingRectAtLastLayout " << m_constraints.constrainingRectAtLastLayout() << " last layer pos " << m_constraints.layerPositionAtLastLayout() << " layerPosition " << layerPosition);
>-
>-    [m_layer _web_setLayerTopLeftPosition:layerPosition];
>+    [m_layer _web_setLayerTopLeftPosition:layerPosition - m_constraints.alignmentOffset()];
> }
> 
> void ScrollingTreeStickyNode::dumpProperties(TextStream& ts, ScrollingStateTreeAsTextBehavior behavior) const
>Index: LayoutTests/ChangeLog
>===================================================================
>--- LayoutTests/ChangeLog	(revision 245959)
>+++ LayoutTests/ChangeLog	(working copy)
>@@ -1,3 +1,24 @@
>+2019-06-04  Antti Koivisto  <antti@apple.com>
>+
>+        Sticky positioning is jumpy in many overflow cases
>+        https://bugs.webkit.org/show_bug.cgi?id=198532
>+        <rdar://problem/51400532>
>+
>+        Reviewed by NOBODY (OOPS!).
>+
>+        * scrollingcoordinator/ios/sticky-overflow-no-stacking-context-no-stick-1-expected.html: Added.
>+        * scrollingcoordinator/ios/sticky-overflow-no-stacking-context-no-stick-1.html: Added.
>+        * scrollingcoordinator/ios/sticky-overflow-no-stacking-context-no-stick-2-expected.html: Added.
>+        * scrollingcoordinator/ios/sticky-overflow-no-stacking-context-no-stick-2.html: Added.
>+        * scrollingcoordinator/ios/sticky-overflow-no-stacking-context-stick-1-expected.html: Added.
>+        * scrollingcoordinator/ios/sticky-overflow-no-stacking-context-stick-1.html: Added.
>+        * scrollingcoordinator/ios/sticky-overflow-no-stacking-context-stick-2-expected.html: Added.
>+        * scrollingcoordinator/ios/sticky-overflow-no-stacking-context-stick-2.html: Added.
>+        * scrollingcoordinator/ios/sticky-overflow-stacking-context-no-stick-expected.html: Added.
>+        * scrollingcoordinator/ios/sticky-overflow-stacking-context-no-stick.html: Added.
>+        * scrollingcoordinator/ios/sticky-overflow-stacking-context-stick-expected.html: Added.
>+        * scrollingcoordinator/ios/sticky-overflow-stacking-context-stick.html: Added.
>+
> 2019-05-30  Ryosuke Niwa  <rniwa@webkit.org>
> 
>         iOS: Main frame should be scrollable when pinch zoomed or software keyboard is up
>Index: LayoutTests/scrollingcoordinator/ios/sticky-overflow-no-stacking-context-no-stick-1-expected.html
>===================================================================
>--- LayoutTests/scrollingcoordinator/ios/sticky-overflow-no-stacking-context-no-stick-1-expected.html	(nonexistent)
>+++ LayoutTests/scrollingcoordinator/ios/sticky-overflow-no-stacking-context-no-stick-1-expected.html	(working copy)
>@@ -0,0 +1,62 @@
>+<!DOCTYPE html> 
>+<html>
>+<head>
>+    <meta name="viewport" content="initial-scale=1.0">
>+    <style>
>+        .scroller {
>+            margin: 10px;
>+            height: 300px;
>+            width: 300px;
>+            border: 1px solid black;
>+            overflow: scroll;
>+            position: relative;
>+        }
>+        
>+        .sticky {
>+            position: -webkit-sticky;
>+            top: 0px;
>+            width: 200px;
>+            height: 200px;
>+            background-color: green;
>+        }
>+
>+        .container {
>+            margin: 40px;
>+            border: 2px solid red;
>+            height: 5000px;
>+        }
>+    </style>
>+    <script src="../../resources/ui-helper.js"></script>
>+    <script>
>+        if (window.testRunner)
>+            testRunner.waitUntilDone();
>+
>+        async function doTest()
>+        {
>+            if (!window.testRunner)
>+                return;
>+
>+            if (!testRunner.runUIScript)
>+                return;
>+            
>+            await UIHelper.ensurePresentationUpdate();
>+            document.querySelector('.scroller').scrollTo(0, 20);
>+            await UIHelper.ensurePresentationUpdate();
>+
>+            if (window.testRunner)
>+                testRunner.notifyDone();
>+        }
>+        
>+        window.addEventListener('load', doTest, false);
>+    </script>
>+</head>
>+<body>
>+    <div class="spacer">
>+        <div class="scroller">
>+            <div class="container">
>+                <div class="sticky"></div>
>+            </div>
>+        </div>
>+    </div>
>+</body>
>+</html>
>Index: LayoutTests/scrollingcoordinator/ios/sticky-overflow-no-stacking-context-no-stick-1.html
>===================================================================
>--- LayoutTests/scrollingcoordinator/ios/sticky-overflow-no-stacking-context-no-stick-1.html	(nonexistent)
>+++ LayoutTests/scrollingcoordinator/ios/sticky-overflow-no-stacking-context-no-stick-1.html	(working copy)
>@@ -0,0 +1,59 @@
>+<!DOCTYPE html> 
>+<html>
>+<head>
>+    <meta name="viewport" content="initial-scale=1.0">
>+    <style>
>+        .scroller {
>+            margin: 10px;
>+            height: 300px;
>+            width: 300px;
>+            border: 1px solid black;
>+            overflow: scroll;
>+            position: relative;
>+        }
>+        
>+        .sticky {
>+            position: -webkit-sticky;
>+            top: 0px;
>+            width: 200px;
>+            height: 200px;
>+            background-color: green;
>+        }
>+
>+        .container {
>+            margin: 40px;
>+            border: 2px solid red;
>+            height: 5000px;
>+        }
>+    </style>
>+    <script src="../../resources/ui-helper.js"></script>
>+    <script>
>+        if (window.testRunner)
>+            testRunner.waitUntilDone();
>+
>+        async function doTest()
>+        {
>+            if (!window.testRunner)
>+                return;
>+
>+            if (!testRunner.runUIScript)
>+                return;
>+
>+            const scrollUpdatesDisabled = true;
>+            await UIHelper.immediateScrollElementAtContentPointToOffset(50, 50, 0, 20, scrollUpdatesDisabled);
>+            testRunner.notifyDone();
>+        }
>+        
>+        window.addEventListener('load', doTest, false);
>+    </script>
>+</head>
>+<body>
>+    <div class="spacer">
>+        <div class="scroller">
>+            <div class="container">
>+                <div class="sticky"></div>
>+            </div>
>+        </div>
>+    </div>
>+</body>
>+</html>
>Index: LayoutTests/scrollingcoordinator/ios/sticky-overflow-no-stacking-context-no-stick-2-expected.html
>===================================================================
>--- LayoutTests/scrollingcoordinator/ios/sticky-overflow-no-stacking-context-no-stick-2-expected.html	(nonexistent)
>+++ LayoutTests/scrollingcoordinator/ios/sticky-overflow-no-stacking-context-no-stick-2-expected.html	(working copy)
>@@ -0,0 +1,64 @@
>+<!DOCTYPE html> 
>+<html>
>+<head>
>+    <meta name="viewport" content="initial-scale=1.0">
>+    <style>
>+        .scroller {
>+            margin: 10px;
>+            height: 300px;
>+            width: 300px;
>+            border: 1px solid black;
>+            overflow: scroll;
>+            z-index: 0;
>+            position: relative;
>+        }
>+        
>+        .sticky {
>+            position: -webkit-sticky;
>+            top: 0px;
>+            width: 200px;
>+            height: 200px;
>+            background-color: green;
>+        }
>+
>+        .container {
>+            margin: 40px;
>+            border: 2px solid red;
>+            height: 5000px;
>+            will-change: transform;
>+        }
>+    </style>
>+    <script src="../../resources/ui-helper.js"></script>
>+    <script>
>+        if (window.testRunner)
>+            testRunner.waitUntilDone();
>+
>+        async function doTest()
>+        {
>+            if (!window.testRunner)
>+                return;
>+
>+            if (!testRunner.runUIScript)
>+                return;
>+            
>+            await UIHelper.ensurePresentationUpdate();
>+            document.querySelector('.scroller').scrollTo(0, 20);
>+            await UIHelper.ensurePresentationUpdate();
>+
>+            if (window.testRunner)
>+                testRunner.notifyDone();
>+        }
>+        
>+        window.addEventListener('load', doTest, false);
>+    </script>
>+</head>
>+<body>
>+    <div class="spacer">
>+        <div class="scroller">
>+            <div class="container">
>+                <div class="sticky"></div>
>+            </div>
>+        </div>
>+    </div>
>+</body>
>+</html>
>Index: LayoutTests/scrollingcoordinator/ios/sticky-overflow-no-stacking-context-no-stick-2.html
>===================================================================
>--- LayoutTests/scrollingcoordinator/ios/sticky-overflow-no-stacking-context-no-stick-2.html	(nonexistent)
>+++ LayoutTests/scrollingcoordinator/ios/sticky-overflow-no-stacking-context-no-stick-2.html	(working copy)
>@@ -0,0 +1,60 @@
>+<!DOCTYPE html> 
>+<html>
>+<head>
>+    <meta name="viewport" content="initial-scale=1.0">
>+    <style>
>+        .scroller {
>+            margin: 10px;
>+            height: 300px;
>+            width: 300px;
>+            border: 1px solid black;
>+            overflow: scroll;
>+            position: relative;
>+        }
>+        
>+        .sticky {
>+            position: -webkit-sticky;
>+            top: 0px;
>+            width: 200px;
>+            height: 200px;
>+            background-color: green;
>+        }
>+
>+        .container {
>+            margin: 40px;
>+            border: 2px solid red;
>+            height: 5000px;
>+            will-change: transform;
>+        }
>+    </style>
>+    <script src="../../resources/ui-helper.js"></script>
>+    <script>
>+        if (window.testRunner)
>+            testRunner.waitUntilDone();
>+
>+        async function doTest()
>+        {
>+            if (!window.testRunner)
>+                return;
>+
>+            if (!testRunner.runUIScript)
>+                return;
>+
>+            const scrollUpdatesDisabled = true;
>+            await UIHelper.immediateScrollElementAtContentPointToOffset(50, 50, 0, 20, scrollUpdatesDisabled);
>+            testRunner.notifyDone();
>+        }
>+        
>+        window.addEventListener('load', doTest, false);
>+    </script>
>+</head>
>+<body>
>+    <div class="spacer">
>+        <div class="scroller">
>+            <div class="container">
>+                <div class="sticky"></div>
>+            </div>
>+        </div>
>+    </div>
>+</body>
>+</html>
>Index: LayoutTests/scrollingcoordinator/ios/sticky-overflow-no-stacking-context-stick-1-expected.html
>===================================================================
>--- LayoutTests/scrollingcoordinator/ios/sticky-overflow-no-stacking-context-stick-1-expected.html	(nonexistent)
>+++ LayoutTests/scrollingcoordinator/ios/sticky-overflow-no-stacking-context-stick-1-expected.html	(working copy)
>@@ -0,0 +1,62 @@
>+<!DOCTYPE html> 
>+<html>
>+<head>
>+    <meta name="viewport" content="initial-scale=1.0">
>+    <style>
>+        .scroller {
>+            margin: 10px;
>+            height: 300px;
>+            width: 300px;
>+            border: 1px solid black;
>+            overflow: scroll;
>+            position: relative;
>+        }
>+        
>+        .sticky {
>+            position: -webkit-sticky;
>+            top: 0px;
>+            width: 200px;
>+            height: 200px;
>+            background-color: green;
>+        }
>+
>+        .container {
>+            margin: 40px;
>+            border: 2px solid red;
>+            height: 5000px;
>+        }
>+    </style>
>+    <script src="../../resources/ui-helper.js"></script>
>+    <script>
>+        if (window.testRunner)
>+            testRunner.waitUntilDone();
>+
>+        async function doTest()
>+        {
>+            if (!window.testRunner)
>+                return;
>+
>+            if (!testRunner.runUIScript)
>+                return;
>+            
>+            await UIHelper.ensurePresentationUpdate();
>+            document.querySelector('.scroller').scrollTo(0, 200);
>+            await UIHelper.ensurePresentationUpdate();
>+
>+            if (window.testRunner)
>+                testRunner.notifyDone();
>+        }
>+        
>+        window.addEventListener('load', doTest, false);
>+    </script>
>+</head>
>+<body>
>+    <div class="spacer">
>+        <div class="scroller">
>+            <div class="container">
>+                <div class="sticky"></div>
>+            </div>
>+        </div>
>+    </div>
>+</body>
>+</html>
>Index: LayoutTests/scrollingcoordinator/ios/sticky-overflow-no-stacking-context-stick-1.html
>===================================================================
>--- LayoutTests/scrollingcoordinator/ios/sticky-overflow-no-stacking-context-stick-1.html	(nonexistent)
>+++ LayoutTests/scrollingcoordinator/ios/sticky-overflow-no-stacking-context-stick-1.html	(working copy)
>@@ -0,0 +1,59 @@
>+<!DOCTYPE html> 
>+<html>
>+<head>
>+    <meta name="viewport" content="initial-scale=1.0">
>+    <style>
>+        .scroller {
>+            margin: 10px;
>+            height: 300px;
>+            width: 300px;
>+            border: 1px solid black;
>+            overflow: scroll;
>+            position: relative;
>+        }
>+        
>+        .sticky {
>+            position: -webkit-sticky;
>+            top: 0px;
>+            width: 200px;
>+            height: 200px;
>+            background-color: green;
>+        }
>+
>+        .container {
>+            margin: 40px;
>+            border: 2px solid red;
>+            height: 5000px;
>+        }
>+    </style>
>+    <script src="../../resources/ui-helper.js"></script>
>+    <script>
>+        if (window.testRunner)
>+            testRunner.waitUntilDone();
>+
>+        async function doTest()
>+        {
>+            if (!window.testRunner)
>+                return;
>+
>+            if (!testRunner.runUIScript)
>+                return;
>+
>+            const scrollUpdatesDisabled = true;
>+            await UIHelper.immediateScrollElementAtContentPointToOffset(50, 50, 0, 200, scrollUpdatesDisabled);
>+            testRunner.notifyDone();
>+        }
>+        
>+        window.addEventListener('load', doTest, false);
>+    </script>
>+</head>
>+<body>
>+    <div class="spacer">
>+        <div class="scroller">
>+            <div class="container">
>+                <div class="sticky"></div>
>+            </div>
>+        </div>
>+    </div>
>+</body>
>+</html>
>Index: LayoutTests/scrollingcoordinator/ios/sticky-overflow-no-stacking-context-stick-2-expected.html
>===================================================================
>--- LayoutTests/scrollingcoordinator/ios/sticky-overflow-no-stacking-context-stick-2-expected.html	(nonexistent)
>+++ LayoutTests/scrollingcoordinator/ios/sticky-overflow-no-stacking-context-stick-2-expected.html	(working copy)
>@@ -0,0 +1,64 @@
>+<!DOCTYPE html> 
>+<html>
>+<head>
>+    <meta name="viewport" content="initial-scale=1.0">
>+    <style>
>+        .scroller {
>+            margin: 10px;
>+            height: 300px;
>+            width: 300px;
>+            border: 1px solid black;
>+            overflow: scroll;
>+            z-index: 0;
>+            position: relative;
>+        }
>+        
>+        .sticky {
>+            position: -webkit-sticky;
>+            top: 0px;
>+            width: 200px;
>+            height: 200px;
>+            background-color: green;
>+        }
>+
>+        .container {
>+            margin: 40px;
>+            border: 2px solid red;
>+            height: 5000px;
>+            will-change: transform;
>+        }
>+    </style>
>+    <script src="../../resources/ui-helper.js"></script>
>+    <script>
>+        if (window.testRunner)
>+            testRunner.waitUntilDone();
>+
>+        async function doTest()
>+        {
>+            if (!window.testRunner)
>+                return;
>+
>+            if (!testRunner.runUIScript)
>+                return;
>+            
>+            await UIHelper.ensurePresentationUpdate();
>+            document.querySelector('.scroller').scrollTo(0, 200);
>+            await UIHelper.ensurePresentationUpdate();
>+
>+            if (window.testRunner)
>+                testRunner.notifyDone();
>+        }
>+        
>+        window.addEventListener('load', doTest, false);
>+    </script>
>+</head>
>+<body>
>+    <div class="spacer">
>+        <div class="scroller">
>+            <div class="container">
>+                <div class="sticky"></div>
>+            </div>
>+        </div>
>+    </div>
>+</body>
>+</html>
>Index: LayoutTests/scrollingcoordinator/ios/sticky-overflow-no-stacking-context-stick-2.html
>===================================================================
>--- LayoutTests/scrollingcoordinator/ios/sticky-overflow-no-stacking-context-stick-2.html	(nonexistent)
>+++ LayoutTests/scrollingcoordinator/ios/sticky-overflow-no-stacking-context-stick-2.html	(working copy)
>@@ -0,0 +1,60 @@
>+<!DOCTYPE html> 
>+<html>
>+<head>
>+    <meta name="viewport" content="initial-scale=1.0">
>+    <style>
>+        .scroller {
>+            margin: 10px;
>+            height: 300px;
>+            width: 300px;
>+            border: 1px solid black;
>+            overflow: scroll;
>+            position: relative;
>+        }
>+        
>+        .sticky {
>+            position: -webkit-sticky;
>+            top: 0px;
>+            width: 200px;
>+            height: 200px;
>+            background-color: green;
>+        }
>+
>+        .container {
>+            margin: 40px;
>+            border: 2px solid red;
>+            height: 5000px;
>+            will-change: transform;
>+        }
>+    </style>
>+    <script src="../../resources/ui-helper.js"></script>
>+    <script>
>+        if (window.testRunner)
>+            testRunner.waitUntilDone();
>+
>+        async function doTest()
>+        {
>+            if (!window.testRunner)
>+                return;
>+
>+            if (!testRunner.runUIScript)
>+                return;
>+
>+            const scrollUpdatesDisabled = true;
>+            await UIHelper.immediateScrollElementAtContentPointToOffset(50, 50, 0, 200, scrollUpdatesDisabled);
>+            testRunner.notifyDone();
>+        }
>+        
>+        window.addEventListener('load', doTest, false);
>+    </script>
>+</head>
>+<body>
>+    <div class="spacer">
>+        <div class="scroller">
>+            <div class="container">
>+                <div class="sticky"></div>
>+            </div>
>+        </div>
>+    </div>
>+</body>
>+</html>
>Index: LayoutTests/scrollingcoordinator/ios/sticky-overflow-stacking-context-no-stick-expected.html
>===================================================================
>--- LayoutTests/scrollingcoordinator/ios/sticky-overflow-stacking-context-no-stick-expected.html	(nonexistent)
>+++ LayoutTests/scrollingcoordinator/ios/sticky-overflow-stacking-context-no-stick-expected.html	(working copy)
>@@ -0,0 +1,63 @@
>+<!DOCTYPE html> 
>+<html>
>+<head>
>+    <meta name="viewport" content="initial-scale=1.0">
>+    <style>
>+        .scroller {
>+            margin: 10px;
>+            height: 300px;
>+            width: 300px;
>+            border: 1px solid black;
>+            overflow: scroll;
>+            z-index: 0;
>+            position: relative;
>+        }
>+        
>+        .sticky {
>+            position: -webkit-sticky;
>+            top: 0px;
>+            width: 200px;
>+            height: 200px;
>+            background-color: green;
>+        }
>+
>+        .container {
>+            margin: 40px;
>+            border: 2px solid red;
>+            height: 5000px;
>+        }
>+    </style>
>+    <script src="../../resources/ui-helper.js"></script>
>+    <script>
>+        if (window.testRunner)
>+            testRunner.waitUntilDone();
>+
>+        async function doTest()
>+        {
>+            if (!window.testRunner)
>+                return;
>+
>+            if (!testRunner.runUIScript)
>+                return;
>+            
>+            await UIHelper.ensurePresentationUpdate();
>+            document.querySelector('.scroller').scrollTo(0, 20);
>+            await UIHelper.ensurePresentationUpdate();
>+
>+            if (window.testRunner)
>+                testRunner.notifyDone();
>+        }
>+        
>+        window.addEventListener('load', doTest, false);
>+    </script>
>+</head>
>+<body>
>+    <div class="spacer">
>+        <div class="scroller">
>+            <div class="container">
>+                <div class="sticky"></div>
>+            </div>
>+        </div>
>+    </div>
>+</body>
>+</html>
>Index: LayoutTests/scrollingcoordinator/ios/sticky-overflow-stacking-context-no-stick.html
>===================================================================
>--- LayoutTests/scrollingcoordinator/ios/sticky-overflow-stacking-context-no-stick.html	(nonexistent)
>+++ LayoutTests/scrollingcoordinator/ios/sticky-overflow-stacking-context-no-stick.html	(working copy)
>@@ -0,0 +1,60 @@
>+<!DOCTYPE html> 
>+<html>
>+<head>
>+    <meta name="viewport" content="initial-scale=1.0">
>+    <style>
>+        .scroller {
>+            margin: 10px;
>+            height: 300px;
>+            width: 300px;
>+            border: 1px solid black;
>+            overflow: scroll;
>+            z-index: 0;
>+            position: relative;
>+        }
>+        
>+        .sticky {
>+            position: -webkit-sticky;
>+            top: 0px;
>+            width: 200px;
>+            height: 200px;
>+            background-color: green;
>+        }
>+
>+        .container {
>+            margin: 40px;
>+            border: 2px solid red;
>+            height: 5000px;
>+        }
>+    </style>
>+    <script src="../../resources/ui-helper.js"></script>
>+    <script>
>+        if (window.testRunner)
>+            testRunner.waitUntilDone();
>+
>+        async function doTest()
>+        {
>+            if (!window.testRunner)
>+                return;
>+
>+            if (!testRunner.runUIScript)
>+                return;
>+
>+            const scrollUpdatesDisabled = true;
>+            await UIHelper.immediateScrollElementAtContentPointToOffset(50, 50, 0, 20, scrollUpdatesDisabled);
>+            testRunner.notifyDone();
>+        }
>+        
>+        window.addEventListener('load', doTest, false);
>+    </script>
>+</head>
>+<body>
>+    <div class="spacer">
>+        <div class="scroller">
>+            <div class="container">
>+                <div class="sticky"></div>
>+            </div>
>+        </div>
>+    </div>
>+</body>
>+</html>
>Index: LayoutTests/scrollingcoordinator/ios/sticky-overflow-stacking-context-stick-expected.html
>===================================================================
>--- LayoutTests/scrollingcoordinator/ios/sticky-overflow-stacking-context-stick-expected.html	(nonexistent)
>+++ LayoutTests/scrollingcoordinator/ios/sticky-overflow-stacking-context-stick-expected.html	(working copy)
>@@ -0,0 +1,63 @@
>+<!DOCTYPE html> 
>+<html>
>+<head>
>+    <meta name="viewport" content="initial-scale=1.0">
>+    <style>
>+        .scroller {
>+            margin: 10px;
>+            height: 300px;
>+            width: 300px;
>+            border: 1px solid black;
>+            overflow: scroll;
>+            z-index: 0;
>+            position: relative;
>+        }
>+        
>+        .sticky {
>+            position: -webkit-sticky;
>+            top: 0px;
>+            width: 200px;
>+            height: 200px;
>+            background-color: green;
>+        }
>+
>+        .container {
>+            margin: 40px;
>+            border: 2px solid red;
>+            height: 5000px;
>+        }
>+    </style>
>+    <script src="../../resources/ui-helper.js"></script>
>+    <script>
>+        if (window.testRunner)
>+            testRunner.waitUntilDone();
>+
>+        async function doTest()
>+        {
>+            if (!window.testRunner)
>+                return;
>+
>+            if (!testRunner.runUIScript)
>+                return;
>+            
>+            await UIHelper.ensurePresentationUpdate();
>+            document.querySelector('.scroller').scrollTo(0, 200);
>+            await UIHelper.ensurePresentationUpdate();
>+
>+            if (window.testRunner)
>+                testRunner.notifyDone();
>+        }
>+        
>+        window.addEventListener('load', doTest, false);
>+    </script>
>+</head>
>+<body>
>+    <div class="spacer">
>+        <div class="scroller">
>+            <div class="container">
>+                <div class="sticky"></div>
>+            </div>
>+        </div>
>+    </div>
>+</body>
>+</html>
>Index: LayoutTests/scrollingcoordinator/ios/sticky-overflow-stacking-context-stick.html
>===================================================================
>--- LayoutTests/scrollingcoordinator/ios/sticky-overflow-stacking-context-stick.html	(nonexistent)
>+++ LayoutTests/scrollingcoordinator/ios/sticky-overflow-stacking-context-stick.html	(working copy)
>@@ -0,0 +1,60 @@
>+<!DOCTYPE html> 
>+<html>
>+<head>
>+    <meta name="viewport" content="initial-scale=1.0">
>+    <style>
>+        .scroller {
>+            margin: 10px;
>+            height: 300px;
>+            width: 300px;
>+            border: 1px solid black;
>+            overflow: scroll;
>+            z-index: 0;
>+            position: relative;
>+        }
>+        
>+        .sticky {
>+            position: -webkit-sticky;
>+            top: 0px;
>+            width: 200px;
>+            height: 200px;
>+            background-color: green;
>+        }
>+
>+        .container {
>+            margin: 40px;
>+            border: 2px solid red;
>+            height: 5000px;
>+        }
>+    </style>
>+    <script src="../../resources/ui-helper.js"></script>
>+    <script>
>+        if (window.testRunner)
>+            testRunner.waitUntilDone();
>+
>+        async function doTest()
>+        {
>+            if (!window.testRunner)
>+                return;
>+
>+            if (!testRunner.runUIScript)
>+                return;
>+
>+            const scrollUpdatesDisabled = true;
>+            await UIHelper.immediateScrollElementAtContentPointToOffset(50, 50, 0, 200, scrollUpdatesDisabled);
>+            testRunner.notifyDone();
>+        }
>+        
>+        window.addEventListener('load', doTest, false);
>+    </script>
>+</head>
>+<body>
>+    <div class="spacer">
>+        <div class="scroller">
>+            <div class="container">
>+                <div class="sticky"></div>
>+            </div>
>+        </div>
>+    </div>
>+</body>
>+</html>

Flags:

simon.fraser: review+
ews-watchlist: commit-queue-

Actions: View | Formatted Diff | Diff

Attachments on bug 198532: 371290 | 371298 | 371314