New issue
Advanced search Search tips
Note: Color blocks (like or ) mean that a user may not be available. Tooltip shows the reason.
Starred by 1 user

Issue metadata

Status: Fixed
Owner:
Closed: Jan 2014
Cc:
Components:
EstimatedDays: ----
NextAction: ----
OS: All
Pri: 2
Type: Bug



Sign in to add a comment
link

Issue 310874: Viewport-percentage lengths are not always updated when viewport size changes

Reported by wangxianzhu@chromium.org, Oct 24 2013 Project Member

Issue description

Version: All
OS: All

What steps will reproduce the problem?
1. Open the attached test case
2. Change the viewport size

What is the expected output? What do you see instead?
Expected: the width and height of blue rectangle should be always 50% of the width and height of the viewport respectively.
Actual: the width and height of the blue rectangle don't change.

Viewport-percentage elements may be ignored to be layout when it's parent RenderObject doesn't need be layout according to the current logic.

I think these elements need to be specially handled, e.g. letting RenderView manage a list of such elements and set needsLayout flag for them whenever viewport size changes.
 
viewportpercentage.html
335 bytes View Download

Comment 1 by wangxianzhu@chromium.org, Oct 24 2013

Blocking: chromium:310875

Comment 2 by wangxianzhu@chromium.org, Oct 29 2013

Cc: esprehn@chromium.org
Owner: timothe@chromium.org
Summary: Viewport-percentage lengths are not always updated when viewport size changes (was: Viewport-percentage lengths are not always updated during layout)
Thanks everyone for the feedbacks to https://codereview.chromium.org/43873004/ (Closed).

Assigning to timothe@ who perhaps will work on this issue soon. Thanks!

Comment 3 by wangxianzhu@chromium.org, Oct 31 2013

Blocking: -chromium:310875

Comment 4 by wangxianzhu@chromium.org, Dec 3 2013

timothe@, would you work on this bug in the coming weeks? If not I'd take over it and continue https://codereview.chromium.org/43873004/.

Comment 5 by timothe@chromium.org, Dec 3 2013

Wrong person perhaps? I haven no knowledge about this specific bug sorry.

Comment 6 by wangxianzhu@chromium.org, Dec 3 2013

Owner: timloh@chromium.org
Sorry, should be timloh@.

Comment 7 by timloh@chromium.org, Dec 3 2013

Working on this right now. Cheers.

Comment 8 by bugdroid1@chromium.org, Jan 3 2014

Project Member
The following revision refers to this bug:
    http://src.chromium.org/viewvc/blink?view=rev&rev=164448

------------------------------------------------------------------------
r164448 | timloh@chromium.org | 2014-01-03T08:28:33.534806Z

Changed paths:
   M http://src.chromium.org/viewvc/blink/trunk/LayoutTests/css3/viewport-percentage-lengths/css3-viewport-percentage-lengths-getStyle.html?r1=164448&r2=164447&pathrev=164448
   M http://src.chromium.org/viewvc/blink/trunk/Source/core/rendering/RootInlineBox.cpp?r1=164448&r2=164447&pathrev=164448
   M http://src.chromium.org/viewvc/blink/trunk/LayoutTests/fast/masking/parsing-clip-path-shape-expected.txt?r1=164448&r2=164447&pathrev=164448
   M http://src.chromium.org/viewvc/blink/trunk/Source/core/css/CSSPrimitiveValue.h?r1=164448&r2=164447&pathrev=164448
   M http://src.chromium.org/viewvc/blink/trunk/Source/core/css/resolver/StyleResolverState.cpp?r1=164448&r2=164447&pathrev=164448
   M http://src.chromium.org/viewvc/blink/trunk/LayoutTests/virtual/legacy-animations-engine/animations/interpolation/line-height-interpolation-expected.txt?r1=164448&r2=164447&pathrev=164448
   M http://src.chromium.org/viewvc/blink/trunk/Source/core/rendering/RenderMenuList.cpp?r1=164448&r2=164447&pathrev=164448
   M http://src.chromium.org/viewvc/blink/trunk/Source/core/animation/AnimatableLengthTest.cpp?r1=164448&r2=164447&pathrev=164448
   M http://src.chromium.org/viewvc/blink/trunk/Source/core/css/resolver/StyleResolver.h?r1=164448&r2=164447&pathrev=164448
   M http://src.chromium.org/viewvc/blink/trunk/Source/core/rendering/style/RenderStyle.h?r1=164448&r2=164447&pathrev=164448
   M http://src.chromium.org/viewvc/blink/trunk/Source/platform/Length.h?r1=164448&r2=164447&pathrev=164448
   M http://src.chromium.org/viewvc/blink/trunk/Source/core/rendering/RenderView.cpp?r1=164448&r2=164447&pathrev=164448
   M http://src.chromium.org/viewvc/blink/trunk/LayoutTests/fast/css/computed-offset-with-zoom-expected.txt?r1=164448&r2=164447&pathrev=164448
   M http://src.chromium.org/viewvc/blink/trunk/Source/core/css/CSSCalculationValueTest.cpp?r1=164448&r2=164447&pathrev=164448
   M http://src.chromium.org/viewvc/blink/trunk/LayoutTests/platform/win/virtual/legacy-animations-engine/animations/interpolation/line-height-interpolation-expected.txt?r1=164448&r2=164447&pathrev=164448
   M http://src.chromium.org/viewvc/blink/trunk/Source/core/html/HTMLMetaElement-in.cpp?r1=164448&r2=164447&pathrev=164448
   M http://src.chromium.org/viewvc/blink/trunk/LayoutTests/platform/linux/virtual/legacy-animations-engine/animations/interpolation/line-height-interpolation-expected.txt?r1=164448&r2=164447&pathrev=164448
   M http://src.chromium.org/viewvc/blink/trunk/LayoutTests/fast/masking/parsing-clip-path-shape.html?r1=164448&r2=164447&pathrev=164448
   M http://src.chromium.org/viewvc/blink/trunk/Source/core/rendering/RenderGrid.cpp?r1=164448&r2=164447&pathrev=164448
   A http://src.chromium.org/viewvc/blink/trunk/LayoutTests/css3/viewport-percentage-lengths/viewport-percentage-lengths-page-zoom-expected.txt?r1=164448&r2=164447&pathrev=164448
   M http://src.chromium.org/viewvc/blink/trunk/Source/core/rendering/RenderTable.cpp?r1=164448&r2=164447&pathrev=164448
   M http://src.chromium.org/viewvc/blink/trunk/Source/core/css/CSSPrimitiveValue.cpp?r1=164448&r2=164447&pathrev=164448
   M http://src.chromium.org/viewvc/blink/trunk/Source/core/css/resolver/FontBuilder.h?r1=164448&r2=164447&pathrev=164448
   M http://src.chromium.org/viewvc/blink/trunk/Source/core/css/CSSLengthFunctions.cpp?r1=164448&r2=164447&pathrev=164448
   M http://src.chromium.org/viewvc/blink/trunk/Source/web/PageScaleConstraintsSet.cpp?r1=164448&r2=164447&pathrev=164448
   M http://src.chromium.org/viewvc/blink/trunk/LayoutTests/fast/css/computed-offset-with-zoom.html?r1=164448&r2=164447&pathrev=164448
   M http://src.chromium.org/viewvc/blink/trunk/Source/core/rendering/svg/RenderSVGRoot.cpp?r1=164448&r2=164447&pathrev=164448
   M http://src.chromium.org/viewvc/blink/trunk/Source/core/frame/FrameView.cpp?r1=164448&r2=164447&pathrev=164448
   M http://src.chromium.org/viewvc/blink/trunk/Source/core/css/MediaQueryEvaluator.cpp?r1=164448&r2=164447&pathrev=164448
   M http://src.chromium.org/viewvc/blink/trunk/Source/core/rendering/RenderBR.cpp?r1=164448&r2=164447&pathrev=164448
   M http://src.chromium.org/viewvc/blink/trunk/Source/core/css/CSSToLengthConversionData.cpp?r1=164448&r2=164447&pathrev=164448
   M http://src.chromium.org/viewvc/blink/trunk/Source/core/rendering/RenderScrollbarPart.cpp?r1=164448&r2=164447&pathrev=164448
   A http://src.chromium.org/viewvc/blink/trunk/LayoutTests/css3/viewport-percentage-lengths/viewport-percentage-lengths-page-zoom.html?r1=164448&r2=164447&pathrev=164448
   M http://src.chromium.org/viewvc/blink/trunk/LayoutTests/fast/shapes/parsing/parsing-shape-lengths-expected.txt?r1=164448&r2=164447&pathrev=164448
   M http://src.chromium.org/viewvc/blink/trunk/Source/core/css/CSSGradientValue.cpp?r1=164448&r2=164447&pathrev=164448
   M http://src.chromium.org/viewvc/blink/trunk/Source/core/rendering/RenderView.h?r1=164448&r2=164447&pathrev=164448
   M http://src.chromium.org/viewvc/blink/trunk/Source/core/rendering/RenderReplaced.cpp?r1=164448&r2=164447&pathrev=164448
   M http://src.chromium.org/viewvc/blink/trunk/Source/core/css/resolver/MatchedPropertiesCache.cpp?r1=164448&r2=164447&pathrev=164448
   M http://src.chromium.org/viewvc/blink/trunk/Source/core/css/resolver/FontBuilder.cpp?r1=164448&r2=164447&pathrev=164448
   A http://src.chromium.org/viewvc/blink/trunk/LayoutTests/css3/viewport-percentage-lengths/viewport-percentage-lengths-resize-expected.txt?r1=164448&r2=164447&pathrev=164448
   M http://src.chromium.org/viewvc/blink/trunk/Source/core/css/CSSComputedStyleDeclaration.cpp?r1=164448&r2=164447&pathrev=164448
   M http://src.chromium.org/viewvc/blink/trunk/Source/core/rendering/RenderBoxModelObject.cpp?r1=164448&r2=164447&pathrev=164448
   M http://src.chromium.org/viewvc/blink/trunk/Source/core/dom/TreeScope.h?r1=164448&r2=164447&pathrev=164448
   M http://src.chromium.org/viewvc/blink/trunk/LayoutTests/animations/interpolation/line-height-interpolation-expected.txt?r1=164448&r2=164447&pathrev=164448
   M http://src.chromium.org/viewvc/blink/trunk/Source/web/WebViewImpl.cpp?r1=164448&r2=164447&pathrev=164448
   M http://src.chromium.org/viewvc/blink/trunk/LayoutTests/fast/shapes/parsing/parsing-shape-lengths.html?r1=164448&r2=164447&pathrev=164448
   M http://src.chromium.org/viewvc/blink/trunk/Source/core/css/CSSLengthFunctions.h?r1=164448&r2=164447&pathrev=164448
   M http://src.chromium.org/viewvc/blink/trunk/Source/core/rendering/RenderFlexibleBox.h?r1=164448&r2=164447&pathrev=164448
   M http://src.chromium.org/viewvc/blink/trunk/Source/core/svg/SVGSVGElement.cpp?r1=164448&r2=164447&pathrev=164448
   M http://src.chromium.org/viewvc/blink/trunk/Source/core/css/CSSToLengthConversionData.h?r1=164448&r2=164447&pathrev=164448
   M http://src.chromium.org/viewvc/blink/trunk/Source/core/rendering/RenderThemeChromiumMac.mm?r1=164448&r2=164447&pathrev=164448
   M http://src.chromium.org/viewvc/blink/trunk/Source/core/css/resolver/StyleBuilderCustom.cpp?r1=164448&r2=164447&pathrev=164448
   M http://src.chromium.org/viewvc/blink/trunk/Source/core/rendering/RenderInline.cpp?r1=164448&r2=164447&pathrev=164448
   M http://src.chromium.org/viewvc/blink/trunk/Source/core/css/CSSCalculationValue.cpp?r1=164448&r2=164447&pathrev=164448
   A http://src.chromium.org/viewvc/blink/trunk/LayoutTests/css3/viewport-percentage-lengths/viewport-percentage-lengths-resize.html?r1=164448&r2=164447&pathrev=164448
   M http://src.chromium.org/viewvc/blink/trunk/Source/core/dom/Document.cpp?r1=164448&r2=164447&pathrev=164448
   M http://src.chromium.org/viewvc/blink/trunk/Source/core/css/resolver/StyleBuilderConverter.h?r1=164448&r2=164447&pathrev=164448
   M http://src.chromium.org/viewvc/blink/trunk/Source/core/dom/ViewportDescription.cpp?r1=164448&r2=164447&pathrev=164448
   M http://src.chromium.org/viewvc/blink/trunk/Source/core/css/resolver/MatchedPropertiesCache.h?r1=164448&r2=164447&pathrev=164448
   M http://src.chromium.org/viewvc/blink/trunk/Source/core/rendering/RenderBox.cpp?r1=164448&r2=164447&pathrev=164448
   M http://src.chromium.org/viewvc/blink/trunk/Source/core/css/CSSMatrix.cpp?r1=164448&r2=164447&pathrev=164448
   M http://src.chromium.org/viewvc/blink/trunk/Source/platform/LengthFunctions.cpp?r1=164448&r2=164447&pathrev=164448
   M http://src.chromium.org/viewvc/blink/trunk/Source/core/rendering/RenderText.h?r1=164448&r2=164447&pathrev=164448
   M http://src.chromium.org/viewvc/blink/trunk/Source/core/rendering/RenderBlock.cpp?r1=164448&r2=164447&pathrev=164448
   M http://src.chromium.org/viewvc/blink/trunk/Source/core/dom/TreeScope.cpp?r1=164448&r2=164447&pathrev=164448
   M http://src.chromium.org/viewvc/blink/trunk/Source/core/rendering/RenderTableCell.h?r1=164448&r2=164447&pathrev=164448
   M http://src.chromium.org/viewvc/blink/trunk/Source/core/css/CSSPrimitiveValueMappings.h?r1=164448&r2=164447&pathrev=164448
   M http://src.chromium.org/viewvc/blink/trunk/Source/core/html/HTMLAreaElement.cpp?r1=164448&r2=164447&pathrev=164448
   M http://src.chromium.org/viewvc/blink/trunk/Source/core/css/resolver/ViewportStyleResolver.cpp?r1=164448&r2=164447&pathrev=164448
   M http://src.chromium.org/viewvc/blink/trunk/Source/core/css/resolver/StyleResolver.cpp?r1=164448&r2=164447&pathrev=164448
   M http://src.chromium.org/viewvc/blink/trunk/Source/core/rendering/style/RenderStyle.cpp?r1=164448&r2=164447&pathrev=164448
   M http://src.chromium.org/viewvc/blink/trunk/LayoutTests/css3/viewport-percentage-lengths/css3-viewport-percentage-lengths-getStyle-expected.txt?r1=164448&r2=164447&pathrev=164448
   M http://src.chromium.org/viewvc/blink/trunk/Source/core/rendering/RenderFlexibleBox.cpp?r1=164448&r2=164447&pathrev=164448
   M http://src.chromium.org/viewvc/blink/trunk/Source/core/rendering/RenderObject.cpp?r1=164448&r2=164447&pathrev=164448
   M http://src.chromium.org/viewvc/blink/trunk/Source/core/rendering/RenderTableSection.cpp?r1=164448&r2=164447&pathrev=164448
   M http://src.chromium.org/viewvc/blink/trunk/Source/core/animation/css/CSSAnimatableValueFactory.cpp?r1=164448&r2=164447&pathrev=164448
   M http://src.chromium.org/viewvc/blink/trunk/Source/core/dom/Document.h?r1=164448&r2=164447&pathrev=164448

Move viewport unit resolution to style recalc time

This patch moves the resolution of viewport units to style recalc time.
Currently viewport units are left unresolved during style recalcs which
leads to several problems (see linked bugs). Moving the resolution will
fix these problems, as well as reduce the plumbing that goes on. 

This patch is touches a lot of files since the valueForLength functions
now no longer need a RenderView, but the interesting changes are in:

- CSSToLengthConversionData -> CSSPrimitiveValue, for moving resolution
to style recalc time
- Length / LengthFunction, no longer needs to know about viewport units
- FrameView -> Document -> MatchedPropertiesCache, for scheduling style
recalcs upon resize

Viewport Lengths are currently also used in viewport descriptions (that
is, @viewport and the viewport meta tag). I've added to Length two more
enum values (DeviceWidth and DeviceHeight), alongside ExtendToZoom.

Note that getComputedStyle will now do the right thing and return pixel
values when viewport units are used. This behaviour matches Firefox and
the css3-cascade spec.

I've added a test for the most starred bug (124331) and for the various
other issues fixed by this patch I'll make test-only patches.

Note that calc integration with viewport units will be fixed separately
to simplify reviews.

TBR=dglazkov@chromium.org
BUG= 124331 , 137617 , 125709 , 261298 , 173407 , 322365 , 310874 , 311465 

Review URL: https://codereview.chromium.org/82083002
------------------------------------------------------------------------

Comment 9 by timloh@chromium.org, Jan 6 2014

Status: Fixed

Comment 10 by laforge@google.com, Jan 9 2015

Labels: -Cr-Blink-Rendering Cr-Blink-Layout
Migrate from Cr-Blink-Rendering to Cr-Blink-Layout

Sign in to add a comment