Index: third_party/WebKit/LayoutTests/svg/dom/SVGLength-calc-in-attr.html |
diff --git a/third_party/WebKit/LayoutTests/svg/dom/SVGLength-calc-in-attr.html b/third_party/WebKit/LayoutTests/svg/dom/SVGLength-calc-in-attr.html |
new file mode 100644 |
index 0000000000000000000000000000000000000000..7999cbb7c9861ac426919b605318e05501abe90a |
--- /dev/null |
+++ b/third_party/WebKit/LayoutTests/svg/dom/SVGLength-calc-in-attr.html |
@@ -0,0 +1,91 @@ |
+<!DOCTYPE html> |
+<script src="../../resources/testharness.js"></script> |
+<script src="../../resources/testharnessreport.js"></script> |
+<svg width="500px" height="500px" viewBox="0 0 500 500"> |
+ <rect width="1" height="1"/> |
+ <marker markerWidth="1" markerHeight="1"/> |
+</svg> |
+<script> |
+var viewportWidth = 500; |
+var EPSILON = Math.pow(2, -8); |
+var cssPixelsPerInch = 96; |
+var cssPixelsPerCentimeter = cssPixelsPerInch / 2.54; //2.54 cm/in |
+var cssPixelsPerMillimeter = cssPixelsPerCentimeter / 10; |
+var cssPixelsPerPoint = cssPixelsPerInch / 72; |
+var cssPixelsPerPica = cssPixelsPerInch / 6; |
+ |
+function viewportWidthPercent() { |
+ return viewportWidth / 100; |
+} |
+ |
+function assert_calc_expression_on_width_attr(expression, expected) { |
+ var rect = document.querySelector('rect'); |
+ var rectWidth; |
+ // Test calc with setAttribute |
+ rect.setAttribute('width', expression); |
+ rectWidth = rect.getBoundingClientRect().width; |
+ assert_approx_equals(rectWidth, expected, EPSILON); |
+ assert_approx_equals(rect.width.baseVal.value, expected, EPSILON); |
+ assert_equals(rect.width.baseVal.unitType, SVGLength.SVG_LENGTHTYPE_UNKNOWN); |
+ assert_equals(rect.width.baseVal.valueInSpecifiedUnits, 0); |
+ |
+ // Test valueInSpecifiedUnits setter after 'calc' value attribute |
+ rect.width.baseVal.valueInSpecifiedUnits = 100; |
+ assert_equals(rect.width.baseVal.unitType, SVGLength.SVG_LENGTHTYPE_NUMBER); |
+ assert_equals(rect.width.baseVal.valueInSpecifiedUnits, 100); |
+ |
+ // Test value setter after 'calc' value attribute |
+ rect.setAttribute('width', expression); // reset to calc value |
+ rect.width.baseVal.value = 10; |
+ assert_equals(rect.width.baseVal.unitType, SVGLength.SVG_LENGTHTYPE_NUMBER); |
+ assert_equals(rect.width.baseVal.valueInSpecifiedUnits, 10); |
+ |
+ // Test calc with "valueAsString" |
+ rect.setAttribute('width', '20px'); // reset to normal value |
+ assert_throws(null, function() {rect.width.baseVal.valueAsString = expression}); |
+ assert_equals(rect.width.baseVal.value, 20); |
+} |
+ |
+function assert_calc_expression_on_markerWidth_attr(expression, expected) { |
+ var marker = document.querySelector('marker'); |
+ // Test calc with setAttribute |
+ marker.setAttribute('markerWidth', expression); |
+ assert_approx_equals(marker.markerWidth.baseVal.value, expected, EPSILON); |
+ assert_equals(marker.markerWidth.baseVal.unitType, SVGLength.SVG_LENGTHTYPE_UNKNOWN); |
+ assert_equals(marker.markerWidth.baseVal.valueInSpecifiedUnits, 0); |
+ |
+ // Test valueInSpecifiedUnits setter after 'calc' value attribute |
+ marker.markerWidth.baseVal.valueInSpecifiedUnits = 100; |
+ assert_equals(marker.markerWidth.baseVal.unitType, SVGLength.SVG_LENGTHTYPE_NUMBER); |
+ assert_equals(marker.markerWidth.baseVal.valueInSpecifiedUnits, 100); |
+ |
+ // Test value setter after 'calc' value attribute |
+ marker.setAttribute('markerWidth', expression); // reset to calc value |
+ marker.markerWidth.baseVal.value = 10; |
+ assert_equals(marker.markerWidth.baseVal.unitType, SVGLength.SVG_LENGTHTYPE_NUMBER); |
+ assert_equals(marker.markerWidth.baseVal.valueInSpecifiedUnits, 10); |
+ |
+ // Test calc with "valueAsString" |
+ marker.setAttribute('markerWidth', '20px'); // reset to normal value |
+ assert_throws(null, function() {marker.markerWidth.baseVal.valueAsString = expression}); |
+ assert_equals(marker.markerWidth.baseVal.value, 20); |
+} |
+ |
+function assert_calc_expression(expression, expected) { |
+ assert_calc_expression_on_width_attr(expression, expected); // presentation attr |
+ assert_calc_expression_on_markerWidth_attr(expression, expected); // non presentation attr |
+} |
+ |
+test(function() { |
+ assert_calc_expression("calc(20%)", (20 * viewportWidthPercent())); |
+ assert_calc_expression("calc(10mm + 10in)", (10 * cssPixelsPerMillimeter) + (10 * cssPixelsPerInch)); |
+ assert_calc_expression("calc(10mm + 10mm)", (20 * cssPixelsPerMillimeter)); |
+ assert_calc_expression("calc(20mm)", (20 * cssPixelsPerMillimeter)); |
+ assert_calc_expression("calc(10 + 10)", 20); |
+ assert_calc_expression("calc(10mm + 10)", (10 * cssPixelsPerMillimeter) + 10); |
+ assert_calc_expression("calc(10% + 10)", (10 * viewportWidthPercent()) + 10); |
+ assert_calc_expression("calc(1cm + 2in + 1cm + 2)", (2 * cssPixelsPerInch) + (2 * cssPixelsPerCentimeter) + 2); |
+ assert_calc_expression("calc(1cm + 2 + 1cm + 2in)", (2 * cssPixelsPerInch) + (2 * cssPixelsPerCentimeter) + 2); |
+ assert_calc_expression("calc(10% + 10 + 2% + 10pc)", (12 * viewportWidthPercent()) + 10 + (10 * cssPixelsPerPica)); |
+}, "Tests calc() on presentation and non-presentation attr in svgLength"); |
+</script> |