diff options
Diffstat (limited to 'devtools/server/tests/xpcshell/test_shapes_highlighter_helpers.js')
| -rw-r--r-- | devtools/server/tests/xpcshell/test_shapes_highlighter_helpers.js | 274 |
1 files changed, 274 insertions, 0 deletions
diff --git a/devtools/server/tests/xpcshell/test_shapes_highlighter_helpers.js b/devtools/server/tests/xpcshell/test_shapes_highlighter_helpers.js new file mode 100644 index 0000000000..6876f0a532 --- /dev/null +++ b/devtools/server/tests/xpcshell/test_shapes_highlighter_helpers.js @@ -0,0 +1,274 @@ +/* Any copyright is dedicated to the Public Domain. + http://creativecommons.org/publicdomain/zero/1.0/ */ + +/** + * Test the helper functions of the shapes highlighter. + */ + +"use strict"; + +const { + splitCoords, + coordToPercent, + evalCalcExpression, + shapeModeToCssPropertyName, + getCirclePath, + getDecimalPrecision, + getUnit, +} = require("resource://devtools/server/actors/highlighters/shapes.js"); + +function run_test() { + test_split_coords(); + test_coord_to_percent(); + test_eval_calc_expression(); + test_shape_mode_to_css_property_name(); + test_get_circle_path(); + test_get_decimal_precision(); + test_get_unit(); + run_next_test(); +} + +function test_split_coords() { + const tests = [ + { + desc: "splitCoords for basic coordinate pair", + expr: "30% 20%", + expected: ["30%", "20%"], + }, + { + desc: "splitCoords for coord pair with calc()", + expr: "calc(50px + 20%) 30%", + expected: ["calc(50px\u00a0+\u00a020%)", "30%"], + }, + ]; + + for (const { desc, expr, expected } of tests) { + deepEqual(splitCoords(expr), expected, desc); + } +} + +function test_coord_to_percent() { + const size = 1000; + const tests = [ + { + desc: "coordToPercent for percent value", + expr: "50%", + expected: 50, + }, + { + desc: "coordToPercent for px value", + expr: "500px", + expected: 50, + }, + { + desc: "coordToPercent for zero value", + expr: "0", + expected: 0, + }, + ]; + + for (const { desc, expr, expected } of tests) { + equal(coordToPercent(expr, size), expected, desc); + } +} + +function test_eval_calc_expression() { + const size = 1000; + const tests = [ + { + desc: "evalCalcExpression with one value", + expr: "50%", + expected: 50, + }, + { + desc: "evalCalcExpression with percent and px values", + expr: "50% + 100px", + expected: 60, + }, + { + desc: "evalCalcExpression with a zero value", + expr: "0 + 100px", + expected: 10, + }, + { + desc: "evalCalcExpression with a negative value", + expr: "-200px+50%", + expected: 30, + }, + ]; + + for (const { desc, expr, expected } of tests) { + equal(evalCalcExpression(expr, size), expected, desc); + } +} + +function test_shape_mode_to_css_property_name() { + const tests = [ + { + desc: "shapeModeToCssPropertyName for clip-path", + expr: "cssClipPath", + expected: "clipPath", + }, + { + desc: "shapeModeToCssPropertyName for shape-outside", + expr: "cssShapeOutside", + expected: "shapeOutside", + }, + ]; + + for (const { desc, expr, expected } of tests) { + equal(shapeModeToCssPropertyName(expr), expected, desc); + } +} + +function test_get_circle_path() { + const tests = [ + { + desc: "getCirclePath with size 5, no resizing, no zoom, 1:1 ratio", + size: 5, + cx: 0, + cy: 0, + width: 100, + height: 100, + zoom: 1, + expected: "M-5,0a5,5 0 1,0 10,0a5,5 0 1,0 -10,0", + }, + { + desc: "getCirclePath with size 7, resizing, no zoom, 1:1 ratio", + size: 7, + cx: 0, + cy: 0, + width: 200, + height: 200, + zoom: 1, + expected: "M-3.5,0a3.5,3.5 0 1,0 7,0a3.5,3.5 0 1,0 -7,0", + }, + { + desc: "getCirclePath with size 5, resizing, zoom, 1:1 ratio", + size: 5, + cx: 0, + cy: 0, + width: 200, + height: 200, + zoom: 2, + expected: "M-1.25,0a1.25,1.25 0 1,0 2.5,0a1.25,1.25 0 1,0 -2.5,0", + }, + { + desc: "getCirclePath with size 5, resizing, zoom, non-square ratio", + size: 5, + cx: 0, + cy: 0, + width: 100, + height: 200, + zoom: 2, + expected: "M-2.5,0a2.5,1.25 0 1,0 5,0a2.5,1.25 0 1,0 -5,0", + }, + ]; + + for (const { desc, size, cx, cy, width, height, zoom, expected } of tests) { + equal(getCirclePath(size, cx, cy, width, height, zoom), expected, desc); + } +} + +function test_get_decimal_precision() { + const tests = [ + { + desc: "getDecimalPrecision with px", + expr: "px", + expected: 0, + }, + { + desc: "getDecimalPrecision with %", + expr: "%", + expected: 2, + }, + { + desc: "getDecimalPrecision with em", + expr: "em", + expected: 2, + }, + { + desc: "getDecimalPrecision with undefined", + expr: undefined, + expected: 0, + }, + { + desc: "getDecimalPrecision with empty string", + expr: "", + expected: 0, + }, + ]; + + for (const { desc, expr, expected } of tests) { + equal(getDecimalPrecision(expr), expected, desc); + } +} + +function test_get_unit() { + const tests = [ + { + desc: "getUnit with %", + expr: "30%", + expected: "%", + }, + { + desc: "getUnit with px", + expr: "400px", + expected: "px", + }, + { + desc: "getUnit with em", + expr: "4em", + expected: "em", + }, + { + desc: "getUnit with 0", + expr: "0", + expected: "px", + }, + { + desc: "getUnit with 0%", + expr: "0%", + expected: "%", + }, + { + desc: "getUnit with 0.00%", + expr: "0.00%", + expected: "%", + }, + { + desc: "getUnit with 0px", + expr: "0px", + expected: "px", + }, + { + desc: "getUnit with 0em", + expr: "0em", + expected: "em", + }, + { + desc: "getUnit with calc", + expr: "calc(30px + 5%)", + expected: "px", + }, + { + desc: "getUnit with var", + expr: "var(--variable)", + expected: "px", + }, + { + desc: "getUnit with closest-side", + expr: "closest-side", + expected: "px", + }, + { + desc: "getUnit with farthest-side", + expr: "farthest-side", + expected: "px", + }, + ]; + + for (const { desc, expr, expected } of tests) { + equal(getUnit(expr), expected, desc); + } +} |