Fix border-radius computed style code to reflect that percentage Y values are percentages of the box height. (Bug 595650) r=bzbarsky a2.0=blocking2.0:betaN
authorL. David Baron <dbaron@dbaron.org>
Wed, 06 Oct 2010 21:25:47 -0700
changeset 55046 a409cf6a864eede77911a29049eba5bdd3507ea9
parent 55045 74a0c9dba31781700c1e3d1c2dd1d1561529272f
child 55047 ba73f9a24cb112b16ec04eb834b4961447c5604f
push id16120
push userdbaron@mozilla.com
push dateThu, 07 Oct 2010 04:26:21 +0000
treeherdermozilla-central@1aab37daf3bc [default view] [failures only]
perfherder[talos] [build metrics] [platform microbench] (compared to previous push)
reviewersbzbarsky
bugs595650
milestone2.0b8pre
first release with
nightly linux32
nightly linux64
nightly mac
nightly win32
nightly win64
last release without
nightly linux32
nightly linux64
nightly mac
nightly win32
nightly win64
Fix border-radius computed style code to reflect that percentage Y values are percentages of the box height. (Bug 595650) r=bzbarsky a2.0=blocking2.0:betaN
layout/style/nsComputedDOMStyle.cpp
layout/style/nsComputedDOMStyle.h
layout/style/test/Makefile.in
layout/style/test/test_bug365932.html
layout/style/test/test_computed_style.html
--- a/layout/style/nsComputedDOMStyle.cpp
+++ b/layout/style/nsComputedDOMStyle.cpp
@@ -2322,28 +2322,43 @@ nsComputedDOMStyle::DoGetOutlineColor(ns
   return NS_OK;
 }
 
 nsresult
 nsComputedDOMStyle::GetEllipseRadii(const nsStyleCorners& aRadius,
                                     PRUint8 aFullCorner,
                                     nsIDOMCSSValue** aValue)
 {
-  const nsStyleCoord& radiusX
+  nsStyleCoord radiusX
     = aRadius.Get(NS_FULL_TO_HALF_CORNER(aFullCorner, PR_FALSE));
-  const nsStyleCoord& radiusY
+  nsStyleCoord radiusY
     = aRadius.Get(NS_FULL_TO_HALF_CORNER(aFullCorner, PR_TRUE));
 
+  if (mInnerFrame) {
+    // We need to convert to absolute coordinates before doing the
+    // equality check below.
+    nscoord v;
+
+    v = StyleCoordToNSCoord(radiusX,
+                            &nsComputedDOMStyle::GetFrameBorderRectWidth,
+                            0, PR_TRUE);
+    radiusX.SetCoordValue(v);
+
+    v = StyleCoordToNSCoord(radiusY,
+                            &nsComputedDOMStyle::GetFrameBorderRectHeight,
+                            0, PR_TRUE);
+    radiusY.SetCoordValue(v);
+  }
+
   // for compatibility, return a single value if X and Y are equal
   if (radiusX == radiusY) {
     nsROCSSPrimitiveValue *val = GetROCSSPrimitiveValue();
     NS_ENSURE_TRUE(val, NS_ERROR_OUT_OF_MEMORY);
 
-    SetValueToCoord(val, radiusX, PR_TRUE,
-                    &nsComputedDOMStyle::GetFrameBorderRectWidth);
+    SetValueToCoord(val, radiusX, PR_TRUE);
 
     NS_ADDREF(*aValue = val);
     return NS_OK;
   } else {
     nsDOMCSSValueList *valueList = GetROCSSValueList(PR_FALSE);
     NS_ENSURE_TRUE(valueList, NS_ERROR_OUT_OF_MEMORY);
 
     nsROCSSPrimitiveValue *valX = GetROCSSPrimitiveValue();
@@ -2356,20 +2371,18 @@ nsComputedDOMStyle::GetEllipseRadii(cons
     nsROCSSPrimitiveValue *valY = GetROCSSPrimitiveValue();
     if (!valY || !valueList->AppendCSSValue(valY)) {
       delete valY;
       // valX deleted by valueList destructor
       delete valueList;
       return NS_ERROR_OUT_OF_MEMORY;
     }
 
-    SetValueToCoord(valX, radiusX, PR_TRUE,
-                    &nsComputedDOMStyle::GetFrameBorderRectWidth);
-    SetValueToCoord(valY, radiusY, PR_TRUE,
-                    &nsComputedDOMStyle::GetFrameBorderRectWidth);
+    SetValueToCoord(valX, radiusX, PR_TRUE);
+    SetValueToCoord(valY, radiusY, PR_TRUE);
 
     NS_ADDREF(*aValue = valueList);
     return NS_OK;
   }
 }
 
 nsresult
 nsComputedDOMStyle::GetCSSShadowArray(nsCSSShadowArray* aArray,
@@ -4040,16 +4053,29 @@ nsComputedDOMStyle::GetFrameBorderRectWi
 
   AssertFlushedPendingReflows();
 
   aWidth = mInnerFrame->GetSize().width;
   return PR_TRUE;
 }
 
 PRBool
+nsComputedDOMStyle::GetFrameBorderRectHeight(nscoord& aHeight)
+{
+  if (!mInnerFrame) {
+    return PR_FALSE;
+  }
+
+  AssertFlushedPendingReflows();
+
+  aHeight = mInnerFrame->GetSize().height;
+  return PR_TRUE;
+}
+
+PRBool
 nsComputedDOMStyle::GetFrameBoundsWidthForTransform(nscoord& aWidth)
 {
   // We need a frame to work with.
   if (!mInnerFrame) {
     return PR_FALSE;
   }
 
   AssertFlushedPendingReflows();
--- a/layout/style/nsComputedDOMStyle.h
+++ b/layout/style/nsComputedDOMStyle.h
@@ -445,16 +445,17 @@ private:
                               nscoord aDefaultValue,
                               PRBool aClampNegativeCalc);
 
   PRBool GetCBContentWidth(nscoord& aWidth);
   PRBool GetCBContentHeight(nscoord& aWidth);
   PRBool GetFrameBoundsWidthForTransform(nscoord &aWidth);
   PRBool GetFrameBoundsHeightForTransform(nscoord &aHeight);
   PRBool GetFrameBorderRectWidth(nscoord& aWidth);
+  PRBool GetFrameBorderRectHeight(nscoord& aHeight);
 
   struct ComputedStyleMapEntry
   {
     // Create a pointer-to-member-function type.
     typedef nsresult (nsComputedDOMStyle::*ComputeMethod)(nsIDOMCSSValue**);
 
     nsCSSProperty mProperty;
     ComputeMethod mGetter;
--- a/layout/style/test/Makefile.in
+++ b/layout/style/test/Makefile.in
@@ -132,16 +132,17 @@ GARBAGE += css_properties.js
 		test_bug499655.xhtml \
 		test_bug517224.html \
 		test_bug524175.html \
 		test_bug534804.html \
 		test_bug573255.html \
 		test_bug580685.html \
 		test_cascade.html \
 		test_compute_data_with_start_struct.html \
+		test_computed_style.html \
 		test_computed_style_no_pseudo.html \
 		test_css_cross_domain.html \
 		test_css_eof_handling.html \
 		test_descriptor_storage.html \
 		test_descriptor_syntax_errors.html \
 		test_dont_use_document_colors.html \
 		test_font_face_parser.html \
 		test_garbage_at_end_of_declarations.html \
--- a/layout/style/test/test_bug365932.html
+++ b/layout/style/test/test_bug365932.html
@@ -142,19 +142,19 @@ https://bugzilla.mozilla.org/show_bug.cg
   <div id="minmaxheight10-2" class="auto"
        style="min-height: 600px; max-height: 40%"></div>
   <div id="minmaxheight11-1" class="auto"
        style="min-height: 75%; max-height: 320px"></div>
   <div id="minmaxheight11-2" class="auto"
        style="min-height: 75%; max-height: 40%"></div>
 
   <div id="radius1" style="border-radius: 80px"></div>
-  <div id="radius2" style="border-radius: 10%"></div>
+  <div id="radius2" style="border-radius: 10% / 20%"></div>
   <div id="outlineradius1" style="-moz-outline-radius: 160px"></div>
-  <div id="outlineradius2" style="-moz-outline-radius: 20%"></div>
+  <div id="outlineradius2" style="-moz-outline-radius: 20% / 40%"></div>
 </div>
 <div id="content2" style="display: none">
   <div id="indent3" style="text-indent: 400px"></div>
   <div id="indent4" style="text-indent: 50%"></div>
 
   <div id="minwidth1-3" style="min-width: 200px"></div>
   <div id="minwidth1-4" style="min-width: 25%"></div>
   <div id="minwidth2-3" style="min-width: 600px"></div>
new file mode 100644
--- /dev/null
+++ b/layout/style/test/test_computed_style.html
@@ -0,0 +1,80 @@
+<!DOCTYPE HTML>
+<html>
+<head>
+  <title>Test for miscellaneous computed style issues</title>
+  <script type="application/javascript" src="/MochiKit/packed.js"></script>
+  <script type="application/javascript" src="/tests/SimpleTest/SimpleTest.js"></script>
+  <link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css"/>
+</head>
+<body>
+<a target="_blank" href="https://bugzilla.mozilla.org/show_bug.cgi?id=">Mozilla Bug </a>
+<p id="display"></p>
+<div id="content" style="display: none">
+  
+</div>
+<pre id="test">
+<script type="application/javascript">
+
+/** Test for miscellaneous computed style issues **/
+
+var frame_container = document.getElementById("display");
+var noframe_container = document.getElementById("content");
+
+(function test_bug_595650() {
+  // Test handling of horizontal and vertical percentages for border-radius
+  // and -moz-outline-radius.
+  var p = document.createElement("p");
+  p.setAttribute("style", "width: 256px; height: 128px");
+  p.style.borderTopLeftRadius = "1.5625%"; /* 1/64 == 4px 2px */
+  p.style.borderTopRightRadius = "5px";
+  p.style.borderBottomRightRadius = "5px 3px";
+  p.style.borderBottomLeftRadius = "1.5625% 3.125%" /* 1/64 1/32 == 4px 4px */
+  p.style.MozOutlineRadiusTopleft = "1.5625%"; /* 1/64 == 4px 2px */
+  p.style.MozOutlineRadiusTopright = "5px";
+  p.style.MozOutlineRadiusBottomright = "5px 3px";
+  p.style.MozOutlineRadiusBottomleft = "1.5625% 3.125%" /* 1/64 1/32 == 4px 4px */
+  var cs = getComputedStyle(p, "");
+
+  frame_container.appendChild(p);
+  is(cs.borderTopLeftRadius, "4px 2px",
+     "computed value of % border-radius, with frame");
+  is(cs.borderTopRightRadius, "5px",
+     "computed value of px border-radius, with frame");
+  is(cs.borderBottomRightRadius, "5px 3px",
+     "computed value of px border-radius, with frame");
+  is(cs.borderBottomLeftRadius, "4px",
+     "computed value of % border-radius, with frame");
+  is(cs.MozOutlineRadiusTopleft, "4px 2px",
+     "computed value of % outline-radius, with frame");
+  is(cs.MozOutlineRadiusTopright, "5px",
+     "computed value of px outline-radius, with frame");
+  is(cs.MozOutlineRadiusBottomright, "5px 3px",
+     "computed value of px outline-radius, with frame");
+  is(cs.MozOutlineRadiusBottomleft, "4px",
+     "computed value of % outline-radius, with frame");
+
+  noframe_container.appendChild(p);
+  is(cs.borderTopLeftRadius, "1.5625%",
+     "computed value of % border-radius, without frame");
+  is(cs.borderTopRightRadius, "5px",
+     "computed value of px border-radius, without frame");
+  is(cs.borderBottomRightRadius, "5px 3px",
+     "computed value of px border-radius, without frame");
+  is(cs.borderBottomLeftRadius, "1.5625% 3.125%",
+     "computed value of % border-radius, without frame");
+  is(cs.MozOutlineRadiusTopleft, "1.5625%",
+     "computed value of % outline-radius, without frame");
+  is(cs.MozOutlineRadiusTopright, "5px",
+     "computed value of px outline-radius, without frame");
+  is(cs.MozOutlineRadiusBottomright, "5px 3px",
+     "computed value of px outline-radius, without frame");
+  is(cs.MozOutlineRadiusBottomleft, "1.5625% 3.125%",
+     "computed value of % outline-radius, without frame");
+
+  p.parentNode.removeChild(p);
+})();
+
+</script>
+</pre>
+</body>
+</html>