Attachment #120651 for bug #67100

View Details Raw Unified Return to Bug 67100

| Differences between



2011-12-28  Julien Chaffraix  <jchaffraix@webkit.org>

        REGRESSION (r93614): Safari Reader doesn't repaint correctly when scrolling
        https://bugs.webkit.org/show_bug.cgi?id=67100

        Reviewed by NOBODY (OOPS!).

        Tests: fast/layers/scroll-with-transform-composited-layer-expected.html
               fast/layers/scroll-with-transform-composited-layer.html
               fast/layers/scroll-with-transform-layer-expected.html
               fast/layers/scroll-with-transform-layer.html

        The regression came from a previous optimization that was wrongly kept after r93614.

        * rendering/RenderLayer.cpp:
        (WebCore::RenderLayer::updateLayerPositionsAfterScroll):
        Remove the early return for transformed layer. This change worked as we used
        to call updateLayerPositions from scrollTo which would call updateLayerPosition on
        all our descendants. After r93614, this is no longer the case and we explicitely need
        to call updateLayerPosition on our descendants from updateLayerPositionsAfterScroll.

2011-12-21  Matt Falkenhagen  <falken@chromium.org>

        Add all ICU languages to LocaleToScriptMappingDefault.cpp



        // FIXME: Is it worth passing the offsetFromRoot around like in updateLayerPositions?
        computeRepaintRects();
        flags |= HasSeenFixedPositionedAncestor;
    } else if (renderer()->hasTransform() && !renderer()->isRenderView()) {
        // Transforms act as fixed position containers, so nothing inside a
        // transformed element can be fixed relative to the viewport if the
        // transformed element is not fixed itself or child of a fixed element.
        return;
    } else if ((flags & HasSeenAncestorWithOverflowClip) && !m_canSkipRepaintRectsUpdateOnScroll) {
        // If we have seen an overflow clip, we should update our repaint rects as clippedOverflowRectForRepaint
        // intersects it with our ancestor overflow clip that may have moved.



2011-12-28  Julien Chaffraix  <jchaffraix@webkit.org>

        REGRESSION (r93614): Safari Reader doesn't repaint correctly when scrolling
        https://bugs.webkit.org/show_bug.cgi?id=67100

        Reviewed by NOBODY (OOPS!).

        Added 2 ref tests for scrolling inside a transformed layers (either composited
        or not).

        * fast/layers/scroll-with-transform-composited-layer-expected.html: Added.
        * fast/layers/scroll-with-transform-composited-layer.html: Added.
        * fast/layers/scroll-with-transform-layer-expected.html: Added.
        * fast/layers/scroll-with-transform-layer.html: Added.

2011-12-21  Ilya Tikhonovsky  <loislo@chromium.org>

        Unreviewed update test expectation for svg/custom/linking-uri-01-b.svg



<!DOCTYPE html>
<html>
<head>
<style>
    p { height: 300px; width: 100px; margin: 0px; }
    p.green { background-color: green; }
    div { height: 100px; width: 100px; }
    div.relative { position: relative }
    div.composited
    {
        -webkit-transform: translateZ(0);
        -moz-transform: translateZ(0);
        transform: translateZ(0);
    }
</style>
</head>
<body>
    <span>http://webkit.org/b/67100: REGRESSION (r93614): Safari Reader doesn't repaint correctly when scrolling</span>
    <span>All the boxes should only contain green content.</span>
    <div class="scrollMe composited" style="overflow: hidden;">
        <div class="relative">
            <p class="green"></p>
        </div>
    </div>
    <br>
    <div class="scrollMe composited" style="overflow: scroll;">
        <div class="relative">
            <p class="green"></p>
        </div>
    </div>
    <br>
    <div class="scrollMe composited" style="overflow: hidden;">
        <div class="relative">
            <p class="green"></p>
        </div>
    </div>
    <br>
    <div class="scrollMe composited" style="overflow: scroll;">
        <div class="relative">
            <p class="green"></p>
        </div>
    </div>
    <br>
    <script>
        var scrollMes = document.getElementsByClassName("scrollMe");
        for (var i = 0; i < scrollMes.length; ++i)
            scrollMes[i].scrollTop = 100;
    </script>
</body>
</html>



<!DOCTYPE html>
<html>
<head>
<style>
    p { height: 100px; width: 100px; margin: 0px; }
    p.red { background-color: red; }
    p.green { background-color: green; }
    div { height: 100px; width: 100px; }
    div.relative { position: relative }
    div.composited
    {
        -webkit-transform: translateZ(0);
        -moz-transform: translateZ(0);
        transform: translateZ(0);
    }
    div.translated
    {
        -webkit-transform: translate(0);
        -moz-transform: translate(0);
        transform: translate(0);
    }
</style>
</head>
<body>
    <span>http://webkit.org/b/67100: REGRESSION (r93614): Safari Reader doesn't repaint correctly when scrolling</span>
    <span>All the boxes should only contain green content.</span>
    <!-- Use a translation. -->
    <div class="scrollMe composited" style="overflow: hidden;">
        <div class="relative">
            <p class="red"></p>
            <p class="green"></p>
            <p class="red"></p>
        </div>
    </div>
    <br>
    <div class="scrollMe composited" style="overflow: scroll;">
        <div class="relative">
            <p class="red"></p>
            <p class="green"></p>
            <p class="red"></p>
        </div>
    </div>
    <br>
    <!-- Nest composited and non-composited. -->
    <div class="scrollMe composited" style="overflow: hidden;">
        <div class="relative translated">
            <p class="red"></p>
            <p class="green"></p>
            <p class="red"></p>
        </div>
    </div>
    <br>
    <div class="scrollMe translated" style="overflow: scroll;">
        <div class="relative composited">
            <p class="red"></p>
            <p class="green"></p>
            <p class="red"></p>
        </div>
    </div>
    <br>
    <script>
        var scrollMes = document.getElementsByClassName("scrollMe");
        for (var i = 0; i < scrollMes.length; ++i)
            scrollMes[i].scrollTop = 100;
    </script>
</body>
</html>



<!DOCTYPE html>
<html>
<head>
<style>
    p { height: 300px; width: 100px; margin: 0px; }
    p.green { background-color: green; }
    div { height: 100px; width: 100px; }
    div.relative { position: relative }
</style>
</head>
<body>
    <span>http://webkit.org/b/67100: REGRESSION (r93614): Safari Reader doesn't repaint correctly when scrolling</span>
    <span>All the boxes should only contain green content.</span>
    <div class="scrollMe" style="overflow: hidden;">
        <div class="relative">
            <p class="green"></p>
        </div>
    </div>
    <br>
    <div class="scrollMe" style="overflow: scroll;">
        <div class="relative">
            <p class="green"></p>
        </div>
    </div>
    <br>
    <div class="scrollMe" style="overflow: hidden;">
        <div class="relative">
            <p class="green"></p>
        </div>
    </div>
    <br>
    <div class="scrollMe" style="overflow: scroll;">
        <div class="relative">
            <p class="green"></p>
        </div>
    </div>
    <br>
    <script>
        var scrollMes = document.getElementsByClassName("scrollMe");
        for (var i = 0; i < scrollMes.length; ++i)
            scrollMes[i].scrollTop = 100;
    </script>
</body>
</html>



<!DOCTYPE html>
<html>
<head>
<style>
    p { height: 100px; width: 100px; margin: 0px; }
    p.red { background-color: red; }
    p.green { background-color: green; }
    div { height: 100px; width: 100px; }
    div.relative { position: relative }
    div.rotated
    {
        -webkit-transform: rotate(360deg);
        -moz-transform: rotate(360deg);
        transform: rotate(360deg);
    }
    div.translated
    {
        -webkit-transform: translate(0);
        -moz-transform: translate(0);
        transform: translate(0);
    }
</style>
</head>
<body>
    <span>http://webkit.org/b/67100: REGRESSION (r93614): Safari Reader doesn't repaint correctly when scrolling</span>
    <span>All the boxes should only contain green content.</span>
    <!-- Use a translation. -->
    <div class="scrollMe translated" style="overflow: hidden;">
        <div class="relative">
            <p class="red"></p>
            <p class="green"></p>
            <p class="red"></p>
        </div>
    </div>
    <br>
    <div class="scrollMe translated" style="overflow: scroll;">
        <div class="relative">
            <p class="red"></p>
            <p class="green"></p>
            <p class="red"></p>
        </div>
    </div>
    <br>
    <!-- Use a rotation. -->
    <div class="scrollMe rotated" style="overflow: hidden;">
        <div class="relative">
            <p class="red"></p>
            <p class="green"></p>
            <p class="red"></p>
        </div>
    </div>
    <br>
    <div class="scrollMe rotated" style="overflow: scroll;">
        <div class="relative">
            <p class="red"></p>
            <p class="green"></p>
            <p class="red"></p>
        </div>
    </div>
    <br>
    <script>
        var scrollMes = document.getElementsByClassName("scrollMe");
        for (var i = 0; i < scrollMes.length; ++i)
            scrollMes[i].scrollTop = 100;
    </script>
</body>
</html>

Return to Bug 67100

Lines 465-475 void RenderLayer::updateLayerPositionsAfterScroll(UpdateLayerPositionsAfterScrol a/Source/WebCore/rendering/RenderLayer.cpp_sec1
- a/Source/WebCore/rendering/RenderLayer.cpp -5 lines
465	// FIXME: Is it worth passing the offsetFromRoot around like in updateLayerPositions?	465	// FIXME: Is it worth passing the offsetFromRoot around like in updateLayerPositions?
466	computeRepaintRects();	466	computeRepaintRects();
467	flags \|= HasSeenFixedPositionedAncestor;	467	flags \|= HasSeenFixedPositionedAncestor;
468	} else if (renderer()->hasTransform() && !renderer()->isRenderView()) {
469	// Transforms act as fixed position containers, so nothing inside a
470	// transformed element can be fixed relative to the viewport if the
471	// transformed element is not fixed itself or child of a fixed element.
472	return;
473	} else if ((flags & HasSeenAncestorWithOverflowClip) && !m_canSkipRepaintRectsUpdateOnScroll) {	468	} else if ((flags & HasSeenAncestorWithOverflowClip) && !m_canSkipRepaintRectsUpdateOnScroll) {
474	// If we have seen an overflow clip, we should update our repaint rects as clippedOverflowRectForRepaint	469	// If we have seen an overflow clip, we should update our repaint rects as clippedOverflowRectForRepaint
475	// intersects it with our ancestor overflow clip that may have moved.	470	// intersects it with our ancestor overflow clip that may have moved.

Lines 1-3 a/Source/WebCore/ChangeLog_sec1
- a/Source/WebCore/ChangeLog +21 lines
		1	2011-12-28 Julien Chaffraix <jchaffraix@webkit.org>
		2
		3	REGRESSION (r93614): Safari Reader doesn't repaint correctly when scrolling
		4	https://bugs.webkit.org/show_bug.cgi?id=67100
		5
		6	Reviewed by NOBODY (OOPS!).
		7
		8	Tests: fast/layers/scroll-with-transform-composited-layer-expected.html
		9	fast/layers/scroll-with-transform-composited-layer.html
		10	fast/layers/scroll-with-transform-layer-expected.html
		11	fast/layers/scroll-with-transform-layer.html
		12
		13	The regression came from a previous optimization that was wrongly kept after r93614.
		14
		15	* rendering/RenderLayer.cpp:
		16	(WebCore::RenderLayer::updateLayerPositionsAfterScroll):
		17	Remove the early return for transformed layer. This change worked as we used
		18	to call updateLayerPositions from scrollTo which would call updateLayerPosition on
		19	all our descendants. After r93614, this is no longer the case and we explicitely need
		20	to call updateLayerPosition on our descendants from updateLayerPositionsAfterScroll.
		21
1	2011-12-21 Matt Falkenhagen <falken@chromium.org>	22	2011-12-21 Matt Falkenhagen <falken@chromium.org>
2		23
3	Add all ICU languages to LocaleToScriptMappingDefault.cpp	24	Add all ICU languages to LocaleToScriptMappingDefault.cpp

Lines 1-3 a/LayoutTests/ChangeLog_sec1
- a/LayoutTests/ChangeLog +15 lines
		1	2011-12-28 Julien Chaffraix <jchaffraix@webkit.org>
		2
		3	REGRESSION (r93614): Safari Reader doesn't repaint correctly when scrolling
		4	https://bugs.webkit.org/show_bug.cgi?id=67100
		5
		6	Reviewed by NOBODY (OOPS!).
		7
		8	Added 2 ref tests for scrolling inside a transformed layers (either composited
		9	or not).
		10
		11	* fast/layers/scroll-with-transform-composited-layer-expected.html: Added.
		12	* fast/layers/scroll-with-transform-composited-layer.html: Added.
		13	* fast/layers/scroll-with-transform-layer-expected.html: Added.
		14	* fast/layers/scroll-with-transform-layer.html: Added.
		15
1	2011-12-21 Ilya Tikhonovsky <loislo@chromium.org>	16	2011-12-21 Ilya Tikhonovsky <loislo@chromium.org>
2		17
3	Unreviewed update test expectation for svg/custom/linking-uri-01-b.svg	18	Unreviewed update test expectation for svg/custom/linking-uri-01-b.svg

Line 0 a/LayoutTests/fast/layers/scroll-with-transform-composited-layer-expected.html_sec1
- a/LayoutTests/fast/layers/scroll-with-transform-composited-layer-expected.html +50 lines
	1	<!DOCTYPE html>
	2	<html>
	3	<head>
	4	<style>
	5	p { height: 300px; width: 100px; margin: 0px; }
	6	p.green { background-color: green; }
	7	div { height: 100px; width: 100px; }
	8	div.relative { position: relative }
	9	div.composited
	10	{
	11	-webkit-transform: translateZ(0);
	12	-moz-transform: translateZ(0);
	13	transform: translateZ(0);
	14	}
	15	</style>
	16	</head>
	17	<body>
	18	<span>http://webkit.org/b/67100: REGRESSION (r93614): Safari Reader doesn't repaint correctly when scrolling</span>
	19	<span>All the boxes should only contain green content.</span>
	20	<div class="scrollMe composited" style="overflow: hidden;">
	21	<div class="relative">
	22	<p class="green"></p>
	23	</div>
	24	</div>
	25	<br>
	26	<div class="scrollMe composited" style="overflow: scroll;">
	27	<div class="relative">
	28	<p class="green"></p>
	29	</div>
	30	</div>
	31	<br>
	32	<div class="scrollMe composited" style="overflow: hidden;">
	33	<div class="relative">
	34	<p class="green"></p>
	35	</div>
	36	</div>
	37	<br>
	38	<div class="scrollMe composited" style="overflow: scroll;">
	39	<div class="relative">
	40	<p class="green"></p>
	41	</div>
	42	</div>
	43	<br>
	44	<script>
	45	var scrollMes = document.getElementsByClassName("scrollMe");
	46	for (var i = 0; i < scrollMes.length; ++i)
	47	scrollMes[i].scrollTop = 100;
	48	</script>
	49	</body>
	50	</html>