From e2990155dcd5748ef39fba25e8752f1c7de93bc4 Mon Sep 17 00:00:00 2001 From: Alexej Yaroshevich Date: Wed, 24 Jun 2015 17:31:58 +0300 Subject: [PATCH 1/3] Misc: initial tests for compact --- test/04.compact-object.js | 76 +++++++++++++++++++++++++++++++++++++++ 1 file changed, 76 insertions(+) create mode 100644 test/04.compact-object.js diff --git a/test/04.compact-object.js b/test/04.compact-object.js new file mode 100644 index 0000000..d245eee --- /dev/null +++ b/test/04.compact-object.js @@ -0,0 +1,76 @@ +describe('compact object', function () { + + describe('for border-radius properties', function () { + + it('should compact them with 1 value', function () { + SC.compact({ + 'border-top-left-radius': '9px', + 'border-top-right-radius': '9px', + 'border-bottom-right-radius': '9px', + 'border-bottom-left-radius': '9px', + }).should.eql({ + 'border-radius': '9px', + }); + }); + + it('should compact them partially', function () { + SC.compact({ + 'border-top-left-radius': '9px', + 'border-bottom-left-radius': '9px', + }).should.eql({ + 'border-radius': '9px none none 9px', + }); + }); + + it('should compact them with 2 different values', function () { + SC.compact({ + 'border-top-left-radius': '9px', + 'border-top-right-radius': '12px', + 'border-bottom-right-radius': '9px', + 'border-bottom-left-radius': '12px', + }).should.eql({ + 'border-radius': '9px 12px', + }); + }); + + it('should compact them with 3 different values', function () { + SC.compact({ + 'border-top-right-radius': '5px', + 'border-bottom-right-radius': '10px', + 'border-bottom-left-radius': '5px', + }).should.eql({ + 'border-radius': 'none 5px 10px', + }); + }); + + }); + + describe('simplification of the same value', function () { + + it('should simplify border-width value', function () { + SC.compact({ + 'border-width': '2px 2px 2px', + }).should.eql({ + 'border-width': '2px', + }); + }); + + it('should simplify more complex border-width to 2 values', function () { + SC.compact({ + 'border-width': '0px 5px 0px 5px', + }).should.eql({ + 'border-width': '0px 5px', + }); + }); + + it('should strip the last border-radius value to 3 values', function () { + SC.compact({ + 'border-radius': '0px 5px 10px 5px', + }).should.eql({ + 'border-radius': '0px 5px 10px', + }); + }); + + }); + +}); From 870f5e435605b0534a91365f7a5cb401c08b5eb6 Mon Sep 17 00:00:00 2001 From: Yuri Tkachenko Date: Fri, 25 Nov 2016 18:41:32 +0200 Subject: [PATCH 2/3] should compact an Array of props --- lib/index.js | 35 ++++++++++++++++++++++++++++++----- test/04.compact-object.js | 9 +++++++++ 2 files changed, 39 insertions(+), 5 deletions(-) diff --git a/lib/index.js b/lib/index.js index 782781f..7137cc4 100644 --- a/lib/index.js +++ b/lib/index.js @@ -1,9 +1,18 @@ var ASSERT = require('assert'); var list = require('./list'); -var props = require('css-shorthand-properties').shorthandProperties; +var shorthandProps = require('css-shorthand-properties').shorthandProperties; + +var invertedShorthandProps = Object.keys(shorthandProps) + .reduce(function(inverted, shorthand) { + expandAsArray(shorthand, false).forEach(function(key) { + inverted[key] = shorthand; + }); + return inverted; + }, {}) exports.isShorthand = isShorthand; exports.expand = expand; +exports.compact = compact; /** * Expand a property to an array of parts or property and value to object @@ -33,11 +42,11 @@ function expand(property, value, recurse) { } function expandAsArray(property, recurse) { - if (!props.hasOwnProperty(property)) { + if (!shorthandProps.hasOwnProperty(property)) { return [property]; } - return props[property] + return shorthandProps[property] .map(function (p) { var longhand = p.substr(0, 1) === '-' ? property + p : p; return recurse ? expand(longhand, recurse) : longhand; @@ -57,7 +66,7 @@ function expandAsArray(property, recurse) { */ function expandAsObject(property, value, recurse) { var res = {}; - if (!props.hasOwnProperty(property)) { + if (!shorthandProps.hasOwnProperty(property)) { res[property] = value; return res; } @@ -84,9 +93,25 @@ function expandAsObject(property, value, recurse) { return res; } +function compact(longhand) { + if (longhand.length) return compactFromArray(longhand) +} + +function compactFromArray(props) { + ASSERT(areCompactable(props), 'properties aren\'t compactable'); + return invertedShorthandProps[props[0]]; +} + function isShorthand(property) { - if (props.hasOwnProperty(property)) { + if (shorthandProps.hasOwnProperty(property)) { return true; } return false; } + +function areCompactable(longhand) { + return longhand.every(function(prop) { + return invertedShorthandProps.hasOwnProperty(prop) && + invertedShorthandProps[prop] === invertedShorthandProps[longhand[0]]; + }); +} diff --git a/test/04.compact-object.js b/test/04.compact-object.js index d245eee..147134f 100644 --- a/test/04.compact-object.js +++ b/test/04.compact-object.js @@ -1,5 +1,14 @@ describe('compact object', function () { + it('should compact an Array of props', function () { + SC.compact([ + 'border-top-left-radius', + 'border-top-right-radius', + 'border-bottom-right-radius', + 'border-bottom-left-radius' + ]).should.eql('border-radius'); + }); + describe('for border-radius properties', function () { it('should compact them with 1 value', function () { From 2f96e84267e28fb354eaba4f90a7c41b5b43c01f Mon Sep 17 00:00:00 2001 From: Yuri Tkachenko Date: Sat, 26 Nov 2016 18:21:02 +0200 Subject: [PATCH 3/3] should compact an Array of props: cleaning --- lib/index.js | 39 ++++++++++++++------ test/04.compact-object.js | 75 --------------------------------------- 2 files changed, 28 insertions(+), 86 deletions(-) diff --git a/lib/index.js b/lib/index.js index 7137cc4..9b12854 100644 --- a/lib/index.js +++ b/lib/index.js @@ -1,7 +1,11 @@ -var ASSERT = require('assert'); var list = require('./list'); var shorthandProps = require('css-shorthand-properties').shorthandProperties; +exports.isShorthand = isShorthand; +exports.expand = expand; +exports.isCompactable = isCompactable; +exports.compact = compact; + var invertedShorthandProps = Object.keys(shorthandProps) .reduce(function(inverted, shorthand) { expandAsArray(shorthand, false).forEach(function(key) { @@ -10,9 +14,10 @@ var invertedShorthandProps = Object.keys(shorthandProps) return inverted; }, {}) -exports.isShorthand = isShorthand; -exports.expand = expand; -exports.compact = compact; +var errors = { + noPropertyArg: 'property argument is required', + propsArentCompactable: 'properties aren\'t compactable' +} /** * Expand a property to an array of parts or property and value to object @@ -23,7 +28,7 @@ exports.compact = compact; * @returns {Array|Object} */ function expand(property, value, recurse) { - ASSERT(arguments.length, 'property argument is required'); + if (!arguments.length) throw new Error(erros.noPropertyArg); if (arguments.length < 3) { if (typeof value === 'boolean') { @@ -94,11 +99,17 @@ function expandAsObject(property, value, recurse) { } function compact(longhand) { - if (longhand.length) return compactFromArray(longhand) + if (longhand.length) return compactProperties(longhand) } -function compactFromArray(props) { - ASSERT(areCompactable(props), 'properties aren\'t compactable'); +/** + * compactProperties — returns shorthand property from array of longhands. + * + * @param string[] props — longhand props + * @returns string — shorthand property + */ +function compactProperties(props) { + if (!isCompactable(props)) throw new Error(erros.propsArentCompactable); return invertedShorthandProps[props[0]]; } @@ -109,9 +120,15 @@ function isShorthand(property) { return false; } -function areCompactable(longhand) { - return longhand.every(function(prop) { +/** + * isCompactable — check if array of longhands could be compacted + * + * @param string[] longhands — longhand props + * @returns Boolean + */ +function isCompactable(longhands) { + return longhands.every(function(prop) { return invertedShorthandProps.hasOwnProperty(prop) && - invertedShorthandProps[prop] === invertedShorthandProps[longhand[0]]; + invertedShorthandProps[prop] === invertedShorthandProps[longhands[0]]; }); } diff --git a/test/04.compact-object.js b/test/04.compact-object.js index 147134f..fb20957 100644 --- a/test/04.compact-object.js +++ b/test/04.compact-object.js @@ -1,5 +1,4 @@ describe('compact object', function () { - it('should compact an Array of props', function () { SC.compact([ 'border-top-left-radius', @@ -8,78 +7,4 @@ describe('compact object', function () { 'border-bottom-left-radius' ]).should.eql('border-radius'); }); - - describe('for border-radius properties', function () { - - it('should compact them with 1 value', function () { - SC.compact({ - 'border-top-left-radius': '9px', - 'border-top-right-radius': '9px', - 'border-bottom-right-radius': '9px', - 'border-bottom-left-radius': '9px', - }).should.eql({ - 'border-radius': '9px', - }); - }); - - it('should compact them partially', function () { - SC.compact({ - 'border-top-left-radius': '9px', - 'border-bottom-left-radius': '9px', - }).should.eql({ - 'border-radius': '9px none none 9px', - }); - }); - - it('should compact them with 2 different values', function () { - SC.compact({ - 'border-top-left-radius': '9px', - 'border-top-right-radius': '12px', - 'border-bottom-right-radius': '9px', - 'border-bottom-left-radius': '12px', - }).should.eql({ - 'border-radius': '9px 12px', - }); - }); - - it('should compact them with 3 different values', function () { - SC.compact({ - 'border-top-right-radius': '5px', - 'border-bottom-right-radius': '10px', - 'border-bottom-left-radius': '5px', - }).should.eql({ - 'border-radius': 'none 5px 10px', - }); - }); - - }); - - describe('simplification of the same value', function () { - - it('should simplify border-width value', function () { - SC.compact({ - 'border-width': '2px 2px 2px', - }).should.eql({ - 'border-width': '2px', - }); - }); - - it('should simplify more complex border-width to 2 values', function () { - SC.compact({ - 'border-width': '0px 5px 0px 5px', - }).should.eql({ - 'border-width': '0px 5px', - }); - }); - - it('should strip the last border-radius value to 3 values', function () { - SC.compact({ - 'border-radius': '0px 5px 10px 5px', - }).should.eql({ - 'border-radius': '0px 5px 10px', - }); - }); - - }); - });