Attachment #178707 for bug #104626

View Details Raw Unified Return to Bug 104626



2012-12-10  Simon Fraser  <simon.fraser@apple.com>

        REGRESSION (r137215): WebKit stretches and shrinks a part of screen on scroll
        https://bugs.webkit.org/show_bug.cgi?id=104626

        Reviewed by NOBODY (OOPS!).

        r137215 removed a compositing layer repaint on size changes. However, there
        are cases where the compositing code constrains layer size by clipping
        with the viewport and a clipping ancestor. When that happens, we must
        invalidate the layer on a size change to avoid showing stretched or
        shrunken content.

        Test: compositing/repaint/clipped-layer-size-change.html

        * rendering/RenderLayerBacking.cpp:
        (WebCore::RenderLayerBacking::RenderLayerBacking):
        (WebCore::RenderLayerBacking::updateCompositedBounds):
        (WebCore::RenderLayerBacking::updateGraphicsLayerGeometry):
        * rendering/RenderLayerBacking.h:
        (RenderLayerBacking):

2012-12-10  Jessie Berlin  <jberlin@apple.com>

        Fix the Mac build after r137233

Lines 101-106 RenderLayerBacking::RenderLayerBacking(RenderLayer* layer) a/Source/WebCore/rendering/RenderLayerBacking.cpp_sec1
- a/Source/WebCore/rendering/RenderLayerBacking.cpp -3 / +11 lines
101	: m_owningLayer(layer)	101	: m_owningLayer(layer)
102	, m_scrollLayerID(0)	102	, m_scrollLayerID(0)
103	, m_artificiallyInflatedBounds(false)	103	, m_artificiallyInflatedBounds(false)
		104	, m_boundsConstrainedByClipping(false)
104	, m_isMainFrameRenderViewLayer(false)	105	, m_isMainFrameRenderViewLayer(false)
105	, m_usingTiledCacheLayer(false)	106	, m_usingTiledCacheLayer(false)
106	, m_requiresOwnBackingStore(true)	107	, m_requiresOwnBackingStore(true)
Lines 366-372 bool RenderLayerBacking::shouldClipCompositedBounds() const a/Source/WebCore/rendering/RenderLayerBacking.cpp_sec2
366	return true;	367	return true;
367	}	368	}
368		369
369
370	void RenderLayerBacking::updateCompositedBounds()	370	void RenderLayerBacking::updateCompositedBounds()
371	{	371	{
372	IntRect layerBounds = compositor()->calculateCompositedBounds(m_owningLayer, m_owningLayer);	372	IntRect layerBounds = compositor()->calculateCompositedBounds(m_owningLayer, m_owningLayer);
Lines 389-395 void RenderLayerBacking::updateCompositedBounds() a/Source/WebCore/rendering/RenderLayerBacking.cpp_sec3
389	clippingBounds.move(-delta.x(), -delta.y());	389	clippingBounds.move(-delta.x(), -delta.y());
390		390
391	layerBounds.intersect(pixelSnappedIntRect(clippingBounds));	391	layerBounds.intersect(pixelSnappedIntRect(clippingBounds));
392	}	392	m_boundsConstrainedByClipping = true;
		393	} else
		394	m_boundsConstrainedByClipping = false;
393		395
394	// If the element has a transform-origin that has fixed lengths, and the renderer has zero size,	396	// If the element has a transform-origin that has fixed lengths, and the renderer has zero size,
395	// then we need to ensure that the compositing layer has non-zero size so that we can apply	397	// then we need to ensure that the compositing layer has non-zero size so that we can apply
Lines 631-638 void RenderLayerBacking::updateGraphicsLayerGeometry() a/Source/WebCore/rendering/RenderLayerBacking.cpp_sec4
631		633
632	FloatSize oldSize = m_graphicsLayer->size();	634	FloatSize oldSize = m_graphicsLayer->size();
633	FloatSize newSize = relativeCompositingBounds.size();	635	FloatSize newSize = relativeCompositingBounds.size();
634	if (oldSize != newSize)	636	if (oldSize != newSize) {
635	m_graphicsLayer->setSize(newSize);	637	m_graphicsLayer->setSize(newSize);
		638	// Usually invalidation will happen via layout etc, but if we've affected the layer
		639	// size by constraining relative to a clipping ancestor or the viewport, we
		640	// have to invalidate to avoid showing stretched content.
		641	if (m_boundsConstrainedByClipping)
		642	m_graphicsLayer->setNeedsDisplay();
		643	}
636		644
637	// If we have a layer that clips children, position it.	645	// If we have a layer that clips children, position it.
638	IntRect clippingBox;	646	IntRect clippingBox;




    IntRect m_compositedBounds;

    bool m_artificiallyInflatedBounds; // bounds had to be made non-zero to make transform-origin work
    bool m_boundsConstrainedByClipping;
    bool m_isMainFrameRenderViewLayer;
    bool m_usingTiledCacheLayer;
    bool m_requiresOwnBackingStore;



2012-12-10  Simon Fraser  <simon.fraser@apple.com>

        REGRESSION(r137215): WebKit stretches and shrinks a part of screen on scroll
        https://bugs.webkit.org/show_bug.cgi?id=104626

        Reviewed by NOBODY (OOPS!).

        Testcase that scrolls an overflow area containing a compositing layer.

        * compositing/repaint/clipped-layer-size-change-expected.html: Added.
        * compositing/repaint/clipped-layer-size-change.html: Added.

2012-12-10  Kangil Han  <kangil.han@samsung.com>

        [EFL] Rebaseline expected results for "visibility:hidden; position: absolute;" cases



<!DOCTYPE html>

<html>
<head>
    <style>
        #container {
            width: 200px;
            height: 200px;
            overflow: hidden;
            border: 1px solid black;
        }
        
        .scroll-content {
            height: 600px;
        }
        
        .inner {
            position: relative;
            width: 150px;
            height: 150px;
            margin-top: -10px; /* force overlap with the composited element */
            margin-left: 10px;
            box-sizing: border-box;
            border: 40px solid black;
        }
        
        .composited {
            height: 50px;
            width: 100px;
            -webkit-transform: translateZ(0);
        }
    </style>
</head>
<body>

    <div id="container">
        <div class="scroll-content">
            <div class="composited"></div>
            <div class="inner"></div>
        </div>
    </div>
</body>
</html>



<!DOCTYPE html>

<html>
<head>
    <style>
        #container {
            width: 200px;
            height: 200px;
            overflow: hidden;
            border: 1px solid black;
        }
        
        .scroll-content {
            height: 600px;
        }
        
        .inner {
            position: relative;
            width: 150px;
            height: 150px;
            margin-top: -10px; /* force overlap with the composited element */
            margin-left: 10px;
            box-sizing: border-box;
            border: 40px solid black;
        }
        
        .composited {
            height: 150px;
            width: 100px;
            -webkit-transform: translateZ(0);
        }
    </style>
    <script>
        if (window.testRunner)
            testRunner.waitUntilDone();

        function doTest()
        {
            window.setTimeout(function() {
                var container = document.getElementById('container');
                window.console.log('scrolling')
                container.scrollTop = 100;
                if (window.testRunner)
                    testRunner.notifyDone();
            }, 0);
        }
        window.addEventListener('load', doTest, false);
    </script>
</head>
<body>

    <div id="container">
        <div class="scroll-content">
            <div class="composited"></div>
            <div class="inner"></div>
        </div>
    </div>
</body>
</html>

Return to Bug 104626

Lines 275-281 private: a/Source/WebCore/rendering/RenderLayerBacking.h_sec1
- a/Source/WebCore/rendering/RenderLayerBacking.h -1 / +2 lines
275		275
276	IntRect m_compositedBounds;	276	IntRect m_compositedBounds;
277		277
278	bool m_artificiallyInflatedBounds; // bounds had to be made non-zero to make transform-origin work	278	bool m_artificiallyInflatedBounds; // bounds had to be made non-zero to make transform-origin work
		279	bool m_boundsConstrainedByClipping;
279	bool m_isMainFrameRenderViewLayer;	280	bool m_isMainFrameRenderViewLayer;
280	bool m_usingTiledCacheLayer;	281	bool m_usingTiledCacheLayer;
281	bool m_requiresOwnBackingStore;	282	bool m_requiresOwnBackingStore;

Lines 1-3 a/Source/WebCore/ChangeLog_sec1
- a/Source/WebCore/ChangeLog +22 lines
		1	2012-12-10 Simon Fraser <simon.fraser@apple.com>
		2
		3	REGRESSION (r137215): WebKit stretches and shrinks a part of screen on scroll
		4	https://bugs.webkit.org/show_bug.cgi?id=104626
		5
		6	Reviewed by NOBODY (OOPS!).
		7
		8	r137215 removed a compositing layer repaint on size changes. However, there
		9	are cases where the compositing code constrains layer size by clipping
		10	with the viewport and a clipping ancestor. When that happens, we must
		11	invalidate the layer on a size change to avoid showing stretched or
		12	shrunken content.
		13
		14	Test: compositing/repaint/clipped-layer-size-change.html
		15
		16	* rendering/RenderLayerBacking.cpp:
		17	(WebCore::RenderLayerBacking::RenderLayerBacking):
		18	(WebCore::RenderLayerBacking::updateCompositedBounds):
		19	(WebCore::RenderLayerBacking::updateGraphicsLayerGeometry):
		20	* rendering/RenderLayerBacking.h:
		21	(RenderLayerBacking):
		22
1	2012-12-10 Jessie Berlin <jberlin@apple.com>	23	2012-12-10 Jessie Berlin <jberlin@apple.com>
2		24
3	Fix the Mac build after r137233	25	Fix the Mac build after r137233

Lines 1-3 a/LayoutTests/ChangeLog_sec1
- a/LayoutTests/ChangeLog +12 lines
		1	2012-12-10 Simon Fraser <simon.fraser@apple.com>
		2
		3	REGRESSION(r137215): WebKit stretches and shrinks a part of screen on scroll
		4	https://bugs.webkit.org/show_bug.cgi?id=104626
		5
		6	Reviewed by NOBODY (OOPS!).
		7
		8	Testcase that scrolls an overflow area containing a compositing layer.
		9
		10	* compositing/repaint/clipped-layer-size-change-expected.html: Added.
		11	* compositing/repaint/clipped-layer-size-change.html: Added.
		12
1	2012-12-10 Kangil Han <kangil.han@samsung.com>	13	2012-12-10 Kangil Han <kangil.han@samsung.com>
2		14
3	[EFL] Rebaseline expected results for "visibility:hidden; position: absolute;" cases	15	[EFL] Rebaseline expected results for "visibility:hidden; position: absolute;" cases

Line 0 a/LayoutTests/compositing/repaint/clipped-layer-size-change-expected.html_sec1
- a/LayoutTests/compositing/repaint/clipped-layer-size-change-expected.html +43 lines
	1	<!DOCTYPE html>
	2
	3	<html>
	4	<head>
	5	<style>
	6	#container {
	7	width: 200px;
	8	height: 200px;
	9	overflow: hidden;
	10	border: 1px solid black;
	11	}
	12
	13	.scroll-content {
	14	height: 600px;
	15	}
	16
	17	.inner {
	18	position: relative;
	19	width: 150px;
	20	height: 150px;
	21	margin-top: -10px; /* force overlap with the composited element */
	22	margin-left: 10px;
	23	box-sizing: border-box;
	24	border: 40px solid black;
	25	}
	26
	27	.composited {
	28	height: 50px;
	29	width: 100px;
	30	-webkit-transform: translateZ(0);
	31	}
	32	</style>
	33	</head>
	34	<body>
	35
	36	<div id="container">
	37	<div class="scroll-content">
	38	<div class="composited"></div>
	39	<div class="inner"></div>
	40	</div>
	41	</div>
	42	</body>
	43	</html>