Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More →
Socket
Sign inDemoInstall
Socket
Sign inDemoInstall

rtlcss

Package Overview
Dependencies
Maintainers
1
Versions
67
Alerts
File Explorer

Advanced tools

License
Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

rtlcss - npm Package Compare versions

Comparing version 2.6.2 to 3.0.0

50

bin/rtlcss.js
#!/usr/bin/env node
var path = require('path')
var fs = require('fs')
var chalk = require('chalk')
var mkdirp = require('mkdirp')
var postcss = require('postcss')
var rtlcss = require('../lib/rtlcss')
var configLoader = require('../lib/config-loader')
const path = require('path')
const fs = require('fs')
const chalk = require('chalk')
const mkdirp = require('mkdirp')
const postcss = require('postcss')
const rtlcss = require('../lib/rtlcss')
const configLoader = require('../lib/config-loader')
var input, output, directory, ext, config, currentErrorcode, arg
var args = process.argv.slice(2)
var shouldBreak = false
let input, output, directory, ext, config, currentErrorcode, arg
const args = process.argv.slice(2)
let shouldBreak = false

@@ -33,3 +33,3 @@ process.on('exit', function () { process.reallyExit(currentErrorcode) })

/*eslint-disable*/
var options = [
const options = [
'Option ' , 'Description ',

@@ -45,4 +45,4 @@ '--------------', '----------------------------------------------',

]
/*eslint-enable */
for (var x = 0; x < options.length; x++) {
/* eslint-enable */
for (let x = 0; x < options.length; x++) {
console.log(options[x++], '\t', options[x])

@@ -119,3 +119,3 @@ }

try {
var cwd = input
let cwd = input
if (directory !== true) {

@@ -142,3 +142,3 @@ cwd = path.dirname(input)

var processCSSFile = function (e, data, outputName) {
const processCSSFile = function (e, data, outputName) {
if (e) {

@@ -148,4 +148,4 @@ printError('rtlcss: ' + e.message)

}
var result
var opt = { map: false }
let result
const opt = { map: false }
if (input !== '-') {

@@ -166,3 +166,3 @@ opt.from = input

if (output) {
var savePath = outputName
let savePath = outputName
if (directory !== true) {

@@ -181,3 +181,3 @@ savePath = output

var walk = function (dir, done) {
const walk = function (dir, done) {
fs.readdir(dir, function (error, list) {

@@ -187,5 +187,5 @@ if (error) {

}
var i = 0
let i = 0
;(function next () {
var file = list[i++]
let file = list[i++]
if (!file) {

@@ -210,3 +210,3 @@ return done(null)

// compute output directory
var relativePath = path.relative(input, file).split(path.sep)
const relativePath = path.relative(input, file).split(path.sep)
relativePath.pop()

@@ -216,6 +216,6 @@ relativePath.push(path.basename(file).replace('.css', ext || '.rtl.css'))

// set rtl file name
var rtlFile = path.join(output, relativePath.join(path.sep))
const rtlFile = path.join(output, relativePath.join(path.sep))
// create output directory if it does not exist
var dirName = path.dirname(rtlFile)
const dirName = path.dirname(rtlFile)
if (!fs.existsSync(dirName)) {

@@ -271,3 +271,3 @@ mkdirp.sync(dirName)

var buffer = ''
let buffer = ''
process.stdin.on('data', function (data) {

@@ -274,0 +274,0 @@ buffer += data

6

CHANGELOG.md

@@ -0,1 +1,5 @@

# 3.0.0 - 10 Dec. 2020
* Upgrade to [POSTCSS] 8.
* Dropped **Node.js 6.x, 8.x, 11.x, and 13.x** versions.
## 2.6.2 - 01 Dec. 2020

@@ -225,1 +229,3 @@ * Set input source to same file in raw directive ([#180](https://github.com/MohammadYounes/rtlcss/issues/180)).

* Initial commit.
[POSTCSS]: https://postcss.org/

28

lib/config-loader.js
/* global process */
'use strict'
var fs = require('fs')
var path = require('path')
var findup = require('@choojs/findup')
var stripJSONComments = require('strip-json-comments')
var config = {}
var configSources = ['package.json', '.rtlcssrc', '.rtlcss.json']
const fs = require('fs')
const path = require('path')
const findup = require('find-up')
const stripJSONComments = require('strip-json-comments')
let config = {}
const configSources = ['package.json', '.rtlcssrc', '.rtlcss.json']

@@ -18,7 +18,7 @@ module.exports.load = function (configFilePath, cwd, overrides) {

var directory = cwd || process.cwd()
const directory = cwd || process.cwd()
config = loadConfig(directory)
if (!config) {
var evns = [process.env.USERPROFILE, process.env.HOMEPATH, process.env.HOME]
for (var x = 0; x < evns.length; x++) {
const evns = [process.env.USERPROFILE, process.env.HOMEPATH, process.env.HOME]
for (let x = 0; x < evns.length; x++) {
if (!evns[x]) {

@@ -41,5 +41,5 @@ continue

function loadConfig (dir) {
for (var x = 0; x < configSources.length; x++) {
var found
var source = configSources[x]
for (let x = 0; x < configSources.length; x++) {
let found
const source = configSources[x]
try {

@@ -52,3 +52,3 @@ found = findup.sync(dir, source)

if (found) {
var configFilePath = path.normalize(path.join(found, source))
const configFilePath = path.normalize(path.join(found, source))
try {

@@ -75,3 +75,3 @@ config = JSON.parse(

if (to && from) {
for (var p in from) {
for (const p in from) {
if (typeof to[p] === 'object') {

@@ -78,0 +78,0 @@ override(to[p], from[p])

36

lib/config.js
'use strict'
var options
var config = {}
var corePlugin = require('./plugin.js')
let options
const config = {}
const corePlugin = require('./plugin.js')

@@ -28,5 +28,5 @@ function optionOrDefault (option, def) {

if (Array.isArray(config.stringMap)) {
var hasLeftRight, hasLtrRtl
for (var x = 0; x < config.stringMap.length; x++) {
var map = config.stringMap[x]
let hasLeftRight, hasLtrRtl
for (let x = 0; x < config.stringMap.length; x++) {
const map = config.stringMap[x]
if (hasLeftRight && hasLtrRtl) {

@@ -42,8 +42,8 @@ break

config.stringMap.push({
'name': 'left-right',
'priority': 100,
'exclusive': false,
'search': ['left', 'Left', 'LEFT'],
'replace': ['right', 'Right', 'RIGHT'],
'options': { 'scope': '*', 'ignoreCase': false }
name: 'left-right',
priority: 100,
exclusive: false,
search: ['left', 'Left', 'LEFT'],
replace: ['right', 'Right', 'RIGHT'],
options: { scope: '*', ignoreCase: false }
})

@@ -53,8 +53,8 @@ }

config.stringMap.push({
'name': 'ltr-rtl',
'priority': 100,
'exclusive': false,
'search': ['ltr', 'Ltr', 'LTR'],
'replace': ['rtl', 'Rtl', 'RTL'],
'options': { 'scope': '*', 'ignoreCase': false }
name: 'ltr-rtl',
priority: 100,
exclusive: false,
search: ['ltr', 'Ltr', 'LTR'],
replace: ['rtl', 'Rtl', 'RTL'],
options: { scope: '*', ignoreCase: false }
})

@@ -61,0 +61,0 @@ }

22

lib/directive-parser.js
module.exports = function (comment) {
var pos = 0
var value = comment.text
var match = value.match(/^\s*!?\s*rtl:/)
var meta
let pos = 0
let value = comment.text
const match = value.match(/^\s*!?\s*rtl:/)
let meta
if (match) {
meta = {
'source': comment,
'name': '',
'param': '',
'begin': true,
'end': true,
'blacklist': false,
'preserve': false
source: comment,
name: '',
param: '',
begin: true,
end: true,
blacklist: false,
preserve: false
}

@@ -17,0 +17,0 @@ value = value.slice(match[0].length)

379

lib/plugin.js
'use strict'
var config = require('./config.js')
var util = require('./util.js')
const config = require('./config.js')
const util = require('./util.js')
module.exports = {
'name': 'rtlcss',
'priority': 100,
'directives': {
'control': {
'ignore': {
'expect': { 'atrule': true, 'comment': true, 'decl': true, 'rule': true },
'endNode': null,
'begin': function (node, metadata, context) {
name: 'rtlcss',
priority: 100,
directives: {
control: {
ignore: {
expect: { atrule: true, comment: true, decl: true, rule: true },
endNode: null,
begin: function (node, metadata, context) {
// find the ending node in case of self closing directive
if (!this.endNode && metadata.begin && metadata.end) {
var n = node
let n = node
while (n && n.nodes) {

@@ -21,3 +21,3 @@ n = n.nodes[n.nodes.length - 1]

}
var prevent = true
let prevent = true
if (node.type === 'comment' && node.text.match(/^\s*!?\s*rtl:end:ignore/)) {

@@ -28,7 +28,7 @@ prevent = false

},
'end': function (node, metadata, context) {
end: function (node, metadata, context) {
// end if:
// 1. block directive and the node is comment
// 2. self closing directive and node is endNode
if (metadata.begin !== metadata.end && node.type === 'comment' || metadata.begin && metadata.end && node === this.endNode) {
if ((metadata.begin !== metadata.end && node.type === 'comment') || (metadata.begin && metadata.end && node === this.endNode)) {
// clear ending node

@@ -41,27 +41,30 @@ this.endNode = null

},
'rename': {
'expect': {'rule': true},
'begin': function (node, metadata, context) {
rename: {
expect: { rule: true },
begin: function (node, metadata, context) {
node.selector = context.util.applyStringMap(node.selector, false)
return false
},
'end': function (node, context) {
end: function (node, context) {
return true
}
},
'raw': {
'expect': {'self': true},
'begin': function (node, metadata, context) {
var nodes = context.postcss.parse(metadata.param, { from: node.source.input.from })
raw: {
expect: { self: true },
begin: function (node, metadata, context) {
const nodes = context.postcss.parse(metadata.param, { from: node.source.input.from })
nodes.walk(function (node) {
node[context.symbol] = true
})
node.parent.insertBefore(node, nodes)
return true
},
'end': function (node, context) {
end: function (node, context) {
return true
}
},
'remove': {
'expect': {'atrule': true, 'rule': true, 'decl': true},
'begin': function (node, metadata, context) {
var prevent = false
remove: {
expect: { atrule: true, rule: true, decl: true },
begin: function (node, metadata, context) {
let prevent = false
switch (node.type) {

@@ -76,16 +79,16 @@ case 'atrule':

},
'end': function (node, metadata, context) {
end: function (node, metadata, context) {
return true
}
},
'options': {
'expect': {'self': true},
'stack': [],
'begin': function (node, metadata, context) {
options: {
expect: { self: true },
stack: [],
begin: function (node, metadata, context) {
this.stack.push(util.extend({}, context.config))
var options
let options
try {
options = JSON.parse(metadata.param)
} catch (e) {
throw node.error('Invlaid options object', { 'details': e })
throw node.error('Invlaid options object', { details: e })
}

@@ -96,4 +99,4 @@ context.config = config.configure(options, context.config.plugins)

},
'end': function (node, metadata, context) {
var config = this.stack.pop()
end: function (node, metadata, context) {
const config = this.stack.pop()
if (config && !metadata.begin) {

@@ -106,16 +109,16 @@ context.config = config

},
'config': {
'expect': {'self': true},
'expr': {
'fn': /function([^\(]*)\(([^\(\)]*?)\)[^\{]*\{([^]*)\}/ig,
'rx': /\/([^\/]*)\/(.*)/ig
config: {
expect: { self: true },
expr: {
fn: /function([^(]*)\(([^()]*?)\)[^{]*\{([^]*)\}/ig,
rx: /\/([^/]*)\/(.*)/ig
},
'stack': [],
'begin': function (node, metadata, context) {
stack: [],
begin: function (node, metadata, context) {
this.stack.push(util.extend({}, context.config))
var configuration
let configuration
try {
configuration = eval('(' + metadata.param + ')') // eslint-disable-line no-eval
} catch (e) {
throw node.error('Invlaid config object', { 'details': e })
throw node.error('Invlaid config object', { details: e })
}

@@ -126,4 +129,4 @@ context.config = config.configure(configuration.options, configuration.plugins)

},
'end': function (node, metadata, context) {
var config = this.stack.pop()
end: function (node, metadata, context) {
const config = this.stack.pop()
if (config && !metadata.begin) {

@@ -137,6 +140,6 @@ context.config = config

},
'value': [
value: [
{
'name': 'ignore',
'action': function (decl, expr, context) {
name: 'ignore',
action: function (decl, expr, context) {
return true

@@ -146,5 +149,5 @@ }

{
'name': 'prepend',
'action': function (decl, expr, context) {
var prefix = ''
name: 'prepend',
action: function (decl, expr, context) {
let prefix = ''
decl.raws.value.raw.replace(expr, function (m, v) {

@@ -158,4 +161,4 @@ prefix += v

{
'name': 'append',
'action': function (decl, expr, context) {
name: 'append',
action: function (decl, expr, context) {
decl.value = decl.raws.value.raw = decl.raws.value.raw.replace(expr, function (match, value) {

@@ -168,4 +171,4 @@ return match + value

{
'name': 'insert',
'action': function (decl, expr, context) {
name: 'insert',
action: function (decl, expr, context) {
decl.value = decl.raws.value.raw = decl.raws.value.raw.replace(expr, function (match, value) {

@@ -178,4 +181,4 @@ return value + match

{
'name': '',
'action': function (decl, expr, context) {
name: '',
action: function (decl, expr, context) {
decl.raws.value.raw.replace(expr, function (match, value) {

@@ -189,45 +192,45 @@ decl.value = decl.raws.value.raw = value + match

},
'processors': [
processors: [
{
'name': 'variable',
'expr': /^--/im,
'action': function (prop, value) {
return { 'prop': prop, 'value': value }
name: 'variable',
expr: /^--/im,
action: function (prop, value) {
return { prop: prop, value: value }
}
},
{
'name': 'direction',
'expr': /direction/im,
'action': function (prop, value, context) {
return { 'prop': prop, 'value': context.util.swapLtrRtl(value) }
name: 'direction',
expr: /direction/im,
action: function (prop, value, context) {
return { prop: prop, value: context.util.swapLtrRtl(value) }
}
},
{
'name': 'left',
'expr': /left/im,
'action': function (prop, value, context) {
return { 'prop': prop.replace(this.expr, function () { return 'right' }), 'value': value }
name: 'left',
expr: /left/im,
action: function (prop, value, context) {
return { prop: prop.replace(this.expr, function () { return 'right' }), value: value }
}
},
{
'name': 'right',
'expr': /right/im,
'action': function (prop, value, context) {
return { 'prop': prop.replace(this.expr, function () { return 'left' }), 'value': value }
name: 'right',
expr: /right/im,
action: function (prop, value, context) {
return { prop: prop.replace(this.expr, function () { return 'left' }), value: value }
}
},
{
'name': 'four-value syntax',
'expr': /^(margin|padding|border-(color|style|width))$/ig,
'cache': null,
'action': function (prop, value, context) {
name: 'four-value syntax',
expr: /^(margin|padding|border-(color|style|width))$/ig,
cache: null,
action: function (prop, value, context) {
if (this.cache === null) {
this.cache = {
'match': /[^\s\uFFFD]+/g
match: /[^\s\uFFFD]+/g
}
}
var state = context.util.guardFunctions(value)
var result = state.value.match(this.cache.match)
const state = context.util.guardFunctions(value)
const result = state.value.match(this.cache.match)
if (result && result.length === 4 && (state.store.length > 0 || result[1] !== result[3])) {
var i = 0
let i = 0
state.value = state.value.replace(this.cache.match, function () {

@@ -237,12 +240,12 @@ return result[(4 - i++) % 4]

}
return { 'prop': prop, 'value': context.util.unguardFunctions(state) }
return { prop: prop, value: context.util.unguardFunctions(state) }
}
},
{
'name': 'border radius',
'expr': /border-radius/ig,
'cache': null,
'flip': function (value) {
var parts = value.match(this.cache.match)
var i
name: 'border radius',
expr: /border-radius/ig,
cache: null,
flip: function (value) {
const parts = value.match(this.cache.match)
let i
if (parts) {

@@ -276,39 +279,39 @@ switch (parts.length) {

},
'action': function (prop, value, context) {
action: function (prop, value, context) {
if (this.cache === null) {
this.cache = {
'match': /[^\s\uFFFD]+/g,
'slash': /[^\/]+/g,
'white': /(^\s*)/
match: /[^\s\uFFFD]+/g,
slash: /[^/]+/g,
white: /(^\s*)/
}
}
var state = context.util.guardFunctions(value)
const state = context.util.guardFunctions(value)
state.value = state.value.replace(this.cache.slash, function (m) {
return this.flip(m)
}.bind(this))
return { 'prop': prop, 'value': context.util.unguardFunctions(state) }
return { prop: prop, value: context.util.unguardFunctions(state) }
}
},
{
'name': 'shadow',
'expr': /shadow/ig,
'cache': null,
'action': function (prop, value, context) {
name: 'shadow',
expr: /shadow/ig,
cache: null,
action: function (prop, value, context) {
if (this.cache === null) {
this.cache = {
'replace': /[^,]+/g
replace: /[^,]+/g
}
}
var colorSafe = context.util.guardHexColors(value)
var funcSafe = context.util.guardFunctions(colorSafe.value)
const colorSafe = context.util.guardHexColors(value)
const funcSafe = context.util.guardFunctions(colorSafe.value)
funcSafe.value = funcSafe.value.replace(this.cache.replace, function (m) { return context.util.negate(m) })
colorSafe.value = context.util.unguardFunctions(funcSafe)
return { 'prop': prop, 'value': context.util.unguardHexColors(colorSafe) }
return { prop: prop, value: context.util.unguardHexColors(colorSafe) }
}
},
{
'name': 'transform and perspective origin',
'expr': /(?:transform|perspective)-origin/ig,
'cache': null,
'flip': function (value, context) {
name: 'transform and perspective origin',
expr: /(?:transform|perspective)-origin/ig,
cache: null,
flip: function (value, context) {
if (value === '0') {

@@ -323,9 +326,9 @@ value = '100%'

},
'action': function (prop, value, context) {
action: function (prop, value, context) {
if (this.cache === null) {
this.cache = {
'match': context.util.regex(['calc', 'percent', 'length'], 'g'),
'percent': context.util.regex(['calc', 'percent'], 'i'),
'length': context.util.regex(['length'], 'gi'),
'xKeyword': /(left|right)/i
match: context.util.regex(['calc', 'percent', 'length'], 'g'),
percent: context.util.regex(['calc', 'percent'], 'i'),
length: context.util.regex(['length'], 'gi'),
xKeyword: /(left|right)/i
}

@@ -336,4 +339,4 @@ }

} else {
var state = context.util.guardFunctions(value)
var parts = state.value.match(this.cache.match)
const state = context.util.guardFunctions(value)
const parts = state.value.match(this.cache.match)
if (parts && parts.length > 0) {

@@ -345,11 +348,11 @@ parts[0] = this.flip(parts[0], context)

}
return { 'prop': prop, 'value': value }
return { prop: prop, value: value }
}
},
{
'name': 'transform',
'expr': /^(?!text\-).*?transform$/ig,
'cache': null,
'flip': function (value, process, context) {
var i = 0
name: 'transform',
expr: /^(?!text-).*?transform$/ig,
cache: null,
flip: function (value, process, context) {
let i = 0
return value.replace(this.cache.unit, function (num) {

@@ -359,3 +362,3 @@ return process(++i, num)

},
'flipMatrix': function (value, context) {
flipMatrix: function (value, context) {
return this.flip(value, function (i, num) {

@@ -368,3 +371,3 @@ if (i === 2 || i === 3 || i === 5) {

},
'flipMatrix3D': function (value, context) {
flipMatrix3D: function (value, context) {
return this.flip(value, function (i, num) {

@@ -377,3 +380,3 @@ if (i === 2 || i === 4 || i === 5 || i === 13) {

},
'flipRotate3D': function (value, context) {
flipRotate3D: function (value, context) {
return this.flip(value, function (i, num) {

@@ -386,17 +389,17 @@ if (i === 1 || i === 4) {

},
'action': function (prop, value, context) {
action: function (prop, value, context) {
if (this.cache === null) {
this.cache = {
'negatable': /((translate)(x|3d)?|rotate(z|y)?)$/ig,
'unit': context.util.regex(['calc', 'number'], 'g'),
'matrix': /matrix$/i,
'matrix3D': /matrix3d$/i,
'skewXY': /skew(x|y)?$/i,
'rotate3D': /rotate3d$/i
negatable: /((translate)(x|3d)?|rotate(z|y)?)$/ig,
unit: context.util.regex(['calc', 'number'], 'g'),
matrix: /matrix$/i,
matrix3D: /matrix3d$/i,
skewXY: /skew(x|y)?$/i,
rotate3D: /rotate3d$/i
}
}
var state = context.util.guardFunctions(value)
const state = context.util.guardFunctions(value)
return {
'prop': prop,
'value': context.util.unguardFunctions(state, function (v, n) {
prop: prop,
value: context.util.unguardFunctions(state, function (v, n) {
if (n.length) {

@@ -421,18 +424,18 @@ if (n.match(this.cache.matrix3D)) {

{
'name': 'transition',
'expr': /transition(-property)?$/i,
'action': function (prop, value, context) {
return { 'prop': prop, 'value': context.util.swapLeftRight(value) }
name: 'transition',
expr: /transition(-property)?$/i,
action: function (prop, value, context) {
return { prop: prop, value: context.util.swapLeftRight(value) }
}
},
{
'name': 'background',
'expr': /background(-position(-x)?|-image)?$/i,
'cache': null,
'flip': function (value, context) {
var state = util.saveTokens(value, true)
var parts = state.value.match(this.cache.match)
name: 'background',
expr: /background(-position(-x)?|-image)?$/i,
cache: null,
flip: function (value, context) {
const state = util.saveTokens(value, true)
const parts = state.value.match(this.cache.match)
if (parts && parts.length > 0) {
var keywords = (state.value.match(this.cache.position) || '').length
const keywords = (state.value.match(this.cache.position) || '').length
if (/* edge offsets */ parts.length >= 3 || /* keywords only */ keywords === 2) {

@@ -444,6 +447,6 @@ state.value = util.swapLeftRight(state.value)

: (parts[0].match(this.cache.percent)
? context.util.complement(parts[0])
: (parts[0].match(this.cache.length)
? context.util.flipLength(parts[0])
: context.util.swapLeftRight(parts[0])))
? context.util.complement(parts[0])
: (parts[0].match(this.cache.length)
? context.util.flipLength(parts[0])
: context.util.swapLeftRight(parts[0])))
state.value = state.value.replace(this.cache.match, function () { return parts.shift() })

@@ -454,3 +457,3 @@ }

},
'update': function (context, value, name) {
update: function (context, value, name) {
if (name.match(this.cache.gradient)) {

@@ -461,3 +464,3 @@ value = context.util.swapLeftRight(value)

}
} else if (context.config.processUrls === true || context.config.processUrls.decl === true && name.match(this.cache.url)) {
} else if ((context.config.processUrls === true || context.config.processUrls.decl === true) && name.match(this.cache.url)) {
value = context.util.applyStringMap(value, true)

@@ -467,20 +470,20 @@ }

},
'action': function (prop, value, context) {
action: function (prop, value, context) {
if (this.cache === null) {
this.cache = {
'match': context.util.regex(['position', 'percent', 'length', 'calc'], 'ig'),
'percent': context.util.regex(['calc', 'percent'], 'i'),
'position': context.util.regex(['position'], 'g'),
'length': context.util.regex(['length'], 'gi'),
'gradient': /gradient$/i,
'angle': /\d+(deg|g?rad|turn)/i,
'url': /^url/i
match: context.util.regex(['position', 'percent', 'length', 'calc'], 'ig'),
percent: context.util.regex(['calc', 'percent'], 'i'),
position: context.util.regex(['position'], 'g'),
length: context.util.regex(['length'], 'gi'),
gradient: /gradient$/i,
angle: /\d+(deg|g?rad|turn)/i,
url: /^url/i
}
}
var colorSafe = context.util.guardHexColors(value)
var funcSafe = context.util.guardFunctions(colorSafe.value)
var parts = funcSafe.value.split(',')
var lprop = prop.toLowerCase()
const colorSafe = context.util.guardHexColors(value)
const funcSafe = context.util.guardFunctions(colorSafe.value)
const parts = funcSafe.value.split(',')
const lprop = prop.toLowerCase()
if (lprop !== 'background-image') {
for (var x = 0; x < parts.length; x++) {
for (let x = 0; x < parts.length; x++) {
parts[x] = this.flip(parts[x], context)

@@ -492,4 +495,4 @@ }

return {
'prop': prop,
'value': context.util.unguardHexColors(colorSafe)
prop: prop,
value: context.util.unguardHexColors(colorSafe)
}

@@ -499,14 +502,14 @@ }

{
'name': 'keyword',
'expr': /float|clear|text-align/i,
'action': function (prop, value, context) {
return { 'prop': prop, 'value': context.util.swapLeftRight(value) }
name: 'keyword',
expr: /float|clear|text-align/i,
action: function (prop, value, context) {
return { prop: prop, value: context.util.swapLeftRight(value) }
}
},
{
'name': 'cursor',
'expr': /cursor/i,
'cache': null,
'update': function (context, value, name) {
if (context.config.processUrls === true || context.config.processUrls.decl === true && name.match(this.cache.url)) {
name: 'cursor',
expr: /cursor/i,
cache: null,
update: function (context, value, name) {
if ((context.config.processUrls === true || context.config.processUrls.decl === true) && name.match(this.cache.url)) {
value = context.util.applyStringMap(value, true)

@@ -516,3 +519,3 @@ }

},
'flip': function (value) {
flip: function (value) {
return value.replace(this.cache.replace, function (s, m) {

@@ -522,15 +525,15 @@ return s.replace(m, m.replace(this.cache.e, '*').replace(this.cache.w, 'e').replace(this.cache.star, 'w'))

},
'action': function (prop, value, context) {
action: function (prop, value, context) {
if (this.cache === null) {
this.cache = {
'replace': /\b(ne|nw|se|sw|nesw|nwse)-resize/ig,
'url': /^url/i,
'e': /e/i,
'w': /w/i,
'star': /\*/i
replace: /\b(ne|nw|se|sw|nesw|nwse)-resize/ig,
url: /^url/i,
e: /e/i,
w: /w/i,
star: /\*/i
}
}
var state = context.util.guardFunctions(value)
var parts = state.value.split(',')
for (var x = 0; x < parts.length; x++) {
const state = context.util.guardFunctions(value)
const parts = state.value.split(',')
for (let x = 0; x < parts.length; x++) {
parts[x] = this.flip(parts[x])

@@ -540,4 +543,4 @@ }

return {
'prop': prop,
'value': context.util.unguardFunctions(state, this.update.bind(this, context))
prop: prop,
value: context.util.unguardFunctions(state, this.update.bind(this, context))
}

@@ -544,0 +547,0 @@ }

278

lib/rtlcss.js

@@ -8,23 +8,26 @@ /*

'use strict'
var postcss = require('postcss')
var state = require('./state.js')
var config = require('./config.js')
var util = require('./util.js')
const postcss = require('postcss')
const state = require('./state.js')
const config = require('./config.js')
const util = require('./util.js')
module.exports = postcss.plugin('rtlcss', function (options, plugins, hooks) {
var configuration = config.configure(options, plugins, hooks)
var context = {
module.exports = function (options, plugins, hooks) {
const processed = Symbol('processed')
const configuration = config.configure(options, plugins, hooks)
const context = {
// provides access to postcss
'postcss': postcss,
postcss: postcss,
// provides access to the current configuration
'config': configuration,
config: configuration,
// provides access to utilities object
'util': util.configure(configuration)
util: util.configure(configuration),
// processed symbol
symbol: processed
}
return function (css, result) {
var flipped = 0
var toBeRenamed = {}
context.config.hooks.pre(css, postcss)
css.walk(function (node) {
var prevent = false
let flipped = 0
const toBeRenamed = {}
function shouldProcess (node, result) {
if (!node[processed]) {
let prevent = false
state.walk(function (current) {

@@ -43,129 +46,146 @@ // check if current directive is expecting this node

})
if (prevent === false) {
switch (node.type) {
case 'atrule':
// @rules requires url flipping only
if (context.config.processUrls === true || context.config.processUrls.atrule === true) {
var params = context.util.applyStringMap(node.params, true)
node.params = params
}
break
case 'comment':
state.parse(node, result, function (current) {
var push = true
if (current.directive === null) {
current.preserve = !context.config.clean
context.util.each(context.config.plugins, function (plugin) {
var blacklist = context.config.blacklist[plugin.name]
if (blacklist && blacklist[current.metadata.name] === true) {
current.metadata.blacklist = true
if (current.metadata.end) {
push = false
}
if (current.metadata.begin) {
result.warn('directive "' + plugin.name + '.' + current.metadata.name + '" is blacklisted.', {node: current.source})
}
// break each
return false
}
current.directive = plugin.directives.control[current.metadata.name]
if (current.directive) {
// break each
return false
}
})
node[processed] = true
return !prevent
}
return false
}
return {
postcssPlugin: 'rtlcss',
Once (root, { result }) {
context.config.hooks.pre(root, postcss)
shouldProcess(root, result)
},
Rule (node, { result }) {
if (shouldProcess(node, result)) {
// new rule, reset flipped decl count to zero
flipped = 0
}
},
AtRule (node, { result }) {
if (shouldProcess(node, result)) {
// @rules requires url flipping only
if (context.config.processUrls === true || context.config.processUrls.atrule === true) {
const params = context.util.applyStringMap(node.params, true)
node.params = params
}
}
},
Comment (node, { result }) {
if (shouldProcess(node, result)) {
state.parse(node, result, function (current) {
let push = true
if (current.directive === null) {
current.preserve = !context.config.clean
context.util.each(context.config.plugins, function (plugin) {
const blacklist = context.config.blacklist[plugin.name]
if (blacklist && blacklist[current.metadata.name] === true) {
current.metadata.blacklist = true
if (current.metadata.end) {
push = false
}
if (current.metadata.begin) {
result.warn('directive "' + plugin.name + '.' + current.metadata.name + '" is blacklisted.', { node: current.source })
}
// break each
return false
}
current.directive = plugin.directives.control[current.metadata.name]
if (current.directive) {
if (!current.metadata.begin && current.metadata.end) {
if (current.directive.end(node, current.metadata, context)) {
state.pop(current)
}
push = false
} else if (current.directive.expect.self && current.directive.begin(node, current.metadata, context)) {
if (current.metadata.end && current.directive.end(node, current.metadata, context)) {
push = false
}
}
} else if (!current.metadata.blacklist) {
// break each
return false
}
})
}
if (current.directive) {
if (!current.metadata.begin && current.metadata.end) {
if (current.directive.end(node, current.metadata, context)) {
state.pop(current)
}
push = false
} else if (current.directive.expect.self && current.directive.begin(node, current.metadata, context)) {
if (current.metadata.end && current.directive.end(node, current.metadata, context)) {
push = false
result.warn('unsupported directive "' + current.metadata.name + '".', {node: current.source})
}
return push
})
break
case 'decl':
// if broken by a matching value directive .. break
if (!context.util.each(context.config.plugins,
function (plugin) {
return context.util.each(plugin.directives.value, function (directive) {
if (node.raws.value && node.raws.value.raw) {
var expr = context.util.regexDirective(directive.name)
if (expr.test(node.raws.value.raw)) {
expr.lastIndex = 0
if (directive.action(node, expr, context)) {
if (context.config.clean) {
node.value = node.raws.value.raw = context.util.trimDirective(node.raws.value.raw)
}
flipped++
// break
return false
}
}
}
} else if (!current.metadata.blacklist) {
push = false
result.warn('unsupported directive "' + current.metadata.name + '".', { node: current.source })
}
return push
})
}
},
Declaration (node, { result }) {
if (shouldProcess(node, result)) {
// if broken by a matching value directive .. break
if (!context.util.each(context.config.plugins,
function (plugin) {
return context.util.each(plugin.directives.value, function (directive) {
if (node.raws.value && node.raws.value.raw) {
const expr = context.util.regexDirective(directive.name)
if (expr.test(node.raws.value.raw)) {
expr.lastIndex = 0
if (directive.action(node, expr, context)) {
if (context.config.clean) {
node.value = node.raws.value.raw = context.util.trimDirective(node.raws.value.raw)
}
})
})) break
// loop over all plugins/property processors
context.util.each(context.config.plugins, function (plugin) {
return context.util.each(plugin.processors, function (processor) {
if (node.prop.match(processor.expr)) {
var raw = node.raws.value && node.raws.value.raw ? node.raws.value.raw : node.value
var state = context.util.saveComments(raw)
var pair = processor.action(node.prop, state.value, context)
state.value = pair.value
pair.value = context.util.restoreComments(state)
if (pair.prop !== node.prop || pair.value !== raw) {
flipped++
node.prop = pair.prop
node.value = pair.value
// break
return false
}
// match found, break
return false
}
})
}
})
// if last decl, apply auto rename
// decl. may be found inside @rules
if (context.config.autoRename && !flipped && node.parent.type === 'rule' && context.util.isLastOfType(node)) {
var renamed = context.util.applyStringMap(node.parent.selector)
if (context.config.autoRenameStrict === true) {
var pair = toBeRenamed[renamed]
if (pair) {
pair.selector = node.parent.selector
node.parent.selector = renamed
} else {
toBeRenamed[node.parent.selector] = node.parent
}
} else {
node.parent.selector = renamed
})) return
// loop over all plugins/property processors
context.util.each(context.config.plugins, function (plugin) {
return context.util.each(plugin.processors, function (processor) {
if (node.prop.match(processor.expr)) {
const raw = node.raws.value && node.raws.value.raw ? node.raws.value.raw : node.value
const state = context.util.saveComments(raw)
const pair = processor.action(node.prop, state.value, context)
state.value = pair.value
pair.value = context.util.restoreComments(state)
if (pair.prop !== node.prop || pair.value !== raw) {
flipped++
node.prop = pair.prop
node.value = pair.value
}
// match found, break
return false
}
break
case 'rule':
// new rule, reset flipped decl count to zero
flipped = 0
break
})
})
// if last decl, apply auto rename
// decl. may be found inside @rules
if (context.config.autoRename && !flipped && node.parent.type === 'rule' && context.util.isLastOfType(node)) {
const renamed = context.util.applyStringMap(node.parent.selector)
if (context.config.autoRenameStrict === true) {
const pair = toBeRenamed[renamed]
if (pair) {
pair.selector = node.parent.selector
node.parent.selector = renamed
} else {
toBeRenamed[node.parent.selector] = node.parent
}
} else {
node.parent.selector = renamed
}
}
}
})
state.walk(function (item) {
result.warn('unclosed directive "' + item.metadata.name + '".', {node: item.source})
})
Object.keys(toBeRenamed).forEach(function (key) {
result.warn('renaming skipped due to lack of a matching pair.', {node: toBeRenamed[key]})
})
context.config.hooks.post(css, postcss)
},
OnceExit (root, { result }) {
state.walk(function (item) {
result.warn('unclosed directive "' + item.metadata.name + '".', { node: item.source })
})
Object.keys(toBeRenamed).forEach(function (key) {
result.warn('renaming skipped due to lack of a matching pair.', { node: toBeRenamed[key] })
})
context.config.hooks.post(root, postcss)
}
}
})
}
module.exports.postcss = true
/**

@@ -177,3 +197,3 @@ * Creates a new RTLCSS instance, process the input and return its result.

* @param {Object} hooks An object containing pre/post hooks.
* @returns {String} A string contining the RTLed css.
* @returns {String} A string contining the RTLed css.
*/

@@ -180,0 +200,0 @@ module.exports.process = function (css, options, plugins, hooks) {

16

lib/state.js
'use strict'
var directiveParser = require('./directive-parser.js')
const directiveParser = require('./directive-parser.js')
module.exports = {
stack: [],
pop: function (current) {
var index = this.stack.indexOf(current)
const index = this.stack.indexOf(current)
if (index !== -1) {

@@ -15,4 +15,4 @@ this.stack.splice(index, 1)

parse: function (node, lazyResult, callback) {
var current
var metadata = directiveParser(node)
let current
const metadata = directiveParser(node)
if (metadata) {

@@ -23,3 +23,3 @@ if (!metadata.begin && metadata.end) {

this.pop(item)
current = {'metadata': metadata, 'directive': item.directive, 'source': node, 'preserve': item.preserve}
current = { metadata: metadata, directive: item.directive, source: node, preserve: item.preserve }
return false

@@ -29,7 +29,7 @@ }

} else {
current = {'metadata': metadata, 'directive': null, 'source': node, 'preserve': null}
current = { metadata: metadata, directive: null, source: node, preserve: null }
}
if (current === undefined) {
lazyResult.warn('found end "' + metadata.name + '" without a matching begin.', {node: node})
lazyResult.warn('found end "' + metadata.name + '" without a matching begin.', { node: node })
} else if (callback(current)) {

@@ -43,3 +43,3 @@ this.stack.push(current)

walk: function (callback) {
var len = this.stack.length
let len = this.stack.length
while (--len > -1) {

@@ -46,0 +46,0 @@ if (!callback(this.stack[len])) {

103

lib/util.js
'use strict'
var config
var CHAR_COMMENT_REPLACEMENT = '\uFFFD' // �
var CHAR_TOKEN_REPLACEMENT = '\u00A4'// ¤
var CHAR_TOKEN_START = '\u00AB' // «
var CHAR_TOKEN_END = '\u00BB' // »
let config
let tokenId = 0
var REGEX_COMMENT_REPLACEMENT = new RegExp(CHAR_COMMENT_REPLACEMENT, 'ig')
var REGEX_TOKEN_REPLACEMENT = new RegExp(CHAR_TOKEN_REPLACEMENT, 'ig')
const CHAR_COMMENT_REPLACEMENT = '\uFFFD' // �
const CHAR_TOKEN_REPLACEMENT = '\u00A4'// ¤
const CHAR_TOKEN_START = '\u00AB' // «
const CHAR_TOKEN_END = '\u00BB' // »
var PATTERN_NUMBER = '\\-?(\\d*?\\.\\d+|\\d+)'
var PATTERN_NUMBER_WITH_CALC = '(calc' + CHAR_TOKEN_REPLACEMENT + ')|(' + PATTERN_NUMBER + ')(?!d\\()'
var PATTERN_TOKEN = CHAR_TOKEN_START + '\\d+:\\d+' + CHAR_TOKEN_END // «offset:index»
var PATTERN_TOKEN_WITH_NAME = '\\w*?' + CHAR_TOKEN_START + '\\d+:\\d+' + CHAR_TOKEN_END // «offset:index»
const REGEX_COMMENT_REPLACEMENT = new RegExp(CHAR_COMMENT_REPLACEMENT, 'ig')
const REGEX_TOKEN_REPLACEMENT = new RegExp(CHAR_TOKEN_REPLACEMENT, 'ig')
var REGEX_COMMENT = /\/\*[^]*?\*\//igm // none-greedy
var REGEX_DIRECTIVE = /\/\*\s*(?:!)?\s*rtl:[^]*?\*\//img
var REGEX_ESCAPE = /[.*+?^${}()|[\]\\]/g
var REGEX_FUNCTION = /\([^\(\)]+\)/i
var REGEX_HEX_COLOR = /#[a-f0-9]{3,6}/ig
var REGEX_CALC = /calc/
var REGEX_TOKENS = new RegExp(PATTERN_TOKEN, 'ig')
var REGEX_TOKENS_WITH_NAME = new RegExp(PATTERN_TOKEN_WITH_NAME, 'ig')
const PATTERN_NUMBER = '\\-?(\\d*?\\.\\d+|\\d+)'
const PATTERN_NUMBER_WITH_CALC = '(calc' + CHAR_TOKEN_REPLACEMENT + ')|(' + PATTERN_NUMBER + ')(?!d\\()'
const PATTERN_TOKEN = CHAR_TOKEN_START + '\\d+:\\d+' + CHAR_TOKEN_END // «offset:index»
const PATTERN_TOKEN_WITH_NAME = '\\w*?' + CHAR_TOKEN_START + '\\d+:\\d+' + CHAR_TOKEN_END // «offset:index»
var REGEX_COMPLEMENT = new RegExp(PATTERN_NUMBER_WITH_CALC, 'i')
var REGEX_NEGATE_ALL = new RegExp(PATTERN_NUMBER_WITH_CALC, 'ig')
var REGEX_NEGATE_ONE = new RegExp(PATTERN_NUMBER_WITH_CALC, 'i')
const REGEX_COMMENT = /\/\*[^]*?\*\//igm // none-greedy
const REGEX_DIRECTIVE = /\/\*\s*(?:!)?\s*rtl:[^]*?\*\//img
const REGEX_ESCAPE = /[.*+?^${}()|[\]\\]/g
const REGEX_FUNCTION = /\([^()]+\)/i
const REGEX_HEX_COLOR = /#[a-f0-9]{3,6}/ig
const REGEX_CALC = /calc/
const REGEX_TOKENS = new RegExp(PATTERN_TOKEN, 'ig')
const REGEX_TOKENS_WITH_NAME = new RegExp(PATTERN_TOKEN_WITH_NAME, 'ig')
var DEFAULT_STRING_MAP_OPTIONS = { scope: '*', ignoreCase: true }
var TOKEN_ID = 0
const REGEX_COMPLEMENT = new RegExp(PATTERN_NUMBER_WITH_CALC, 'i')
const REGEX_NEGATE_ALL = new RegExp(PATTERN_NUMBER_WITH_CALC, 'ig')
const REGEX_NEGATE_ONE = new RegExp(PATTERN_NUMBER_WITH_CALC, 'i')
const DEFAULT_STRING_MAP_OPTIONS = { scope: '*', ignoreCase: true }
function compare (what, to, ignoreCase) {

@@ -48,4 +49,4 @@ if (ignoreCase) {

}
for (var prop in src) {
if (!dest.hasOwnProperty(prop)) {
for (const prop in src) {
if (!Object.prototype.hasOwnProperty.call(dest, prop)) {
dest[prop] = src[prop]

@@ -57,9 +58,9 @@ }

swap: function (value, a, b, options) {
var expr = escapeRegExp(a) + '|' + escapeRegExp(b)
let expr = escapeRegExp(a) + '|' + escapeRegExp(b)
options = options || DEFAULT_STRING_MAP_OPTIONS
var greedy = options.hasOwnProperty('greedy') ? options.greedy : config.greedy
const greedy = Object.prototype.hasOwnProperty.call(options, 'greedy') ? options.greedy : config.greedy
if (!greedy) {
expr = '\\b(' + expr + ')\\b'
}
var flags = options.ignoreCase ? 'img' : 'mg'
const flags = options.ignoreCase ? 'img' : 'mg'
return value.replace(new RegExp(expr, flags), function (m) { return compare(m, a, options.ignoreCase) ? b : a })

@@ -74,9 +75,9 @@ },

applyStringMap: function (value, isUrl) {
var result = value
for (var x = 0; x < config.stringMap.length; x++) {
var map = config.stringMap[x]
var options = this.extend(map.options, DEFAULT_STRING_MAP_OPTIONS)
let result = value
for (let x = 0; x < config.stringMap.length; x++) {
const map = config.stringMap[x]
const options = this.extend(map.options, DEFAULT_STRING_MAP_OPTIONS)
if (options.scope === '*' || (isUrl && options.scope === 'url') || (!isUrl && options.scope === 'selector')) {
if (Array.isArray(map.search) && Array.isArray(map.replace)) {
for (var mapIndex = 0; mapIndex < map.search.length; mapIndex++) {
for (let mapIndex = 0; mapIndex < map.search.length; mapIndex++) {
result = this.swap(result, map.search[mapIndex], map.replace[mapIndex % map.search.length], options)

@@ -95,3 +96,3 @@ }

negate: function (value) {
var state = this.saveTokens(value)
const state = this.saveTokens(value)
state.value = state.value.replace(REGEX_NEGATE_ONE, function (num) {

@@ -103,3 +104,3 @@ return REGEX_TOKEN_REPLACEMENT.test(num) ? num.replace(REGEX_TOKEN_REPLACEMENT, function (m) { return '(-1*' + m + ')' }) : parseFloat(num, 10) * -1

negateAll: function (value) {
var state = this.saveTokens(value)
const state = this.saveTokens(value)
state.value = state.value.replace(REGEX_NEGATE_ALL, function (num) {

@@ -111,3 +112,3 @@ return REGEX_TOKEN_REPLACEMENT.test(num) ? num.replace(REGEX_TOKEN_REPLACEMENT, function (m) { return '(-1*' + m + ')' }) : parseFloat(num, 10) * -1

complement: function (value) {
var state = this.saveTokens(value)
const state = this.saveTokens(value)
state.value = state.value.replace(REGEX_COMPLEMENT, function (num) {

@@ -122,3 +123,3 @@ return REGEX_TOKEN_REPLACEMENT.test(num) ? num.replace(REGEX_TOKEN_REPLACEMENT, function (m) { return '(100% - ' + m + ')' }) : 100 - parseFloat(num, 10)

save: function (what, who, replacement, restorer, exclude) {
var state = {
const state = {
value: who,

@@ -139,4 +140,4 @@ store: [],

restore: function (state) {
var index = 0
var result = state.value.replace(state.restorer, function () {
let index = 0
const result = state.value.replace(state.restorer, function () {
return state.store[index++]

@@ -162,7 +163,7 @@ })

guard: function (what, who, indexed) {
var state = {
const state = {
value: who,
store: [],
offset: TOKEN_ID++,
token: CHAR_TOKEN_START + TOKEN_ID,
offset: tokenId++,
token: CHAR_TOKEN_START + tokenId,
indexed: indexed === true

@@ -181,6 +182,6 @@ }

if (state.indexed === true) {
var detokenizer = new RegExp('(\\w*?)' + state.token + ':(\\d+)' + CHAR_TOKEN_END, 'i')
const detokenizer = new RegExp('(\\w*?)' + state.token + ':(\\d+)' + CHAR_TOKEN_END, 'i')
while (detokenizer.test(state.value)) {
state.value = state.value.replace(detokenizer, function (match, name, index) {
var value = state.store[index - 1]
const value = state.store[index - 1]
if (typeof callback === 'function') {

@@ -195,3 +196,3 @@ return name + callback(value, name)

return state.value.replace(new RegExp('(\\w*?)' + state.token + CHAR_TOKEN_END, 'i'), function (match, name) {
var value = state.store.shift()
const value = state.store.shift()
if (typeof callback === 'function') {

@@ -227,4 +228,4 @@ return name + callback(value, name)

what = what || []
var expression = ''
for (var x = 0; x < what.length; x++) {
let expression = ''
for (let x = 0; x < what.length; x++) {
switch (what[x]) {

@@ -251,4 +252,4 @@ case 'percent':

isLastOfType: function (node) {
var isLast = true
var next = node.next()
let isLast = true
let next = node.next()
while (next) {

@@ -268,3 +269,3 @@ if (next && next.type === node.type) {

each: function (array, callback) {
for (var len = 0; len < array.length; len++) {
for (let len = 0; len < array.length; len++) {
if (callback(array[len]) === false) {

@@ -271,0 +272,0 @@ return false

21

package.json
{
"author": "Mohammad Younes",
"name": "rtlcss",
"version": "2.6.2",
"version": "3.0.0",
"description": "Framework for transforming cascading style sheets (CSS) from left-to-right (LTR) to right-to-left (RTL)",

@@ -29,12 +29,15 @@ "homepage": "http://rtlcss.com/",

"dependencies": {
"@choojs/findup": "^0.2.1",
"chalk": "^2.4.2",
"mkdirp": "^0.5.1",
"postcss": "^6.0.23",
"strip-json-comments": "^2.0.0"
"chalk": "^4.1.0",
"find-up": "^5.0.0",
"mkdirp": "^1.0.4",
"postcss": "^8.2.1",
"strip-json-comments": "^3.1.1"
},
"devDependencies": {
"mocha": "^5.0.0",
"standard": "^6.0.0"
"mocha": "^8.2.1",
"standard": "^16.0.3"
},
"peerDependencies": {
"postcss": "^8.2.1"
},
"scripts": {

@@ -45,2 +48,2 @@ "lint": "standard && node ./lib/rtlcss.js",

"main": "./lib/rtlcss.js"
}
}

25

test/cli.js

@@ -1,12 +0,11 @@

/* global process */
/* global describe */
/* global it */
var assert = require('assert')
var spawn = require('child_process').spawn
var fs = require('fs')
const assert = require('assert')
const spawn = require('child_process').spawn
const fs = require('fs')
function run_cmd (cmd, args, done) {
var child = spawn(cmd, args)
var resp = ''
var err = ''
function runCommand (cmd, args, done) {
const child = spawn(cmd, args)
let resp = ''
let err = ''
child.stderr.on('data', function (error) { err += error })

@@ -17,10 +16,10 @@ child.stdout.on('data', function (buffer) { resp += buffer.toString() })

var configPath = './test/css/config.json'
var inputPath = './test/css/input.css'
var expectedPath = './test/css/input.expected.css'
var outputPath = './test/css/input.rtl.css'
const configPath = './test/css/config.json'
const inputPath = './test/css/input.css'
const expectedPath = './test/css/input.expected.css'
const outputPath = './test/css/input.rtl.css'
describe('# CLI', function () {
it('Should succeed', function (done) {
run_cmd('node', ['./bin/rtlcss.js', inputPath, '--config', configPath, '--silent', ''], function (err, resp) {
runCommand('node', ['./bin/rtlcss.js', inputPath, '--config', configPath, '--silent', ''], function (err, resp) {
if (err) throw new Error(err)

@@ -27,0 +26,0 @@ fs.readFile(expectedPath, 'utf-8', function (err, expected) {

34

test/data/background-image.js
module.exports = [
{
'should': 'Should process string map in url (processUrls:true)',
'expected': 'div { background-image: url(images/rtl.png), url(images/right.png);}',
'input': 'div { background-image: url(images/ltr.png), url(images/left.png);}',
'reversable': true,
'options': { 'processUrls': true }
should: 'Should process string map in url (processUrls:true)',
expected: 'div { background-image: url(images/rtl.png), url(images/right.png);}',
input: 'div { background-image: url(images/ltr.png), url(images/left.png);}',
reversable: true,
options: { processUrls: true }
},
{
'should': 'Should not negate color value for linear gradient',
'expected': 'div { background-image: linear-gradient(rgba(255, 255, 255, 0.3) 0%, #ff8 100%);}',
'input': 'div { background-image: linear-gradient(rgba(255, 255, 255, 0.3) 0%, #ff8 100%);}',
'reversable': true
should: 'Should not negate color value for linear gradient',
expected: 'div { background-image: linear-gradient(rgba(255, 255, 255, 0.3) 0%, #ff8 100%);}',
input: 'div { background-image: linear-gradient(rgba(255, 255, 255, 0.3) 0%, #ff8 100%);}',
reversable: true
},
{
'should': 'Should not negate color value for linear gradient with calc',
'expected': 'div { background-image: linear-gradient(rgba(255, 255, calc((125 * 2) + 5), 0.3) 0%, #ff8 100%);}',
'input': 'div { background-image: linear-gradient(rgba(255, 255, calc((125 * 2) + 5), 0.3) 0%, #ff8 100%);}',
'reversable': true
should: 'Should not negate color value for linear gradient with calc',
expected: 'div { background-image: linear-gradient(rgba(255, 255, calc((125 * 2) + 5), 0.3) 0%, #ff8 100%);}',
input: 'div { background-image: linear-gradient(rgba(255, 255, calc((125 * 2) + 5), 0.3) 0%, #ff8 100%);}',
reversable: true
},
{
'should': 'Should negate angle value for linear gradient',
'expected': 'div { background-image: linear-gradient(13.25deg, rgba(255, 255, 255, .15) 25%, transparent 25%);}',
'input': 'div { background-image: linear-gradient(-13.25deg, rgba(255, 255, 255, .15) 25%, transparent 25%);}',
'reversable': true
should: 'Should negate angle value for linear gradient',
expected: 'div { background-image: linear-gradient(13.25deg, rgba(255, 255, 255, .15) 25%, transparent 25%);}',
input: 'div { background-image: linear-gradient(-13.25deg, rgba(255, 255, 255, .15) 25%, transparent 25%);}',
reversable: true
}
]

128

test/data/background-position.js
module.exports = [
{
'should': 'Should mirror position (keywords only)',
'expected': 'div {background-position:top left, right bottom}',
'input': 'div {background-position:top right, left bottom}',
'reversable': true
should: 'Should mirror position (keywords only)',
expected: 'div {background-position:top left, right bottom}',
input: 'div {background-position:top right, left bottom}',
reversable: true
},
{
'should': 'Should ignore mirroring invalid position',
'expected': 'div {background-position:25% left, right 25%;}',
'input': 'div {background-position:75% left, left 25%;}',
'reversable': true
should: 'Should ignore mirroring invalid position',
expected: 'div {background-position:25% left, right 25%;}',
input: 'div {background-position:75% left, left 25%;}',
reversable: true
},
{
'should': 'Should complement percentage horizontal position ',
'expected': 'div {background-position:100% 75%;}',
'input': 'div {background-position:0 75%;}',
'reversable': false
should: 'Should complement percentage horizontal position ',
expected: 'div {background-position:100% 75%;}',
input: 'div {background-position:0 75%;}',
reversable: false
},
{
'should': 'Should complement percentage horizontal position with calc',
'expected': 'div {background-position:calc(100% - (30% + 50px)) 75%;}',
'input': 'div {background-position:calc(30% + 50px) 75%;}',
'reversable': false
should: 'Should complement percentage horizontal position with calc',
expected: 'div {background-position:calc(100% - (30% + 50px)) 75%;}',
input: 'div {background-position:calc(30% + 50px) 75%;}',
reversable: false
},
{
'should': 'Should complement percentage horizontal position ',
'expected': 'div {background-position:81.25% 75%, 10.75% top;}',
'input': 'div {background-position:18.75% 75%, 89.25% top;}',
'reversable': true
should: 'Should complement percentage horizontal position ',
expected: 'div {background-position:81.25% 75%, 10.75% top;}',
input: 'div {background-position:18.75% 75%, 89.25% top;}',
reversable: true
},
{
'should': 'Should complement percentage horizontal position with calc',
'expected': 'div {background-position:calc(100% - (30% + 50px)) calc(30% + 50px), 10.75% top;}',
'input': 'div {background-position:calc(30% + 50px) calc(30% + 50px), 89.25% top;}',
'reversable': false
should: 'Should complement percentage horizontal position with calc',
expected: 'div {background-position:calc(100% - (30% + 50px)) calc(30% + 50px), 10.75% top;}',
input: 'div {background-position:calc(30% + 50px) calc(30% + 50px), 89.25% top;}',
reversable: false
},
{
'should': 'Should mirror background-position',
'expected': 'div {background-position:right 75%, left top;}',
'input': 'div {background-position:left 75%, right top;}',
'reversable': true
should: 'Should mirror background-position',
expected: 'div {background-position:right 75%, left top;}',
input: 'div {background-position:left 75%, right top;}',
reversable: true
},
{
'should': 'Should mirror background-position (calc)',
'expected': 'div {background-position:right -ms-calc(30% + 50px), left top;}',
'input': 'div {background-position:left -ms-calc(30% + 50px), right top;}',
'reversable': true
should: 'Should mirror background-position (calc)',
expected: 'div {background-position:right -ms-calc(30% + 50px), left top;}',
input: 'div {background-position:left -ms-calc(30% + 50px), right top;}',
reversable: true
},
{
'should': 'Should complement percentage: position-x (treat 0 as 0%)',
'expected': 'div {background-position-x:100%, 0%;}',
'input': 'div {background-position-x:0, 100%;}',
'reversable': false
should: 'Should complement percentage: position-x (treat 0 as 0%)',
expected: 'div {background-position-x:100%, 0%;}',
input: 'div {background-position-x:0, 100%;}',
reversable: false
},
{
'should': 'Should complement percentage: position-x',
'expected': 'div {background-position-x:81.75%, 11%;}',
'input': 'div {background-position-x:18.25%, 89%;}',
'reversable': true
should: 'Should complement percentage: position-x',
expected: 'div {background-position-x:81.75%, 11%;}',
input: 'div {background-position-x:18.25%, 89%;}',
reversable: true
},
{
'should': 'Should complement percentage with calc: position-x',
'expected': 'div {background-position-x:calc(100% - (30% + 50px)), -webkit-calc(100% - (30% + 50px));}',
'input': 'div {background-position-x:calc(30% + 50px), -webkit-calc(30% + 50px);}',
'reversable': false
should: 'Should complement percentage with calc: position-x',
expected: 'div {background-position-x:calc(100% - (30% + 50px)), -webkit-calc(100% - (30% + 50px));}',
input: 'div {background-position-x:calc(30% + 50px), -webkit-calc(30% + 50px);}',
reversable: false
},
{
'should': 'Should mirror position-x',
'expected': 'div {background-position-x:right, left;}',
'input': 'div {background-position-x:left, right;}',
'reversable': true
should: 'Should mirror position-x',
expected: 'div {background-position-x:right, left;}',
input: 'div {background-position-x:left, right;}',
reversable: true
},
{
'should': 'Should mirror position-x (calc)',
'expected': 'div {background-position-x:calc(100% - (30% + 50px)), calc(100% - (50px * 5));}',
'input': 'div {background-position-x:calc(30% + 50px), calc(50px * 5);}',
'reversable': false
should: 'Should mirror position-x (calc)',
expected: 'div {background-position-x:calc(100% - (30% + 50px)), calc(100% - (50px * 5));}',
input: 'div {background-position-x:calc(30% + 50px), calc(50px * 5);}',
reversable: false
},
{
'should': 'Should keep as is: position-x',
'expected': 'div {background-position-x:100px, 0px;}',
'input': 'div {background-position-x:100px, 0px;}',
'reversable': true
should: 'Should keep as is: position-x',
expected: 'div {background-position-x:100px, 0px;}',
input: 'div {background-position-x:100px, 0px;}',
reversable: true
},
{
'should': 'Should mirror background-position edge offsets (4 values)',
'expected': 'div {background-position: left 5px bottom 5px, bottom 15px right 15px;}',
'input': 'div {background-position: right 5px bottom 5px, bottom 15px left 15px;}',
'reversable': true
should: 'Should mirror background-position edge offsets (4 values)',
expected: 'div {background-position: left 5px bottom 5px, bottom 15px right 15px;}',
input: 'div {background-position: right 5px bottom 5px, bottom 15px left 15px;}',
reversable: true
},
{
'should': 'Should mirror background-position edge offsets (3 values)',
'expected': 'div {background-position: left 5px bottom, top 15px right;}',
'input': 'div {background-position: right 5px bottom, top 15px left;}',
'reversable': true
should: 'Should mirror background-position edge offsets (3 values)',
expected: 'div {background-position: left 5px bottom, top 15px right;}',
input: 'div {background-position: right 5px bottom, top 15px left;}',
reversable: true
}
]

120

test/data/background.js
module.exports = [
{
'should': 'Should treat 0 as 0%',
'expected': '.banner { background: 100% top url(topbanner.png) #00D repeat-y fixed; }',
'input': '.banner { background: 0 top url(topbanner.png) #00D repeat-y fixed; }',
'reversable': false
should: 'Should treat 0 as 0%',
expected: '.banner { background: 100% top url(topbanner.png) #00D repeat-y fixed; }',
input: '.banner { background: 0 top url(topbanner.png) #00D repeat-y fixed; }',
reversable: false
},
{
'should': 'Should complement percentage horizontal position',
'expected': '.banner { background: 81% top url(topbanner.png) #00D repeat-y fixed; }',
'input': '.banner { background: 19% top url(topbanner.png) #00D repeat-y fixed; }',
'reversable': true
should: 'Should complement percentage horizontal position',
expected: '.banner { background: 81% top url(topbanner.png) #00D repeat-y fixed; }',
input: '.banner { background: 19% top url(topbanner.png) #00D repeat-y fixed; }',
reversable: true
},
{
'should': 'Should complement calc horizontal position',
'expected': '.banner { background: calc(100% - (19% + 2px)) top url(topbanner.png) #00D repeat-y fixed; }',
'input': '.banner { background: calc(19% + 2px) top url(topbanner.png) #00D repeat-y fixed; }',
'reversable': false
should: 'Should complement calc horizontal position',
expected: '.banner { background: calc(100% - (19% + 2px)) top url(topbanner.png) #00D repeat-y fixed; }',
input: '.banner { background: calc(19% + 2px) top url(topbanner.png) #00D repeat-y fixed; }',
reversable: false
},
{
'should': 'Should mirror keyword horizontal position',
'expected': '.banner { background: right top url(topbanner.png) #00D repeat-y fixed; }',
'input': '.banner { background: left top url(topbanner.png) #00D repeat-y fixed; }',
'reversable': true
should: 'Should mirror keyword horizontal position',
expected: '.banner { background: right top url(topbanner.png) #00D repeat-y fixed; }',
input: '.banner { background: left top url(topbanner.png) #00D repeat-y fixed; }',
reversable: true
},
{
'should': 'Should mirror keyword horizontal position (with value)',
'expected': '.banner { background: #00D url(topbanner.png) no-repeat top 50% left 16px; }',
'input': '.banner { background: #00D url(topbanner.png) no-repeat top 50% right 16px; }',
'reversable': true
should: 'Should mirror keyword horizontal position (with value)',
expected: '.banner { background: #00D url(topbanner.png) no-repeat top 50% left 16px; }',
input: '.banner { background: #00D url(topbanner.png) no-repeat top 50% right 16px; }',
reversable: true
},
{
'should': 'Should not process string map in url (default)',
'expected': '.banner { background: 10px top url(ltr-top-right-banner.png) #00D repeat-y fixed; }',
'input': '.banner { background: 10px top url(ltr-top-right-banner.png) #00D repeat-y fixed; }',
'reversable': true
should: 'Should not process string map in url (default)',
expected: '.banner { background: 10px top url(ltr-top-right-banner.png) #00D repeat-y fixed; }',
input: '.banner { background: 10px top url(ltr-top-right-banner.png) #00D repeat-y fixed; }',
reversable: true
},
{
'should': 'Should process string map in url (processUrls:true)',
'expected': '.banner { background: 10px top url(rtl-top-left-banner.png) #00D repeat-y fixed; }',
'input': '.banner { background: 10px top url(ltr-top-right-banner.png) #00D repeat-y fixed; }',
'reversable': true,
'options': { 'processUrls': true }
should: 'Should process string map in url (processUrls:true)',
expected: '.banner { background: 10px top url(rtl-top-left-banner.png) #00D repeat-y fixed; }',
input: '.banner { background: 10px top url(ltr-top-right-banner.png) #00D repeat-y fixed; }',
reversable: true,
options: { processUrls: true }
},
{
'should': 'Should process string map in url (processUrls:{decl:true})',
'expected': '.banner { background: 10px top url(rtl-top-left-banner.png) #00D repeat-y fixed; }',
'input': '.banner { background: 10px top url(ltr-top-right-banner.png) #00D repeat-y fixed; }',
'reversable': true,
'options': { 'processUrls': { 'decl': true } }
should: 'Should process string map in url (processUrls:{decl:true})',
expected: '.banner { background: 10px top url(rtl-top-left-banner.png) #00D repeat-y fixed; }',
input: '.banner { background: 10px top url(ltr-top-right-banner.png) #00D repeat-y fixed; }',
reversable: true,
options: { processUrls: { decl: true } }
},
{
'should': 'Should not process string map in url (processUrls:{atrule:true})',
'expected': '.banner { background: 10px top url(ltr-top-right-banner.png) #00D repeat-y fixed; }',
'input': '.banner { background: 10px top url(ltr-top-right-banner.png) #00D repeat-y fixed; }',
'reversable': true,
'options': { 'processUrls': { 'atrule': true } }
should: 'Should not process string map in url (processUrls:{atrule:true})',
expected: '.banner { background: 10px top url(ltr-top-right-banner.png) #00D repeat-y fixed; }',
input: '.banner { background: 10px top url(ltr-top-right-banner.png) #00D repeat-y fixed; }',
reversable: true,
options: { processUrls: { atrule: true } }
},
{
'should': 'Should not swap bright:bleft, ultra:urtla',
'expected': '.banner { background: 10px top url(ultra/bright.png) #00D repeat-y fixed; }',
'input': '.banner { background: 10px top url(ultra/bright.png) #00D repeat-y fixed; }',
'reversable': true
should: 'Should not swap bright:bleft, ultra:urtla',
expected: '.banner { background: 10px top url(ultra/bright.png) #00D repeat-y fixed; }',
input: '.banner { background: 10px top url(ultra/bright.png) #00D repeat-y fixed; }',
reversable: true
},
{
'should': 'Should swap bright:bleft, ultra:urtla (processUrls: true, greedy)',
'expected': '.banner { background: 10px top url(urtla/bleft.png) #00D repeat-y fixed; }',
'input': '.banner { background: 10px top url(ultra/bright.png) #00D repeat-y fixed; }',
'reversable': true,
'options': { 'processUrls': true, 'greedy': true }
should: 'Should swap bright:bleft, ultra:urtla (processUrls: true, greedy)',
expected: '.banner { background: 10px top url(urtla/bleft.png) #00D repeat-y fixed; }',
input: '.banner { background: 10px top url(ultra/bright.png) #00D repeat-y fixed; }',
reversable: true,
options: { processUrls: true, greedy: true }
},
{
'should': 'Should not flip hex colors ',
'expected': '.banner { background: #ff0; }',
'input': '.banner { background: #ff0; }',
'reversable': true
should: 'Should not flip hex colors ',
expected: '.banner { background: #ff0; }',
input: '.banner { background: #ff0; }',
reversable: true
},
{
'should': 'Should treat 0 as 0% (url first)',
'expected': '.banner { background: url(topbanner.png) 100% top #00D repeat-y fixed; }',
'input': '.banner { background: url(topbanner.png) 0 top #00D repeat-y fixed; }',
'reversable': false
should: 'Should treat 0 as 0% (url first)',
expected: '.banner { background: url(topbanner.png) 100% top #00D repeat-y fixed; }',
input: '.banner { background: url(topbanner.png) 0 top #00D repeat-y fixed; }',
reversable: false
},
{
'should': 'Should complement calc horizontal position (url first)',
'expected': '.banner { background: url(topbanner.png) calc(100% - (19% + 2px)) top #00D repeat-y fixed; }',
'input': '.banner { background: url(topbanner.png) calc(19% + 2px) top #00D repeat-y fixed; }',
'reversable': false
should: 'Should complement calc horizontal position (url first)',
expected: '.banner { background: url(topbanner.png) calc(100% - (19% + 2px)) top #00D repeat-y fixed; }',
input: '.banner { background: url(topbanner.png) calc(19% + 2px) top #00D repeat-y fixed; }',
reversable: false
}
]

120

test/data/perspective-origin.js
module.exports = [
{
'should': 'Should mirror (x-offset: 0 means 0%)',
'expected': 'div { perspective-origin:100%; }',
'input': 'div { perspective-origin:0; }',
'reversable': false
should: 'Should mirror (x-offset: 0 means 0%)',
expected: 'div { perspective-origin:100%; }',
input: 'div { perspective-origin:0; }',
reversable: false
},
{
'should': 'Should mirror (x-offset)',
'expected': 'div { perspective-origin:90.25%; }',
'input': 'div { perspective-origin:9.75%; }',
'reversable': true
should: 'Should mirror (x-offset)',
expected: 'div { perspective-origin:90.25%; }',
input: 'div { perspective-origin:9.75%; }',
reversable: true
},
{
'should': 'Should mirror calc (x-offset)',
'expected': 'div { perspective-origin: -moz-calc(100% - (((25%/2) * 10px))); }',
'input': 'div { perspective-origin: -moz-calc(((25%/2) * 10px)); }',
'reversable': false
should: 'Should mirror calc (x-offset)',
expected: 'div { perspective-origin: -moz-calc(100% - (((25%/2) * 10px))); }',
input: 'div { perspective-origin: -moz-calc(((25%/2) * 10px)); }',
reversable: false
},
{
'should': 'Should not mirror (x-offset: not percent, not calc)',
'expected': 'div { perspective-origin:10.75px; }',
'input': 'div { perspective-origin:10.75px; }',
'reversable': false
should: 'Should not mirror (x-offset: not percent, not calc)',
expected: 'div { perspective-origin:10.75px; }',
input: 'div { perspective-origin:10.75px; }',
reversable: false
},
{
'should': 'Should mirror (offset-keyword)',
'expected': 'div { perspective-origin:right; }',
'input': 'div { perspective-origin:left; }',
'reversable': true
should: 'Should mirror (offset-keyword)',
expected: 'div { perspective-origin:right; }',
input: 'div { perspective-origin:left; }',
reversable: true
},
{
'should': 'Should mirror (x-offset y-offset: 0 means 0%)',
'expected': 'div { perspective-origin:100% 0; }',
'input': 'div { perspective-origin:0 0; }',
'reversable': false
should: 'Should mirror (x-offset y-offset: 0 means 0%)',
expected: 'div { perspective-origin:100% 0; }',
input: 'div { perspective-origin:0 0; }',
reversable: false
},
{
'should': 'Should mirror with y being calc (x-offset y-offset: 0 means 0%)',
'expected': 'div { perspective-origin:100% -webkit-calc(15% * (3/2)); }',
'input': 'div { perspective-origin:0 -webkit-calc(15% * (3/2)); }',
'reversable': false
should: 'Should mirror with y being calc (x-offset y-offset: 0 means 0%)',
expected: 'div { perspective-origin:100% -webkit-calc(15% * (3/2)); }',
input: 'div { perspective-origin:0 -webkit-calc(15% * (3/2)); }',
reversable: false
},
{
'should': 'Should mirror percent (x-offset y-offset)',
'expected': 'div { perspective-origin:30.25% 10%; }',
'input': 'div { perspective-origin:69.75% 10%; }',
'reversable': true
should: 'Should mirror percent (x-offset y-offset)',
expected: 'div { perspective-origin:30.25% 10%; }',
input: 'div { perspective-origin:69.75% 10%; }',
reversable: true
},
{
'should': 'Should mirror with x being calc (x-offset y-offset)',
'expected': 'div { perspective-origin: -webkit-calc(100% - (15% * (3/2))) 30.25%; }',
'input': 'div { perspective-origin: -webkit-calc(15% * (3/2)) 30.25%; }',
'reversable': false
should: 'Should mirror with x being calc (x-offset y-offset)',
expected: 'div { perspective-origin: -webkit-calc(100% - (15% * (3/2))) 30.25%; }',
input: 'div { perspective-origin: -webkit-calc(15% * (3/2)) 30.25%; }',
reversable: false
},
{
'should': 'Should mirror with y being calc (x-offset y-offset)',
'expected': 'div { perspective-origin:30.25% calc(15% * (3/2)); }',
'input': 'div { perspective-origin:69.75% calc(15% * (3/2)); }',
'reversable': true
should: 'Should mirror with y being calc (x-offset y-offset)',
expected: 'div { perspective-origin:30.25% calc(15% * (3/2)); }',
input: 'div { perspective-origin:69.75% calc(15% * (3/2)); }',
reversable: true
},
{
'should': 'Should mirror (x-offset-keyword y-offset)',
'expected': 'div { perspective-origin:right 70%; }',
'input': 'div { perspective-origin:left 70%; }',
'reversable': true
should: 'Should mirror (x-offset-keyword y-offset)',
expected: 'div { perspective-origin:right 70%; }',
input: 'div { perspective-origin:left 70%; }',
reversable: true
},
{
'should': 'Should mirror with calc (x-offset-keyword y-offset)',
'expected': 'div { perspective-origin:right -moz-calc(((140%/2))); }',
'input': 'div { perspective-origin:left -moz-calc(((140%/2))); }',
'reversable': true
should: 'Should mirror with calc (x-offset-keyword y-offset)',
expected: 'div { perspective-origin:right -moz-calc(((140%/2))); }',
input: 'div { perspective-origin:left -moz-calc(((140%/2))); }',
reversable: true
},
{
'should': 'Should mirror (x-offset-keyword y-offset-keyword)',
'expected': 'div { perspective-origin:right top; }',
'input': 'div { perspective-origin:left top; }',
'reversable': true
should: 'Should mirror (x-offset-keyword y-offset-keyword)',
expected: 'div { perspective-origin:right top; }',
input: 'div { perspective-origin:left top; }',
reversable: true
},
{
'should': 'Should mirror (x-offset-keyword y-offset-keyword)',
'expected': 'div { perspective-origin:left bottom; }',
'input': 'div { perspective-origin:right bottom; }',
'reversable': true
should: 'Should mirror (x-offset-keyword y-offset-keyword)',
expected: 'div { perspective-origin:left bottom; }',
input: 'div { perspective-origin:right bottom; }',
reversable: true
},
{
'should': 'Should mirror (y-offset-keyword x-offset-keyword)',
'expected': 'div { perspective-origin:bottom left; }',
'input': 'div { perspective-origin:bottom right; }',
'reversable': true
should: 'Should mirror (y-offset-keyword x-offset-keyword)',
expected: 'div { perspective-origin:bottom left; }',
input: 'div { perspective-origin:bottom right; }',
reversable: true
}
]

72

test/data/properties.js
module.exports = [
{
'should': 'Should mirror property name: border-top-right-radius',
'expected': 'div { border-top-left-radius:15px; }',
'input': 'div { border-top-right-radius:15px; }',
'reversable': true
should: 'Should mirror property name: border-top-right-radius',
expected: 'div { border-top-left-radius:15px; }',
input: 'div { border-top-right-radius:15px; }',
reversable: true
},
{
'should': 'Should mirror property name: border-bottom-right-radius',
'expected': 'div { border-bottom-left-radius:15px; }',
'input': 'div { border-bottom-right-radius:15px; }',
'reversable': true
should: 'Should mirror property name: border-bottom-right-radius',
expected: 'div { border-bottom-left-radius:15px; }',
input: 'div { border-bottom-right-radius:15px; }',
reversable: true
},
{
'should': 'Should mirror property name: border-left',
'expected': 'div { border-right:1px solid black; }',
'input': 'div { border-left:1px solid black; }',
'reversable': true
should: 'Should mirror property name: border-left',
expected: 'div { border-right:1px solid black; }',
input: 'div { border-left:1px solid black; }',
reversable: true
},
{
'should': 'Should mirror property name: border-left-color',
'expected': 'div { border-right-color:black; }',
'input': 'div { border-left-color:black; }',
'reversable': true
should: 'Should mirror property name: border-left-color',
expected: 'div { border-right-color:black; }',
input: 'div { border-left-color:black; }',
reversable: true
},
{
'should': 'Should mirror property name: border-left-style',
'expected': 'div { border-right-style:solid; }',
'input': 'div { border-left-style:solid; }',
'reversable': true
should: 'Should mirror property name: border-left-style',
expected: 'div { border-right-style:solid; }',
input: 'div { border-left-style:solid; }',
reversable: true
},
{
'should': 'Should mirror property name: border-left-width',
'expected': 'div { border-right-width:1em; }',
'input': 'div { border-left-width:1em; }',
'reversable': true
should: 'Should mirror property name: border-left-width',
expected: 'div { border-right-width:1em; }',
input: 'div { border-left-width:1em; }',
reversable: true
},
{
'should': 'Should mirror property name: left',
'expected': 'div { right:auto; }',
'input': 'div { left:auto; }',
'reversable': true
should: 'Should mirror property name: left',
expected: 'div { right:auto; }',
input: 'div { left:auto; }',
reversable: true
},
{
'should': 'Should mirror property name: margin-left',
'expected': 'div { margin-right:2em; }',
'input': 'div { margin-left:2em; }',
'reversable': true
should: 'Should mirror property name: margin-left',
expected: 'div { margin-right:2em; }',
input: 'div { margin-left:2em; }',
reversable: true
},
{
'should': 'Should mirror property name: padding-left',
'expected': 'div { padding-right:2em; }',
'input': 'div { padding-left:2em; }',
'reversable': true
should: 'Should mirror property name: padding-left',
expected: 'div { padding-right:2em; }',
input: 'div { padding-left:2em; }',
reversable: true
}
]

490

test/data/rtlcss-directives.js
module.exports = [
{
'should': 'Should auto rename selectors having no directional decl. unless forced to ignore. (autoRename:true)',
'expected': '.right .rtl .bright .ultra { display:block; }',
'input': '/*rtl:ignore*/ .right .rtl .bright .ultra { display:block; }',
'reversable': false,
'options': { 'autoRename': true }
should: 'Should auto rename selectors having no directional decl. unless forced to ignore. (autoRename:true)',
expected: '.right .rtl .bright .ultra { display:block; }',
input: '/*rtl:ignore*/ .right .rtl .bright .ultra { display:block; }',
reversable: false,
options: { autoRename: true }
},
{
'should': 'Should auto rename selectors having no directional decl. unless forced to ignore. (autoRename:true, clean: false)',
'expected': '/*rtl:ignore*/ .right .rtl .bright .ultra { display:block; }',
'input': '/*rtl:ignore*/ .right .rtl .bright .ultra { display:block; }',
'reversable': false,
'options': { 'autoRename': true, 'clean': false }
should: 'Should auto rename selectors having no directional decl. unless forced to ignore. (autoRename:true, clean: false)',
expected: '/*rtl:ignore*/ .right .rtl .bright .ultra { display:block; }',
input: '/*rtl:ignore*/ .right .rtl .bright .ultra { display:block; }',
reversable: false,
options: { autoRename: true, clean: false }
},
{
'should': 'Should auto rename selectors having no directional decl. unless forced to ignore. (autoRename:true, !important comment)',
'expected': '.right .rtl .bright .ultra { display:block; }',
'input': '/*!rtl:ignore*/ .right .rtl .bright .ultra { display:block; }',
'reversable': false,
'options': { 'autoRename': true }
should: 'Should auto rename selectors having no directional decl. unless forced to ignore. (autoRename:true, !important comment)',
expected: '.right .rtl .bright .ultra { display:block; }',
input: '/*!rtl:ignore*/ .right .rtl .bright .ultra { display:block; }',
reversable: false,
options: { autoRename: true }
},
{
'should': 'Should auto rename selectors having no directional decl. unless forced to ignore. (autoRename:true, clean:false, !important comment)',
'expected': '/*!rtl:ignore*/ .right .rtl .bright .ultra { display:block; }',
'input': '/*!rtl:ignore*/ .right .rtl .bright .ultra { display:block; }',
'reversable': false,
'options': { 'autoRename': true, 'clean': false }
should: 'Should auto rename selectors having no directional decl. unless forced to ignore. (autoRename:true, clean:false, !important comment)',
expected: '/*!rtl:ignore*/ .right .rtl .bright .ultra { display:block; }',
input: '/*!rtl:ignore*/ .right .rtl .bright .ultra { display:block; }',
reversable: false,
options: { autoRename: true, clean: false }
},
{
'should': 'Should auto rename selectors having no directional decl. unless forced to ignore. (autoRename:true,greedy)',
'expected': '.right .rtl .bright .ultra { display:block; }',
'input': '/*rtl:ignore*/ .right .rtl .bright .ultra { display:block; }',
'reversable': false,
'options': { 'autoRename': true, 'greedy': true }
should: 'Should auto rename selectors having no directional decl. unless forced to ignore. (autoRename:true,greedy)',
expected: '.right .rtl .bright .ultra { display:block; }',
input: '/*rtl:ignore*/ .right .rtl .bright .ultra { display:block; }',
reversable: false,
options: { autoRename: true, greedy: true }
},
{
'should': 'Should auto rename selectors having no directional decl. unless forced to ignore. (autoRename:true, greedy, !important comment)',
'expected': '.right .rtl .bright .ultra { display:block; }',
'input': '/*!rtl:ignore*/ .right .rtl .bright .ultra { display:block; }',
'reversable': false,
'options': { 'autoRename': true, 'greedy': true }
should: 'Should auto rename selectors having no directional decl. unless forced to ignore. (autoRename:true, greedy, !important comment)',
expected: '.right .rtl .bright .ultra { display:block; }',
input: '/*!rtl:ignore*/ .right .rtl .bright .ultra { display:block; }',
reversable: false,
options: { autoRename: true, greedy: true }
},
{
'should': 'Should rename selectors when forced. (default)',
'expected': '.left .ltr .bright .ultra { display:block; }',
'input': '/*rtl:rename*/.right .rtl .bright .ultra { display:block; }',
'reversable': false
should: 'Should rename selectors when forced. (default)',
expected: '.left .ltr .bright .ultra { display:block; }',
input: '/*rtl:rename*/.right .rtl .bright .ultra { display:block; }',
reversable: false
},
{
'should': 'Should rename selectors when forced. (clean:false)',
'expected': '/*rtl:rename*/.left .ltr .bright .ultra { display:block; left:0;}',
'input': '/*rtl:rename*/.right .rtl .bright .ultra { display:block; right:0;}',
'reversable': false,
'options': { 'clean': false }
should: 'Should rename selectors when forced. (clean:false)',
expected: '/*rtl:rename*/.left .ltr .bright .ultra { display:block; left:0;}',
input: '/*rtl:rename*/.right .rtl .bright .ultra { display:block; right:0;}',
reversable: false,
options: { clean: false }
},
{
'should': 'Should rename selectors when forced. (!important comment)',
'expected': '.left .ltr .bright .ultra { display:block; left:0; }',
'input': '/*!rtl:rename*/.right .rtl .bright .ultra { display:block; right:0; }',
'reversable': false
should: 'Should rename selectors when forced. (!important comment)',
expected: '.left .ltr .bright .ultra { display:block; left:0; }',
input: '/*!rtl:rename*/.right .rtl .bright .ultra { display:block; right:0; }',
reversable: false
},
{
'should': 'Should rename selectors when forced. (clean:false, !important comment)',
'expected': '/*!rtl:rename*/.left .ltr .bright .ultra { display:block; left:0; }',
'input': '/*!rtl:rename*/.right .rtl .bright .ultra { display:block; right:0; }',
'reversable': false,
'options': { 'clean': false }
should: 'Should rename selectors when forced. (clean:false, !important comment)',
expected: '/*!rtl:rename*/.left .ltr .bright .ultra { display:block; left:0; }',
input: '/*!rtl:rename*/.right .rtl .bright .ultra { display:block; right:0; }',
reversable: false,
options: { clean: false }
},
{
'should': 'Should rename selectors when forced. (greedy)',
'expected': '.left .ltr .bleft .urtla { display:block; left:0; }',
'input': '/*rtl:rename*/.right .rtl .bright .ultra { display:block; right:0; }',
'reversable': false,
'options': { 'greedy': true }
should: 'Should rename selectors when forced. (greedy)',
expected: '.left .ltr .bleft .urtla { display:block; left:0; }',
input: '/*rtl:rename*/.right .rtl .bright .ultra { display:block; right:0; }',
reversable: false,
options: { greedy: true }
},
{
'should': 'Should rename selectors when forced. (greedy, !important comment)',
'expected': '.left .ltr .bleft .urtla { display:block; left:0; }',
'input': '/*!rtl:rename*/.right .rtl .bright .ultra { display:block; right:0; }',
'reversable': false,
'options': { 'greedy': true }
should: 'Should rename selectors when forced. (greedy, !important comment)',
expected: '.left .ltr .bleft .urtla { display:block; left:0; }',
input: '/*!rtl:rename*/.right .rtl .bright .ultra { display:block; right:0; }',
reversable: false,
options: { greedy: true }
},
{
'should': 'Should prepend value. (default)',
'expected': 'div { font-family: "Droid Arabic Kufi", "Droid Sans", Tahoma; }',
'input': 'div { font-family: "Droid Sans", Tahoma/*rtl:prepend:"Droid Arabic Kufi", */; }',
'reversable': false
should: 'Should prepend value. (default)',
expected: 'div { font-family: "Droid Arabic Kufi", "Droid Sans", Tahoma; }',
input: 'div { font-family: "Droid Sans", Tahoma/*rtl:prepend:"Droid Arabic Kufi", */; }',
reversable: false
},
{
'should': 'Should prepend value. (clean:false)',
'expected': 'div { font-family: "Droid Arabic Kufi", "Droid Sans", Tahoma/*rtl:prepend:"Droid Arabic Kufi", */; }',
'input': 'div { font-family: "Droid Sans", Tahoma/*rtl:prepend:"Droid Arabic Kufi", */; }',
'reversable': false,
'options': { 'clean': false }
should: 'Should prepend value. (clean:false)',
expected: 'div { font-family: "Droid Arabic Kufi", "Droid Sans", Tahoma/*rtl:prepend:"Droid Arabic Kufi", */; }',
input: 'div { font-family: "Droid Sans", Tahoma/*rtl:prepend:"Droid Arabic Kufi", */; }',
reversable: false,
options: { clean: false }
},
{
'should': 'Should prepend value (!important comment)',
'expected': 'div { font-family: "Droid Arabic Kufi", "Droid Sans", Tahoma; }',
'input': 'div { font-family: "Droid Sans", Tahoma/*!rtl:prepend:"Droid Arabic Kufi", */; }',
'reversable': false
should: 'Should prepend value (!important comment)',
expected: 'div { font-family: "Droid Arabic Kufi", "Droid Sans", Tahoma; }',
input: 'div { font-family: "Droid Sans", Tahoma/*!rtl:prepend:"Droid Arabic Kufi", */; }',
reversable: false
},
{
'should': 'Should prepend value (clean:false, !important comment)',
'expected': 'div { font-family: "Droid Arabic Kufi", "Droid Sans", Tahoma/*!rtl:prepend:"Droid Arabic Kufi", */; }',
'input': 'div { font-family: "Droid Sans", Tahoma/*!rtl:prepend:"Droid Arabic Kufi", */; }',
'reversable': false,
'options': { 'clean': false }
should: 'Should prepend value (clean:false, !important comment)',
expected: 'div { font-family: "Droid Arabic Kufi", "Droid Sans", Tahoma/*!rtl:prepend:"Droid Arabic Kufi", */; }',
input: 'div { font-family: "Droid Sans", Tahoma/*!rtl:prepend:"Droid Arabic Kufi", */; }',
reversable: false,
options: { clean: false }
},
{
'should': 'Should replace value.',
'expected': 'div { font-family: "Droid Arabic Kufi"; }',
'input': 'div { font-family: "Droid Sans", Tahoma/*rtl:"Droid Arabic Kufi"*/; }',
'reversable': false
should: 'Should replace value.',
expected: 'div { font-family: "Droid Arabic Kufi"; }',
input: 'div { font-family: "Droid Sans", Tahoma/*rtl:"Droid Arabic Kufi"*/; }',
reversable: false
},
{
'should': 'Should replace value.(clean:false)',
'expected': 'div { font-family: "Droid Arabic Kufi"/*rtl:"Droid Arabic Kufi"*/; }',
'input': 'div { font-family: "Droid Sans", Tahoma/*rtl:"Droid Arabic Kufi"*/; }',
'reversable': false,
'options': { 'clean': false }
should: 'Should replace value.(clean:false)',
expected: 'div { font-family: "Droid Arabic Kufi"/*rtl:"Droid Arabic Kufi"*/; }',
input: 'div { font-family: "Droid Sans", Tahoma/*rtl:"Droid Arabic Kufi"*/; }',
reversable: false,
options: { clean: false }
},
{
'should': 'Should replace value. (!important comment)',
'expected': 'div { font-family: "Droid Arabic Kufi"; }',
'input': 'div { font-family: "Droid Sans", Tahoma/*!rtl:"Droid Arabic Kufi"*/; }',
'reversable': false
should: 'Should replace value. (!important comment)',
expected: 'div { font-family: "Droid Arabic Kufi"; }',
input: 'div { font-family: "Droid Sans", Tahoma/*!rtl:"Droid Arabic Kufi"*/; }',
reversable: false
},
{
'should': 'Should replace value. (clean:false, !important comment)',
'expected': 'div { font-family: "Droid Arabic Kufi"/*!rtl:"Droid Arabic Kufi"*/; }',
'input': 'div { font-family: "Droid Sans", Tahoma/*!rtl:"Droid Arabic Kufi"*/; }',
'reversable': false,
'options': { 'clean': false }
should: 'Should replace value. (clean:false, !important comment)',
expected: 'div { font-family: "Droid Arabic Kufi"/*!rtl:"Droid Arabic Kufi"*/; }',
input: 'div { font-family: "Droid Sans", Tahoma/*!rtl:"Droid Arabic Kufi"*/; }',
reversable: false,
options: { clean: false }
},
{
'should': 'Should append value. (default)',
'expected': 'div { font-family: "Droid Sans", Tahoma, "Droid Arabic Kufi"; }',
'input': 'div { font-family: "Droid Sans", Tahoma/*rtl:append:, "Droid Arabic Kufi"*/; }',
'reversable': false
should: 'Should append value. (default)',
expected: 'div { font-family: "Droid Sans", Tahoma, "Droid Arabic Kufi"; }',
input: 'div { font-family: "Droid Sans", Tahoma/*rtl:append:, "Droid Arabic Kufi"*/; }',
reversable: false
},
{
'should': 'Should append value. (clean:false)',
'expected': 'div { font-family: "Droid Sans", Tahoma/*rtl:append:, "Droid Arabic Kufi"*/, "Droid Arabic Kufi"; }',
'input': 'div { font-family: "Droid Sans", Tahoma/*rtl:append:, "Droid Arabic Kufi"*/; }',
'reversable': false,
'options': { 'clean': false }
should: 'Should append value. (clean:false)',
expected: 'div { font-family: "Droid Sans", Tahoma/*rtl:append:, "Droid Arabic Kufi"*/, "Droid Arabic Kufi"; }',
input: 'div { font-family: "Droid Sans", Tahoma/*rtl:append:, "Droid Arabic Kufi"*/; }',
reversable: false,
options: { clean: false }
},
{
'should': 'Should append value. (!important comment)',
'expected': 'div { font-family: "Droid Sans", Tahoma, "Droid Arabic Kufi"; }',
'input': 'div { font-family: "Droid Sans", Tahoma/*!rtl:append:, "Droid Arabic Kufi"*/; }',
'reversable': false
should: 'Should append value. (!important comment)',
expected: 'div { font-family: "Droid Sans", Tahoma, "Droid Arabic Kufi"; }',
input: 'div { font-family: "Droid Sans", Tahoma/*!rtl:append:, "Droid Arabic Kufi"*/; }',
reversable: false
},
{
'should': 'Should append value. (clean:false, !important comment)',
'expected': 'div { font-family: "Droid Sans", Tahoma/*!rtl:append:, "Droid Arabic Kufi"*/, "Droid Arabic Kufi"; }',
'input': 'div { font-family: "Droid Sans", Tahoma/*!rtl:append:, "Droid Arabic Kufi"*/; }',
'reversable': false,
'options': { 'clean': false }
should: 'Should append value. (clean:false, !important comment)',
expected: 'div { font-family: "Droid Sans", Tahoma/*!rtl:append:, "Droid Arabic Kufi"*/, "Droid Arabic Kufi"; }',
input: 'div { font-family: "Droid Sans", Tahoma/*!rtl:append:, "Droid Arabic Kufi"*/; }',
reversable: false,
options: { clean: false }
},
{
'should': 'Should insert value. (default)',
'expected': 'div { font-family: "Droid Sans", "Droid Arabic Kufi", Tahoma; }',
'input': 'div { font-family: "Droid Sans"/*rtl:insert:, "Droid Arabic Kufi"*/, Tahoma; }',
'reversable': false
should: 'Should insert value. (default)',
expected: 'div { font-family: "Droid Sans", "Droid Arabic Kufi", Tahoma; }',
input: 'div { font-family: "Droid Sans"/*rtl:insert:, "Droid Arabic Kufi"*/, Tahoma; }',
reversable: false
},
{
'should': 'Should insert value. (clean:false)',
'expected': 'div { font-family: "Droid Sans", "Droid Arabic Kufi"/*rtl:insert:, "Droid Arabic Kufi"*/, Tahoma; }',
'input': 'div { font-family: "Droid Sans"/*rtl:insert:, "Droid Arabic Kufi"*/, Tahoma; }',
'reversable': false,
'options': { 'clean': false }
should: 'Should insert value. (clean:false)',
expected: 'div { font-family: "Droid Sans", "Droid Arabic Kufi"/*rtl:insert:, "Droid Arabic Kufi"*/, Tahoma; }',
input: 'div { font-family: "Droid Sans"/*rtl:insert:, "Droid Arabic Kufi"*/, Tahoma; }',
reversable: false,
options: { clean: false }
},
{
'should': 'Should insert value. (!important comment)',
'expected': 'div { font-family: "Droid Sans", "Droid Arabic Kufi", Tahoma; }',
'input': 'div { font-family: "Droid Sans"/*!rtl:insert:, "Droid Arabic Kufi"*/, Tahoma; }',
'reversable': false
should: 'Should insert value. (!important comment)',
expected: 'div { font-family: "Droid Sans", "Droid Arabic Kufi", Tahoma; }',
input: 'div { font-family: "Droid Sans"/*!rtl:insert:, "Droid Arabic Kufi"*/, Tahoma; }',
reversable: false
},
{
'should': 'Should insert value. (clean:false, !important comment)',
'expected': 'div { font-family: "Droid Sans", "Droid Arabic Kufi"/*!rtl:insert:, "Droid Arabic Kufi"*/, Tahoma; }',
'input': 'div { font-family: "Droid Sans"/*!rtl:insert:, "Droid Arabic Kufi"*/, Tahoma; }',
'reversable': false,
'options': { 'clean': false }
should: 'Should insert value. (clean:false, !important comment)',
expected: 'div { font-family: "Droid Sans", "Droid Arabic Kufi"/*!rtl:insert:, "Droid Arabic Kufi"*/, Tahoma; }',
input: 'div { font-family: "Droid Sans"/*!rtl:insert:, "Droid Arabic Kufi"*/, Tahoma; }',
reversable: false,
options: { clean: false }
},
{
'should': 'Should ignore flipping - rule level (default)',
'expected': 'div { left:10px; text-align:right;}',
'input': '/*rtl:ignore*/div { left:10px; text-align:right;}',
'reversable': false
should: 'Should ignore flipping - rule level (default)',
expected: 'div { left:10px; text-align:right;}',
input: '/*rtl:ignore*/div { left:10px; text-align:right;}',
reversable: false
},
{
'should': 'Should ignore flipping - rule level (clean:false)',
'expected': '/*rtl:ignore*/div { left:10px; text-align:right;}',
'input': '/*rtl:ignore*/div { left:10px; text-align:right;}',
'reversable': false,
'options': { 'clean': false }
should: 'Should ignore flipping - rule level (clean:false)',
expected: '/*rtl:ignore*/div { left:10px; text-align:right;}',
input: '/*rtl:ignore*/div { left:10px; text-align:right;}',
reversable: false,
options: { clean: false }
},
{
'should': 'Should ignore flipping - rule level (default, !important comment)',
'expected': 'div { left:10px; text-align:right;}',
'input': '/*!rtl:ignore*/div { left:10px; text-align:right;}',
'reversable': false
should: 'Should ignore flipping - rule level (default, !important comment)',
expected: 'div { left:10px; text-align:right;}',
input: '/*!rtl:ignore*/div { left:10px; text-align:right;}',
reversable: false
},
{
'should': 'Should ignore flipping - rule level (clean:false , !important comment)',
'expected': '/*!rtl:ignore*/div { left:10px; text-align:right;}',
'input': '/*!rtl:ignore*/div { left:10px; text-align:right;}',
'reversable': false,
'options': { 'clean': false }
should: 'Should ignore flipping - rule level (clean:false , !important comment)',
expected: '/*!rtl:ignore*/div { left:10px; text-align:right;}',
input: '/*!rtl:ignore*/div { left:10px; text-align:right;}',
reversable: false,
options: { clean: false }
},
{
'should': 'Should ignore flipping - decl. level (default)',
'expected': 'div { left:10px;text-align:left;}',
'input': 'div { left:10px/*rtl:ignore*/;text-align:right;}',
'reversable': false
should: 'Should ignore flipping - decl. level (default)',
expected: 'div { left:10px;text-align:left;}',
input: 'div { left:10px/*rtl:ignore*/;text-align:right;}',
reversable: false
},
{
'should': 'Should ignore flipping - decl. level (clean:false)',
'expected': 'div { left:10px/*rtl:ignore*/;text-align:left;}',
'input': 'div { left:10px/*rtl:ignore*/;text-align:right;}',
'reversable': false,
'options': { 'clean': false }
should: 'Should ignore flipping - decl. level (clean:false)',
expected: 'div { left:10px/*rtl:ignore*/;text-align:left;}',
input: 'div { left:10px/*rtl:ignore*/;text-align:right;}',
reversable: false,
options: { clean: false }
},
{
'should': 'Should ignore flipping - decl. level (default, !important comment)',
'expected': 'div { left:10px;text-align:left;}',
'input': 'div { left:10px/*!rtl:ignore*/;text-align:right;}',
'reversable': false
should: 'Should ignore flipping - decl. level (default, !important comment)',
expected: 'div { left:10px;text-align:left;}',
input: 'div { left:10px/*!rtl:ignore*/;text-align:right;}',
reversable: false
},
{
'should': 'Should ignore flipping - decl. level (clean:false, !important comment)',
'expected': 'div { left:10px/*!rtl:ignore*/;text-align:left;}',
'input': 'div { left:10px/*!rtl:ignore*/;text-align:right;}',
'options': { 'clean': false }
should: 'Should ignore flipping - decl. level (clean:false, !important comment)',
expected: 'div { left:10px/*!rtl:ignore*/;text-align:left;}',
input: 'div { left:10px/*!rtl:ignore*/;text-align:right;}',
options: { clean: false }
},
{
'should': 'Should add raw css rules',
'expected': 'div { left:10px;text-align:right;} a {display:block;}',
'input': '/*rtl:raw:div { left:10px;text-align:right;}*/ a {display:block;}',
'reversable': false
should: 'Should add raw css rules',
expected: 'div { left:10px;text-align:right;} a {display:block;}',
input: '/*rtl:raw:div { left:10px;text-align:right;}*/ a {display:block;}',
reversable: false
},
{
'should': 'Should add raw css declarations',
'expected': 'div { font-family: "Droid Kufi Arabic"; right:10px;text-align:left;}',
'input': 'div { /*rtl:raw: font-family: "Droid Kufi Arabic";*/ left:10px;text-align:right;}',
'reversable': false
should: 'Should add raw css declarations',
expected: 'div { font-family: "Droid Kufi Arabic"; right:10px;text-align:left;}',
input: 'div { /*rtl:raw: font-family: "Droid Kufi Arabic";*/ left:10px;text-align:right;}',
reversable: false
},
{
'should': 'Should add raw css (clean:false)',
'expected': 'div { left:10px;text-align:right;} /*rtl:raw:div { left:10px;text-align:right;}*/ a {display:block;}',
'input': '/*rtl:raw:div { left:10px;text-align:right;}*/ a {display:block;}',
'reversable': false,
'options': { 'clean': false }
should: 'Should add raw css (clean:false)',
expected: 'div { left:10px;text-align:right;} /*rtl:raw:div { left:10px;text-align:right;}*/ a {display:block;}',
input: '/*rtl:raw:div { left:10px;text-align:right;}*/ a {display:block;}',
reversable: false,
options: { clean: false }
},
{
'should': 'Should add raw css declarations (clean:false)',
'expected': 'div { font-family: "Droid Kufi Arabic"; /*rtl:raw: font-family: "Droid Kufi Arabic";*/ right:10px;text-align:left;}',
'input': 'div { /*rtl:raw: font-family: "Droid Kufi Arabic";*/ left:10px;text-align:right;}',
'reversable': false,
'options': { 'clean': false }
should: 'Should add raw css declarations (clean:false)',
expected: 'div { font-family: "Droid Kufi Arabic"; /*rtl:raw: font-family: "Droid Kufi Arabic";*/ right:10px;text-align:left;}',
input: 'div { /*rtl:raw: font-family: "Droid Kufi Arabic";*/ left:10px;text-align:right;}',
reversable: false,
options: { clean: false }
},
{
'should': 'Should support block-style',
'expected': ' div {left:10px; text-align:right;}',
'input': ' div {/*rtl:begin:ignore*/left:10px;/*rtl:end:ignore*/ text-align:left;}',
'reversable': false
should: 'Should support block-style',
expected: ' div {left:10px; text-align:right;}',
input: ' div {/*rtl:begin:ignore*/left:10px;/*rtl:end:ignore*/ text-align:left;}',
reversable: false
},
{
'should': 'Should support none block-style',
'expected': ' div {left:10px; text-align:left;}',
'input': ' /*rtl:ignore*/div {left:10px; text-align:left;}',
'reversable': false
should: 'Should support none block-style',
expected: ' div {left:10px; text-align:left;}',
input: ' /*rtl:ignore*/div {left:10px; text-align:left;}',
reversable: false
},
{
'should': 'Should remove rules (block-style)',
'expected': ' b{float:right;}',
'input': ' /*rtl:begin:remove*/div {left:10px; text-align:left;} a { display:block;} /*rtl:end:remove*/ b{float:left;}',
'reversable': false
should: 'Should remove rules (block-style)',
expected: ' b{float:right;}',
input: ' /*rtl:begin:remove*/div {left:10px; text-align:left;} a { display:block;} /*rtl:end:remove*/ b{float:left;}',
reversable: false
},
{
'should': 'Should remove rules',
'expected': ' a { display:block;} b{float:right;}',
'input': ' /*rtl:remove*/div {left:10px; text-align:left;} a { display:block;} b{float:left;}',
'reversable': false
should: 'Should remove rules',
expected: ' a { display:block;} b{float:right;}',
input: ' /*rtl:remove*/div {left:10px; text-align:left;} a { display:block;} b{float:left;}',
reversable: false
},
{
'should': 'Should remove declarations',
'expected': ' div { text-align:right;}',
'input': ' div {/*rtl:remove*/left:10px; text-align:left;}',
'reversable': false
should: 'Should remove declarations',
expected: ' div { text-align:right;}',
input: ' div {/*rtl:remove*/left:10px; text-align:left;}',
reversable: false
},
{
'should': 'Should remove declarations (block-style)',
'expected': ' div { display:inline;}',
'input': ' div {/*rtl:begin:remove*/left:10px; text-align:left;/*rtl:end:remove*/ display:inline;}',
'reversable': false
should: 'Should remove declarations (block-style)',
expected: ' div { display:inline;}',
input: ' div {/*rtl:begin:remove*/left:10px; text-align:left;/*rtl:end:remove*/ display:inline;}',
reversable: false
},
{
'should': 'Should override options',
'expected': '.right { display:inline;}',
'input': '/*rtl:options:{"autoRename":false}*/ .right { display:inline;}',
'reversable': false,
'options': { 'autoRename': true }
should: 'Should override options',
expected: '.right { display:inline;}',
input: '/*rtl:options:{"autoRename":false}*/ .right { display:inline;}',
reversable: false,
options: { autoRename: true }
},
{
'should': 'Should support nested options override',
'expected': '.right { display:inline;}.bleft { display:inline;}',
'input': '/*rtl:begin:options:{"autoRename":false}*/ .right { display:inline;} /*rtl:begin:options:{"autoRename":true, "greedy": true}*/.bright { display:inline;}/*rtl:end:options*//*rtl:end:options*/',
'reversable': false,
'options': { 'autoRename': true }
should: 'Should support nested options override',
expected: '.right { display:inline;}.bleft { display:inline;}',
input: '/*rtl:begin:options:{"autoRename":false}*/ .right { display:inline;} /*rtl:begin:options:{"autoRename":true, "greedy": true}*/.bright { display:inline;}/*rtl:end:options*//*rtl:end:options*/',
reversable: false,
options: { autoRename: true }
},
{
'should': 'Should ignore the target node (decl)',
'expected': `
should: 'Should ignore the target node (decl)',
expected: `
.code {

@@ -325,3 +325,3 @@ direction:ltr;

`,
'input': `
input: `
.code {

@@ -338,7 +338,7 @@ /*rtl:ignore*/

`,
'reversable': false
reversable: false
},
{
'should': 'Should ignore the target node (rule)',
'expected': `
should: 'Should ignore the target node (rule)',
expected: `
.example-1 {

@@ -357,3 +357,3 @@ text-align:right;

`,
'input': `
input: `
/*rtl:ignore*/

@@ -374,7 +374,7 @@ .example-1 {

`,
'reversable': false
reversable: false
},
{
'should': 'Should ignore the target node (atrule)',
'expected': `
should: 'Should ignore the target node (atrule)',
expected: `
@media screen and (max-width: 568px) {

@@ -394,3 +394,3 @@ .example {

`,
'input': `
input: `
/*rtl:ignore*/

@@ -411,28 +411,28 @@ @media screen and (max-width: 568px) {

`,
'reversable': false
reversable: false
},
{
'should': 'Should ignore white spaces before value directive prefix',
'expected': ' div { direction:ltr; text-align:right;}',
'input': ' div { direction:ltr/* rtl:ignore*/; text-align:left;}',
'reversable': false
should: 'Should ignore white spaces before value directive prefix',
expected: ' div { direction:ltr; text-align:right;}',
input: ' div { direction:ltr/* rtl:ignore*/; text-align:left;}',
reversable: false
},
{
'should': 'Should ignore white spaces before value directive perfix (!important comment)',
'expected': ' div { direction:ltr; text-align:right;}',
'input': ' div { direction:ltr/* !rtl:ignore*/; text-align:left;}',
'reversable': false
should: 'Should ignore white spaces before value directive perfix (!important comment)',
expected: ' div { direction:ltr; text-align:right;}',
input: ' div { direction:ltr/* !rtl:ignore*/; text-align:left;}',
reversable: false
},
{
'should': 'Should ignore white spaces before directive prefix (block-style) ',
'expected': ' div { direction:ltr; text-align:right;}',
'input': ' div {/* rtl:begin:ignore*/ direction:ltr;/* rtl:end:ignore*/ text-align:left;}',
'reversable': false
should: 'Should ignore white spaces before directive prefix (block-style) ',
expected: ' div { direction:ltr; text-align:right;}',
input: ' div {/* rtl:begin:ignore*/ direction:ltr;/* rtl:end:ignore*/ text-align:left;}',
reversable: false
},
{
'should': 'Should ignore white spaces before directive prefix (block-style, !important comment) ',
'expected': ' div { direction:ltr; text-align:right;}',
'input': ' div {/* !rtl:begin:ignore*/ direction:ltr;/* ! rtl:end:ignore*/ text-align:left;}',
'reversable': false
should: 'Should ignore white spaces before directive prefix (block-style, !important comment) ',
expected: ' div { direction:ltr; text-align:right;}',
input: ' div {/* !rtl:begin:ignore*/ direction:ltr;/* ! rtl:end:ignore*/ text-align:left;}',
reversable: false
}
]

28

test/data/rtlcss-hooks.js

@@ -1,13 +0,13 @@

var pkg = require('../../package.json')
const pkg = require('../../package.json')
module.exports = [
{
'should': 'Should support hooks (pre)',
'expected': '.float-left { float: left; }',
'input': '.float-right { float: right; }',
'reversable': true,
'hooks': {
should: 'Should support hooks (pre)',
expected: '.float-left { float: left; }',
input: '.float-right { float: right; }',
reversable: true,
hooks: {
pre: function (css, postcss) {
css.insertBefore(css.nodes[0], postcss.comment({text: 'rtl:begin:rename'}))
css.insertAfter(css.nodes[css.nodes.length - 1], postcss.comment({text: 'rtl:end:rename'}))
css.insertBefore(css.nodes[0], postcss.comment({ text: 'rtl:begin:rename' }))
css.insertAfter(css.nodes[css.nodes.length - 1], postcss.comment({ text: 'rtl:end:rename' }))
}

@@ -17,9 +17,9 @@ }

{
'should': 'Should support hooks (post)',
'expected': `/* Generated by RTLCSS v${pkg.version} */\n.float-right { float: left; }`,
'input': '.float-right { float: right; }',
'reversable': false,
'hooks': {
should: 'Should support hooks (post)',
expected: `/* Generated by RTLCSS v${pkg.version} */\n.float-right { float: left; }`,
input: '.float-right { float: right; }',
reversable: false,
hooks: {
post: function (css, postcss) {
css.insertBefore(css.nodes[0], postcss.comment({text: `Generated by RTLCSS v${pkg.version}`}))
css.insertBefore(css.nodes[0], postcss.comment({ text: `Generated by RTLCSS v${pkg.version}` }))
}

@@ -26,0 +26,0 @@ }

200

test/data/rtlcss-options.js
module.exports = [
{
'should': 'Should not rename selectors unless a pair exits (autoRename:true,autoRenameStrict:true )',
'expected': '.right .rtl .bright .ultra { display:block; }',
'input': '.right .rtl .bright .ultra { display:block; }',
'reversable': true,
'options': { 'autoRename': true, 'autoRenameStrict': true }
should: 'Should not rename selectors unless a pair exits (autoRename:true,autoRenameStrict:true )',
expected: '.right .rtl .bright .ultra { display:block; }',
input: '.right .rtl .bright .ultra { display:block; }',
reversable: true,
options: { autoRename: true, autoRenameStrict: true }
},
{
'should': 'Should rename selectors only if a pair exits (autoRename:true,autoRenameStrict:true )',
'expected': '.left { display:block; } .right { display:none; }',
'input': '.right { display:block; } .left { display:none; }',
'reversable': true,
'options': { 'autoRename': true, 'autoRenameStrict': true }
should: 'Should rename selectors only if a pair exits (autoRename:true,autoRenameStrict:true )',
expected: '.left { display:block; } .right { display:none; }',
input: '.right { display:block; } .left { display:none; }',
reversable: true,
options: { autoRename: true, autoRenameStrict: true }
},
{
'should': 'Should not rename selectors having directional decl. (default)',
'expected': '.right .rtl .bright .ultra { display:block; right:0; }',
'input': '.right .rtl .bright .ultra { display:block; left:0; }',
'reversable': true
should: 'Should not rename selectors having directional decl. (default)',
expected: '.right .rtl .bright .ultra { display:block; right:0; }',
input: '.right .rtl .bright .ultra { display:block; left:0; }',
reversable: true
},
{
'should': 'Should not auto rename selectors having no directional decl. (default)',
'expected': '.right .rtl .bright .ultra { display:block; }',
'input': '.right .rtl .bright .ultra { display:block; }',
'reversable': true
should: 'Should not auto rename selectors having no directional decl. (default)',
expected: '.right .rtl .bright .ultra { display:block; }',
input: '.right .rtl .bright .ultra { display:block; }',
reversable: true
},
{
'should': 'Should not auto rename selectors having no directional decl. (greedy)',
'expected': '.right .rtl .bright .ultra { display:block; }',
'input': '.right .rtl .bright .ultra { display:block; }',
'reversable': true,
'options': { 'greedy': true }
should: 'Should not auto rename selectors having no directional decl. (greedy)',
expected: '.right .rtl .bright .ultra { display:block; }',
input: '.right .rtl .bright .ultra { display:block; }',
reversable: true,
options: { greedy: true }
},
{
'should': 'Should auto rename selectors having no directional decl. (autoRename:true)',
'expected': '.left .ltr .bright .ultra { display:block; }',
'input': '.right .rtl .bright .ultra { display:block; }',
'reversable': true,
'options': { 'autoRename': true }
should: 'Should auto rename selectors having no directional decl. (autoRename:true)',
expected: '.left .ltr .bright .ultra { display:block; }',
input: '.right .rtl .bright .ultra { display:block; }',
reversable: true,
options: { autoRename: true }
},
{
'should': 'Should auto rename selectors having no directional decl. (autoRename:true,greedy)',
'expected': '.left .ltr .bleft .urtla { display:block; }',
'input': '.right .rtl .bright .ultra { display:block; }',
'reversable': true,
'options': { 'autoRename': true, 'greedy': true }
should: 'Should auto rename selectors having no directional decl. (autoRename:true,greedy)',
expected: '.left .ltr .bleft .urtla { display:block; }',
input: '.right .rtl .bright .ultra { display:block; }',
reversable: true,
options: { autoRename: true, greedy: true }
},
{
'should': 'Should not auto rename when rules are flipped via directives (autoRename:true)',
'expected': 'div.right { display:block; font-family: "Droid Sans", Tahoma, "Droid Arabic Kufi"; }',
'input': 'div.right { display:block; font-family: "Droid Sans", Tahoma/*!rtl:append:, "Droid Arabic Kufi"*/; }',
'reversable': false,
'options': { 'autoRename': true }
should: 'Should not auto rename when rules are flipped via directives (autoRename:true)',
expected: 'div.right { display:block; font-family: "Droid Sans", Tahoma, "Droid Arabic Kufi"; }',
input: 'div.right { display:block; font-family: "Droid Sans", Tahoma/*!rtl:append:, "Droid Arabic Kufi"*/; }',
reversable: false,
options: { autoRename: true }
},
{
'should': 'Should not preserve processing directive. (default)',
'expected': 'div { left:0; }',
'input': '/*rtl:ignore*/div { left:0; }',
'reversable': false
should: 'Should not preserve processing directive. (default)',
expected: 'div { left:0; }',
input: '/*rtl:ignore*/div { left:0; }',
reversable: false
},
{
'should': 'Should preserve processing directive. (clean:false)',
'expected': '/*rtl:ignore*/div { left:0; }',
'input': '/*rtl:ignore*/div { left:0; }',
'reversable': false,
'options': { 'clean': false }
should: 'Should preserve processing directive. (clean:false)',
expected: '/*rtl:ignore*/div { left:0; }',
input: '/*rtl:ignore*/div { left:0; }',
reversable: false,
options: { clean: false }
},
{
'should': 'Should not process string map in url (default)',
'expected': 'div { background-image: url(ltr/left.png); right:0; }',
'input': 'div { background-image: url(ltr/left.png); left:0; }',
'reversable': true
should: 'Should not process string map in url (default)',
expected: 'div { background-image: url(ltr/left.png); right:0; }',
input: 'div { background-image: url(ltr/left.png); left:0; }',
reversable: true
},
{
'should': 'Should process urls (processUrls:true)',
'expected': 'div { background-image: url(rtl/right.png); right:0; }',
'input': 'div { background-image: url(ltr/left.png); left:0; }',
'reversable': true,
'options': { 'processUrls': true }
should: 'Should process urls (processUrls:true)',
expected: 'div { background-image: url(rtl/right.png); right:0; }',
input: 'div { background-image: url(ltr/left.png); left:0; }',
reversable: true,
options: { processUrls: true }
},
{
'should': 'Should process urls in declarations (processUrls:{decl:true})',
'expected': 'div { background-image: url(rtl/right.png); right:0; }',
'input': 'div { background-image: url(ltr/left.png); left:0; }',
'reversable': true,
'options': { 'processUrls': { 'decl': true } }
should: 'Should process urls in declarations (processUrls:{decl:true})',
expected: 'div { background-image: url(rtl/right.png); right:0; }',
input: 'div { background-image: url(ltr/left.png); left:0; }',
reversable: true,
options: { processUrls: { decl: true } }
},
{
'should': 'Should process @import url (processUrls:true)',
'expected': 'div{display:none;} @import url("rtl/right.css");',
'input': 'div{display:none;} @import url("ltr/left.css");',
'reversable': true,
'options': { 'processUrls': true }
should: 'Should process @import url (processUrls:true)',
expected: 'div{display:none;} @import url("rtl/right.css");',
input: 'div{display:none;} @import url("ltr/left.css");',
reversable: true,
options: { processUrls: true }
},
{
'should': 'Should process url in atrule (processUrls:{atrule:true})',
'expected': 'div{display:none;} @import url("rtl/right.css");',
'input': 'div{display:none;} @import url("ltr/left.css");',
'reversable': true,
'options': { 'processUrls': { 'atrule': true } }
should: 'Should process url in atrule (processUrls:{atrule:true})',
expected: 'div{display:none;} @import url("rtl/right.css");',
input: 'div{display:none;} @import url("ltr/left.css");',
reversable: true,
options: { processUrls: { atrule: true } }
},
{
'should': 'Should respect word boundaries when processing @import url (processUrls:true,greedy:false)',
'expected': 'div{display:none;} @import url("ultr/bright.css");',
'input': 'div{display:none;} @import url("ultr/bright.css");',
'reversable': true,
'options': { 'processUrls': true, 'greedy': false }
should: 'Should respect word boundaries when processing @import url (processUrls:true,greedy:false)',
expected: 'div{display:none;} @import url("ultr/bright.css");',
input: 'div{display:none;} @import url("ultr/bright.css");',
reversable: true,
options: { processUrls: true, greedy: false }
},
{
'should': 'Should not respect word boundaries when processing @import url (processUrls:true,greedy:true)',
'expected': 'div{display:none;} @import url("urtla/bleft.css");',
'input': 'div{display:none;} @import url("ultra/bright.css");',
'reversable': true,
'options': { 'processUrls': true, 'greedy': true }
should: 'Should not respect word boundaries when processing @import url (processUrls:true,greedy:true)',
expected: 'div{display:none;} @import url("urtla/bleft.css");',
input: 'div{display:none;} @import url("ultra/bright.css");',
reversable: true,
options: { processUrls: true, greedy: true }
},
{
'should': 'Should preserve comments inside declarations',
'expected': 'div { border-radius: 40.25px 10.5px /*comment*/ 10.75px 40.3px; }',
'input': 'div { border-radius: 10.5px 40.25px /*comment*/ 40.3px 10.75px; }',
'reversable': true
should: 'Should preserve comments inside declarations',
expected: 'div { border-radius: 40.25px 10.5px /*comment*/ 10.75px 40.3px; }',
input: 'div { border-radius: 10.5px 40.25px /*comment*/ 40.3px 10.75px; }',
reversable: true
},
{
'should': 'Should flip background-position when expressed in units (useCalc:true)',
'expected': 'div { background-position: calc(100% - 10px) 0; transform-origin:calc(100% - 0.5rem) 0; }',
'input': 'div { background-position: 10px 0; transform-origin:0.5rem 0; }',
'reversable': false,
'options': { 'useCalc': true }
should: 'Should flip background-position when expressed in units (useCalc:true)',
expected: 'div { background-position: calc(100% - 10px) 0; transform-origin:calc(100% - 0.5rem) 0; }',
input: 'div { background-position: 10px 0; transform-origin:0.5rem 0; }',
reversable: false,
options: { useCalc: true }
},
{
'should': 'Should flip background-position-x when expressed in units (useCalc:true)',
'expected': 'div { background-position-x: calc(100% - 10px); }',
'input': 'div { background-position-x: 10px; }',
'reversable': false,
'options': { 'useCalc': true }
should: 'Should flip background-position-x when expressed in units (useCalc:true)',
expected: 'div { background-position-x: calc(100% - 10px); }',
input: 'div { background-position-x: 10px; }',
reversable: false,
options: { useCalc: true }
},
{
'should': 'Should flip transform-origin when expressed in units (useCalc:true)',
'expected': 'div { transform-origin:calc(100% - 0.5rem) 2rem; }',
'input': 'div { transform-origin:0.5rem 2rem; }',
'reversable': false,
'options': { 'useCalc': true }
should: 'Should flip transform-origin when expressed in units (useCalc:true)',
expected: 'div { transform-origin:calc(100% - 0.5rem) 2rem; }',
input: 'div { transform-origin:0.5rem 2rem; }',
reversable: false,
options: { useCalc: true }
}
]

50

test/data/rtlcss-plugins.js
module.exports = [
{
'should': 'Should support plugins',
'expected': 'div:before { content: "ABC";} div:after { content: "B";}',
'input': 'div:before { content: "A";} div:after { content: "B";}',
'reversable': true,
'plugins': [
should: 'Should support plugins',
expected: 'div:before { content: "ABC";} div:after { content: "B";}',
input: 'div:before { content: "A";} div:after { content: "B";}',
reversable: true,
plugins: [
{
'name': 'test',
'directives': {
'control': {},
'value': []
name: 'test',
directives: {
control: {},
value: []
},
'processors': [
processors: [
{
'name': 'content',
'expr': /content/im,
'action': function (prop, value, cxt) {
name: 'content',
expr: /content/im,
action: function (prop, value, cxt) {
if (value === '"A"') {
return { 'prop': prop, 'value': '"ABC"' }
return { prop, value: '"ABC"' }
} else if (value === '"ABC"') {
return { 'prop': prop, 'value': '"A"' }
return { prop, value: '"A"' }
}
return { 'prop': prop, 'value': value }
return { prop, value: value }
}

@@ -32,13 +32,13 @@ }

{
'should': 'Should allow overriding default plugin',
'expected': 'div { text-align:right;}',
'input': 'div { text-align:right;}',
'plugins': [
should: 'Should allow overriding default plugin',
expected: 'div { text-align:right;}',
input: 'div { text-align:right;}',
plugins: [
{
'name': 'rtlcss',
'directives': {
'control': {},
'value': []
name: 'rtlcss',
directives: {
control: {},
value: []
},
'processors': []
processors: []
}

@@ -45,0 +45,0 @@ ]

138

test/data/rtlcss-stringMap.js
module.exports = [
{
'should': 'Should rename "left", "Left", "LEFT" (autoRename:true). ',
'expected': 'div.right, div.Right, div.RIGHT, div.respectLeft { width:10px;}',
'input': 'div.left, div.Left, div.LEFT, div.respectLeft { width:10px;}',
'reversable': true,
'options': { 'autoRename': true }
should: 'Should rename "left", "Left", "LEFT" (autoRename:true). ',
expected: 'div.right, div.Right, div.RIGHT, div.respectLeft { width:10px;}',
input: 'div.left, div.Left, div.LEFT, div.respectLeft { width:10px;}',
reversable: true,
options: { autoRename: true }
},
{
'should': 'Should rename "left", "Left", "LEFT" (autoRename:true, greedy). ',
'expected': 'div.right, div.Right, div.RIGHT, div.respectRight { width:10px;}',
'input': 'div.left, div.Left, div.LEFT, div.respectLeft { width:10px;}',
'reversable': true,
'options': {
'autoRename': true,
'greedy': true
should: 'Should rename "left", "Left", "LEFT" (autoRename:true, greedy). ',
expected: 'div.right, div.Right, div.RIGHT, div.respectRight { width:10px;}',
input: 'div.left, div.Left, div.LEFT, div.respectLeft { width:10px;}',
reversable: true,
options: {
autoRename: true,
greedy: true
}
},
{
'should': 'Should rename "ltr", "Ltr", "LTR" (autoRename:true). ',
'expected': 'div.rtl, div.Rtl, div.RTL, div.Ultra { width:10px;}',
'input': 'div.ltr, div.Ltr, div.LTR, div.Ultra { width:10px;}',
'reversable': true,
'options': { 'autoRename': true }
should: 'Should rename "ltr", "Ltr", "LTR" (autoRename:true). ',
expected: 'div.rtl, div.Rtl, div.RTL, div.Ultra { width:10px;}',
input: 'div.ltr, div.Ltr, div.LTR, div.Ultra { width:10px;}',
reversable: true,
options: { autoRename: true }
},
{
'should': 'Should rename "ltr", "Ltr", "LTR" (autoRename:true, greedy). ',
'expected': 'div.rtl, div.Rtl, div.RTL, div.Urtla { width:10px;}',
'input': 'div.ltr, div.Ltr, div.LTR, div.Ultra { width:10px;}',
'reversable': true,
'options': {
'autoRename': true,
'greedy': true
should: 'Should rename "ltr", "Ltr", "LTR" (autoRename:true, greedy). ',
expected: 'div.rtl, div.Rtl, div.RTL, div.Urtla { width:10px;}',
input: 'div.ltr, div.Ltr, div.LTR, div.Ultra { width:10px;}',
reversable: true,
options: {
autoRename: true,
greedy: true
}
},
{
'should': 'Should rename "prev"/"next" (autoRename:true, custom stringMap - *)',
'expected': 'div.next, div.Right { width:10px;}',
'input': 'div.prev, div.Left { width:10px;}',
'reversable': true,
'options': { 'autoRename': true, 'stringMap': [{ 'search': 'prev', 'replace': 'next', 'options': { scope: '*' } }] }
should: 'Should rename "prev"/"next" (autoRename:true, custom stringMap - *)',
expected: 'div.next, div.Right { width:10px;}',
input: 'div.prev, div.Left { width:10px;}',
reversable: true,
options: { autoRename: true, stringMap: [{ search: 'prev', replace: 'next', options: { scope: '*' } }] }
},
{
'should': 'Should rename "prev"/"next" (autoRename:true, custom stringMap - selector)',
'expected': 'div.next, div.Right { width:10px;}',
'input': 'div.prev, div.Left { width:10px;}',
'reversable': true,
'options': { 'autoRename': true, 'stringMap': [{ 'search': 'prev', 'replace': 'next', 'options': { scope: 'selector' } }] }
should: 'Should rename "prev"/"next" (autoRename:true, custom stringMap - selector)',
expected: 'div.next, div.Right { width:10px;}',
input: 'div.prev, div.Left { width:10px;}',
reversable: true,
options: { autoRename: true, stringMap: [{ search: 'prev', replace: 'next', options: { scope: 'selector' } }] }
},
{
'should': 'Should not rename "prev"/"next" (autoRename:true, custom stringMap - url)',
'expected': 'div.prev, div.Right { width:10px;}',
'input': 'div.prev, div.Left { width:10px;}',
'reversable': true,
'options': { 'autoRename': true, 'stringMap': [{ 'search': 'prev', 'replace': 'next', 'options': { scope: 'url' } }] }
should: 'Should not rename "prev"/"next" (autoRename:true, custom stringMap - url)',
expected: 'div.prev, div.Right { width:10px;}',
input: 'div.prev, div.Left { width:10px;}',
reversable: true,
options: { autoRename: true, stringMap: [{ search: 'prev', replace: 'next', options: { scope: 'url' } }] }
},
{
'should': 'Should not swap "prev"/"next" in Url or Selector (autoRename:true, custom stringMap - url)',
'expected': 'div.prev { background-image: url(/content/pix/prev.png);}',
'input': 'div.prev { background-image: url(/content/pix/prev.png);}',
'reversable': true,
'options': { 'autoRename': true, 'stringMap': [{ 'search': 'prev', 'replace': 'next', 'options': { scope: 'url' } }] }
should: 'Should not swap "prev"/"next" in Url or Selector (autoRename:true, custom stringMap - url)',
expected: 'div.prev { background-image: url(/content/pix/prev.png);}',
input: 'div.prev { background-image: url(/content/pix/prev.png);}',
reversable: true,
options: { autoRename: true, stringMap: [{ search: 'prev', replace: 'next', options: { scope: 'url' } }] }
},
{
'should': 'Should not swap "prev"/"next" in Url and Rename in selector (autoRename:true, custom stringMap - *)',
'expected': 'div.next { display:block }; div.next { background-image: url(/content/pix/next.png);}',
'input': 'div.prev { display:block }; div.prev { background-image: url(/content/pix/next.png);}',
'reversable': true,
'options': { 'autoRename': true, 'stringMap': [{ 'search': 'prev', 'replace': 'next', 'options': { scope: '*' } }] }
should: 'Should not swap "prev"/"next" in Url and Rename in selector (autoRename:true, custom stringMap - *)',
expected: 'div.next { display:block }; div.next { background-image: url(/content/pix/next.png);}',
input: 'div.prev { display:block }; div.prev { background-image: url(/content/pix/next.png);}',
reversable: true,
options: { autoRename: true, stringMap: [{ search: 'prev', replace: 'next', options: { scope: '*' } }] }
},
{
'should': 'Should swap "prev"/"next" in Url (autoRename:true, processUrls:true)',
'expected': 'div.prev { background-image: url(/content/pix/next.png);}',
'input': 'div.prev { background-image: url(/content/pix/prev.png);}',
'reversable': true,
'options': { 'autoRename': true, 'processUrls': true, 'stringMap': [{ 'search': 'prev', 'replace': 'next', 'options': { scope: 'url' } }] }
should: 'Should swap "prev"/"next" in Url (autoRename:true, processUrls:true)',
expected: 'div.prev { background-image: url(/content/pix/next.png);}',
input: 'div.prev { background-image: url(/content/pix/prev.png);}',
reversable: true,
options: { autoRename: true, processUrls: true, stringMap: [{ search: 'prev', replace: 'next', options: { scope: 'url' } }] }
},
{
'should': 'Should swap "prev"/"next" in Url and Rename in selector (autoRename:true, processUrls:true)',
'expected': 'div.next { display:block }; div.prev { background-image: url(/content/pix/prev.png);}',
'input': 'div.prev { display:block }; div.prev { background-image: url(/content/pix/next.png);}',
'reversable': true,
'options': { 'autoRename': true, 'processUrls': true, 'stringMap': [{ 'search': 'prev', 'replace': 'next', 'options': { scope: '*' } }] }
should: 'Should swap "prev"/"next" in Url and Rename in selector (autoRename:true, processUrls:true)',
expected: 'div.next { display:block }; div.prev { background-image: url(/content/pix/prev.png);}',
input: 'div.prev { display:block }; div.prev { background-image: url(/content/pix/next.png);}',
reversable: true,
options: { autoRename: true, processUrls: true, stringMap: [{ search: 'prev', replace: 'next', options: { scope: '*' } }] }
},
{
'should': 'Should rename "previous" to "nextious" (autoRename:true, greedy: true)',
'expected': 'div.nextious{ width:10px;}',
'input': 'div.previous{ width:10px;}',
'reversable': true,
'options': { 'autoRename': true, 'stringMap': [{ 'name': 'prev-next', 'search': 'prev', 'replace': 'next', 'options': { 'greedy': true } }] }
should: 'Should rename "previous" to "nextious" (autoRename:true, greedy: true)',
expected: 'div.nextious{ width:10px;}',
input: 'div.previous{ width:10px;}',
reversable: true,
options: { autoRename: true, stringMap: [{ name: 'prev-next', search: 'prev', replace: 'next', options: { greedy: true } }] }
},
{
'should': 'Should escape strings used in stringMap (processUrls: true, custom stringMap)',
'expected': '@import url("//a.b/c-rtl.css"); @import url("//a.b/css");',
'input': '@import url("//a.b/c.css"); @import url("//a.b/css");',
'reversable': true,
'options': { 'processUrls': true, 'stringMap': [{ 'name': 'import-stylesheet', 'priority': 1, 'exclusive': true, 'search': ['.css'], 'replace': ['-rtl.css'], 'options': { 'scope': 'url' } }] }
should: 'Should escape strings used in stringMap (processUrls: true, custom stringMap)',
expected: '@import url("//a.b/c-rtl.css"); @import url("//a.b/css");',
input: '@import url("//a.b/c.css"); @import url("//a.b/css");',
reversable: true,
options: { processUrls: true, stringMap: [{ name: 'import-stylesheet', priority: 1, exclusive: true, search: ['.css'], replace: ['-rtl.css'], options: { scope: 'url' } }] }
}
]

8

test/data/special.js
module.exports = [
{
'should': 'Should not negate tokens',
'expected': 'div { box-shadow: rgba(0, 128, 128, 0.98) inset -5em 1em 0;}',
'input': 'div { box-shadow: rgba(0, 128, 128, 0.98) inset 5em 1em 0;}',
'reversable': true
should: 'Should not negate tokens',
expected: 'div { box-shadow: rgba(0, 128, 128, 0.98) inset -5em 1em 0;}',
input: 'div { box-shadow: rgba(0, 128, 128, 0.98) inset 5em 1em 0;}',
reversable: true
}
]

192

test/data/transform-origin.js
module.exports = [
{
'should': 'Should mirror (x-offset: 0 means 0%)',
'expected': 'div { transform-origin:100%; }',
'input': 'div { transform-origin:0; }',
'reversable': false
should: 'Should mirror (x-offset: 0 means 0%)',
expected: 'div { transform-origin:100%; }',
input: 'div { transform-origin:0; }',
reversable: false
},
{
'should': 'Should mirror (x-offset)',
'expected': 'div { transform-origin:90.25%; }',
'input': 'div { transform-origin:9.75%; }',
'reversable': true
should: 'Should mirror (x-offset)',
expected: 'div { transform-origin:90.25%; }',
input: 'div { transform-origin:9.75%; }',
reversable: true
},
{
'should': 'Should mirror calc (x-offset)',
'expected': 'div { transform-origin: -moz-calc(100% - (((25%/2) * 10px))); }',
'input': 'div { transform-origin: -moz-calc(((25%/2) * 10px)); }',
'reversable': false
should: 'Should mirror calc (x-offset)',
expected: 'div { transform-origin: -moz-calc(100% - (((25%/2) * 10px))); }',
input: 'div { transform-origin: -moz-calc(((25%/2) * 10px)); }',
reversable: false
},
{
'should': 'Should not mirror (x-offset: not percent, not calc)',
'expected': 'div { transform-origin:10.75px; }',
'input': 'div { transform-origin:10.75px; }',
'reversable': false
should: 'Should not mirror (x-offset: not percent, not calc)',
expected: 'div { transform-origin:10.75px; }',
input: 'div { transform-origin:10.75px; }',
reversable: false
},
{
'should': 'Should mirror (offset-keyword)',
'expected': 'div { transform-origin:right; }',
'input': 'div { transform-origin:left; }',
'reversable': true
should: 'Should mirror (offset-keyword)',
expected: 'div { transform-origin:right; }',
input: 'div { transform-origin:left; }',
reversable: true
},
{
'should': 'Should mirror (x-offset y-offset: 0 means 0%)',
'expected': 'div { transform-origin:100% 0; }',
'input': 'div { transform-origin:0 0; }',
'reversable': false
should: 'Should mirror (x-offset y-offset: 0 means 0%)',
expected: 'div { transform-origin:100% 0; }',
input: 'div { transform-origin:0 0; }',
reversable: false
},
{
'should': 'Should mirror with y being calc (x-offset y-offset: 0 means 0%)',
'expected': 'div { transform-origin:100% -webkit-calc(15% * (3/2)); }',
'input': 'div { transform-origin:0 -webkit-calc(15% * (3/2)); }',
'reversable': false
should: 'Should mirror with y being calc (x-offset y-offset: 0 means 0%)',
expected: 'div { transform-origin:100% -webkit-calc(15% * (3/2)); }',
input: 'div { transform-origin:0 -webkit-calc(15% * (3/2)); }',
reversable: false
},
{
'should': 'Should mirror percent (x-offset y-offset)',
'expected': 'div { transform-origin:30.25% 10%; }',
'input': 'div { transform-origin:69.75% 10%; }',
'reversable': true
should: 'Should mirror percent (x-offset y-offset)',
expected: 'div { transform-origin:30.25% 10%; }',
input: 'div { transform-origin:69.75% 10%; }',
reversable: true
},
{
'should': 'Should mirror with x being calc (x-offset y-offset)',
'expected': 'div { transform-origin: -webkit-calc(100% - (15% * (3/2))) 30.25%; }',
'input': 'div { transform-origin: -webkit-calc(15% * (3/2)) 30.25%; }',
'reversable': false
should: 'Should mirror with x being calc (x-offset y-offset)',
expected: 'div { transform-origin: -webkit-calc(100% - (15% * (3/2))) 30.25%; }',
input: 'div { transform-origin: -webkit-calc(15% * (3/2)) 30.25%; }',
reversable: false
},
{
'should': 'Should mirror with y being calc (x-offset y-offset)',
'expected': 'div { transform-origin:30.25% calc(15% * (3/2)); }',
'input': 'div { transform-origin:69.75% calc(15% * (3/2)); }',
'reversable': true
should: 'Should mirror with y being calc (x-offset y-offset)',
expected: 'div { transform-origin:30.25% calc(15% * (3/2)); }',
input: 'div { transform-origin:69.75% calc(15% * (3/2)); }',
reversable: true
},
{
'should': 'Should mirror (y-offset x-offset-keyword)',
'expected': 'div { transform-origin:70% right; }',
'input': 'div { transform-origin:70% left; }',
'reversable': true
should: 'Should mirror (y-offset x-offset-keyword)',
expected: 'div { transform-origin:70% right; }',
input: 'div { transform-origin:70% left; }',
reversable: true
},
{
'should': 'Should mirror with calc (y-offset x-offset-keyword)',
'expected': 'div { transform-origin:-ms-calc(140%/2) right; }',
'input': 'div { transform-origin:-ms-calc(140%/2) left; }',
'reversable': true
should: 'Should mirror with calc (y-offset x-offset-keyword)',
expected: 'div { transform-origin:-ms-calc(140%/2) right; }',
input: 'div { transform-origin:-ms-calc(140%/2) left; }',
reversable: true
},
{
'should': 'Should mirror (x-offset-keyword y-offset)',
'expected': 'div { transform-origin:right 70%; }',
'input': 'div { transform-origin:left 70%; }',
'reversable': true
should: 'Should mirror (x-offset-keyword y-offset)',
expected: 'div { transform-origin:right 70%; }',
input: 'div { transform-origin:left 70%; }',
reversable: true
},
{
'should': 'Should mirror with calc (x-offset-keyword y-offset)',
'expected': 'div { transform-origin:right -moz-calc(((140%/2))); }',
'input': 'div { transform-origin:left -moz-calc(((140%/2))); }',
'reversable': true
should: 'Should mirror with calc (x-offset-keyword y-offset)',
expected: 'div { transform-origin:right -moz-calc(((140%/2))); }',
input: 'div { transform-origin:left -moz-calc(((140%/2))); }',
reversable: true
},
{
'should': 'Should mirror (y-offset-keyword x-offset)',
'expected': 'div { transform-origin:top 30.25%; }',
'input': 'div { transform-origin:top 69.75%; }',
'reversable': true
should: 'Should mirror (y-offset-keyword x-offset)',
expected: 'div { transform-origin:top 30.25%; }',
input: 'div { transform-origin:top 69.75%; }',
reversable: true
},
{
'should': 'Should not mirror with x being calc (y-offset-keyword x-offset)',
'expected': 'div { transform-origin:top calc(100% - (((140%/2)))); }',
'input': 'div { transform-origin:top calc(((140%/2))); }',
'reversable': false
should: 'Should not mirror with x being calc (y-offset-keyword x-offset)',
expected: 'div { transform-origin:top calc(100% - (((140%/2)))); }',
input: 'div { transform-origin:top calc(((140%/2))); }',
reversable: false
},
{
'should': 'Should mirror (x-offset-keyword y-offset-keyword)',
'expected': 'div { transform-origin:right top; }',
'input': 'div { transform-origin:left top; }',
'reversable': true
should: 'Should mirror (x-offset-keyword y-offset-keyword)',
expected: 'div { transform-origin:right top; }',
input: 'div { transform-origin:left top; }',
reversable: true
},
{
'should': 'Should mirror (y-offset-keyword x-offset-keyword)',
'expected': 'div { transform-origin:top right; }',
'input': 'div { transform-origin:top left; }',
'reversable': true
should: 'Should mirror (y-offset-keyword x-offset-keyword)',
expected: 'div { transform-origin:top right; }',
input: 'div { transform-origin:top left; }',
reversable: true
},
{
'should': 'Should mirror (x-offset y-offset z-offset)',
'expected': 'div { transform-origin:80.25% 30% 10%; }',
'input': 'div { transform-origin:19.75% 30% 10%; }',
'reversable': true
should: 'Should mirror (x-offset y-offset z-offset)',
expected: 'div { transform-origin:80.25% 30% 10%; }',
input: 'div { transform-origin:19.75% 30% 10%; }',
reversable: true
},
{
'should': 'Should mirror with x being calc (x-offset y-offset z-offset)',
'expected': 'div { transform-origin: calc(100% - (25% * 3 + 20px)) 30% 10%; }',
'input': 'div { transform-origin: calc(25% * 3 + 20px) 30% 10%; }',
'reversable': false
should: 'Should mirror with x being calc (x-offset y-offset z-offset)',
expected: 'div { transform-origin: calc(100% - (25% * 3 + 20px)) 30% 10%; }',
input: 'div { transform-origin: calc(25% * 3 + 20px) 30% 10%; }',
reversable: false
},
{
'should': 'Should mirror (y-offset x-offset-keyword z-offset)',
'expected': 'div { transform-origin:20% right 10%; }',
'input': 'div { transform-origin:20% left 10%; }',
'reversable': true
should: 'Should mirror (y-offset x-offset-keyword z-offset)',
expected: 'div { transform-origin:20% right 10%; }',
input: 'div { transform-origin:20% left 10%; }',
reversable: true
},
{
'should': 'Should mirror (x-offset-keyword y-offset z-offset)',
'expected': 'div { transform-origin:left 20% 10%; }',
'input': 'div { transform-origin:right 20% 10%; }',
'reversable': true
should: 'Should mirror (x-offset-keyword y-offset z-offset)',
expected: 'div { transform-origin:left 20% 10%; }',
input: 'div { transform-origin:right 20% 10%; }',
reversable: true
},
{
'should': 'Should mirror (x-offset-keyword y-offset-keyword z-offset)',
'expected': 'div { transform-origin:left bottom 10%; }',
'input': 'div { transform-origin:right bottom 10%; }',
'reversable': true
should: 'Should mirror (x-offset-keyword y-offset-keyword z-offset)',
expected: 'div { transform-origin:left bottom 10%; }',
input: 'div { transform-origin:right bottom 10%; }',
reversable: true
},
{
'should': 'Should mirror (y-offset-keyword x-offset-keyword z-offset)',
'expected': 'div { transform-origin:bottom left 10%; }',
'input': 'div { transform-origin:bottom right 10%; }',
'reversable': true
should: 'Should mirror (y-offset-keyword x-offset-keyword z-offset)',
expected: 'div { transform-origin:bottom left 10%; }',
input: 'div { transform-origin:bottom right 10%; }',
reversable: true
}
]

312

test/data/transforms.js
module.exports = [
{
'should': 'Should mirror transform : matrix',
'expected': 'div { transform: matrix(2, 0.1, 20.75, 2, 2, 2); }',
'input': 'div { transform: matrix(2, -0.1, -20.75, 2, -2, 2); }',
'reversable': true
should: 'Should mirror transform : matrix',
expected: 'div { transform: matrix(2, 0.1, 20.75, 2, 2, 2); }',
input: 'div { transform: matrix(2, -0.1, -20.75, 2, -2, 2); }',
reversable: true
},
{
'should': 'Should mirror transform (with no digits before dot): matrix',
'expected': 'div { transform: matrix(2, 0.1, 0.75, 2, 2, 2); }',
'input': 'div { transform: matrix(2, -0.1, -.75, 2, -2, 2); }',
'reversable': false
should: 'Should mirror transform (with no digits before dot): matrix',
expected: 'div { transform: matrix(2, 0.1, 0.75, 2, 2, 2); }',
input: 'div { transform: matrix(2, -0.1, -.75, 2, -2, 2); }',
reversable: false
},
{
'should': 'Should mirror transform with calc: matrix',
'expected': 'div { transform: matrix( -moz-calc(((25%/2) * 10px)), calc(-1*(((25%/2) * 10px))), 20.75, 2, 2, 2 ); }',
'input': 'div { transform: matrix( -moz-calc(((25%/2) * 10px)), calc(((25%/2) * 10px)), -20.75, 2, -2, 2 ); }',
'reversable': false
should: 'Should mirror transform with calc: matrix',
expected: 'div { transform: matrix( -moz-calc(((25%/2) * 10px)), calc(-1*(((25%/2) * 10px))), 20.75, 2, 2, 2 ); }',
input: 'div { transform: matrix( -moz-calc(((25%/2) * 10px)), calc(((25%/2) * 10px)), -20.75, 2, -2, 2 ); }',
reversable: false
},
{
'should': 'Should mirror transform : matrix3d',
'expected': 'div { transform:matrix3d(0.227114470162179, 0.127248412323519, 0, 0.000811630714323203, 0.113139853456515, 1.53997196559414, 0, 0.000596368270149729, 0, 0, 1, 0, -165, 67, 0, 1); }',
'input': 'div { transform:matrix3d(0.227114470162179, -0.127248412323519, 0, -0.000811630714323203, -0.113139853456515, 1.53997196559414, 0, 0.000596368270149729, 0, 0, 1, 0, 165, 67, 0, 1); }',
'reversable': true
should: 'Should mirror transform : matrix3d',
expected: 'div { transform:matrix3d(0.227114470162179, 0.127248412323519, 0, 0.000811630714323203, 0.113139853456515, 1.53997196559414, 0, 0.000596368270149729, 0, 0, 1, 0, -165, 67, 0, 1); }',
input: 'div { transform:matrix3d(0.227114470162179, -0.127248412323519, 0, -0.000811630714323203, -0.113139853456515, 1.53997196559414, 0, 0.000596368270149729, 0, 0, 1, 0, 165, 67, 0, 1); }',
reversable: true
},
{
'should': 'Should mirror transform (with no digits before dot): matrix3d',
'expected': 'div { transform:matrix3d(0.227114470162179, 0.127248412323519, 0, 0.000811630714323203, 0.113139853456515, 1.53997196559414, 0, 0.000596368270149729, 0, 0, 1, 0, -165, 67, 0, 1); }',
'input': 'div { transform:matrix3d(0.227114470162179, -.127248412323519, 0, -0.000811630714323203, -0.113139853456515, 1.53997196559414, 0, 0.000596368270149729, 0, 0, 1, 0, 165, 67, 0, 1); }',
'reversable': false
should: 'Should mirror transform (with no digits before dot): matrix3d',
expected: 'div { transform:matrix3d(0.227114470162179, 0.127248412323519, 0, 0.000811630714323203, 0.113139853456515, 1.53997196559414, 0, 0.000596368270149729, 0, 0, 1, 0, -165, 67, 0, 1); }',
input: 'div { transform:matrix3d(0.227114470162179, -.127248412323519, 0, -0.000811630714323203, -0.113139853456515, 1.53997196559414, 0, 0.000596368270149729, 0, 0, 1, 0, 165, 67, 0, 1); }',
reversable: false
},
{
'should': 'Should mirror transform with calc : matrix3d',
'expected': 'div { transform:matrix3d(0.227114470162179, 0.127248412323519, 0, 0.000811630714323203, 0.113139853456515, 1.53997196559414, 0, 0.000596368270149729, 0, 0, 1, 0, calc(-1*(((25%/2) * 10px))), 67, 0, 1); }',
'input': 'div { transform:matrix3d(0.227114470162179, -0.127248412323519, 0, -0.000811630714323203, -0.113139853456515, 1.53997196559414, 0, 0.000596368270149729, 0, 0, 1, 0, calc(((25%/2) * 10px)), 67, 0, 1); }',
'reversable': false
should: 'Should mirror transform with calc : matrix3d',
expected: 'div { transform:matrix3d(0.227114470162179, 0.127248412323519, 0, 0.000811630714323203, 0.113139853456515, 1.53997196559414, 0, 0.000596368270149729, 0, 0, 1, 0, calc(-1*(((25%/2) * 10px))), 67, 0, 1); }',
input: 'div { transform:matrix3d(0.227114470162179, -0.127248412323519, 0, -0.000811630714323203, -0.113139853456515, 1.53997196559414, 0, 0.000596368270149729, 0, 0, 1, 0, calc(((25%/2) * 10px)), 67, 0, 1); }',
reversable: false
},
{
'should': 'Should mirror transform : translate',
'expected': 'div { transform: translate(-10.75px); }',
'input': 'div { transform: translate(10.75px); }',
'reversable': true
should: 'Should mirror transform : translate',
expected: 'div { transform: translate(-10.75px); }',
input: 'div { transform: translate(10.75px); }',
reversable: true
},
{
'should': 'Should mirror transform (with no digits before dot): translate',
'expected': 'div { transform: translate(-0.75px); }',
'input': 'div { transform: translate(.75px); }',
'reversable': false
should: 'Should mirror transform (with no digits before dot): translate',
expected: 'div { transform: translate(-0.75px); }',
input: 'div { transform: translate(.75px); }',
reversable: false
},
{
'should': 'Should mirror transform with calc: translate',
'expected': 'div { transform: translate(-moz-calc(-1*(((25%/2) * 10px)))); }',
'input': 'div { transform: translate(-moz-calc(((25%/2) * 10px))); }',
'reversable': false
should: 'Should mirror transform with calc: translate',
expected: 'div { transform: translate(-moz-calc(-1*(((25%/2) * 10px)))); }',
input: 'div { transform: translate(-moz-calc(((25%/2) * 10px))); }',
reversable: false
},
{
'should': 'Should mirror transform : translateX',
'expected': 'div { transform: translateX(-50.25px); }',
'input': 'div { transform: translateX(50.25px); }',
'reversable': true
should: 'Should mirror transform : translateX',
expected: 'div { transform: translateX(-50.25px); }',
input: 'div { transform: translateX(50.25px); }',
reversable: true
},
{
'should': 'Should mirror transform (with no digits before dot): translateX',
'expected': 'div { transform: translateX(-0.25px); }',
'input': 'div { transform: translateX(.25px); }',
'reversable': false
should: 'Should mirror transform (with no digits before dot): translateX',
expected: 'div { transform: translateX(-0.25px); }',
input: 'div { transform: translateX(.25px); }',
reversable: false
},
{
'should': 'Should mirror transform with calc : translateX',
'expected': 'div { transform: translateX(-ms-calc(-1*(((25%/2) * 10px))))); }',
'input': 'div { transform: translateX(-ms-calc(((25%/2) * 10px)))); }',
'reversable': false
should: 'Should mirror transform with calc : translateX',
expected: 'div { transform: translateX(-ms-calc(-1*(((25%/2) * 10px))))); }',
input: 'div { transform: translateX(-ms-calc(((25%/2) * 10px)))); }',
reversable: false
},
{
'should': 'Should mirror transform : translate3d',
'expected': 'div { transform: translate3d(-12.75px, 50%, 3em); }',
'input': 'div { transform: translate3d(12.75px, 50%, 3em); }',
'reversable': true
should: 'Should mirror transform : translate3d',
expected: 'div { transform: translate3d(-12.75px, 50%, 3em); }',
input: 'div { transform: translate3d(12.75px, 50%, 3em); }',
reversable: true
},
{
'should': 'Should mirror transform (with no digits before dot): translate3d',
'expected': 'div { transform: translate3d(-0.75px, 50%, 3em); }',
'input': 'div { transform: translate3d(.75px, 50%, 3em); }',
'reversable': false
should: 'Should mirror transform (with no digits before dot): translate3d',
expected: 'div { transform: translate3d(-0.75px, 50%, 3em); }',
input: 'div { transform: translate3d(.75px, 50%, 3em); }',
reversable: false
},
{
'should': 'Should mirror transform with calc: translate3d',
'expected': 'div { transform: translate3d(-webkit-calc(-1*(((25%/2) * 10px))))), 50%, calc(((25%/2) * 10px))))); }',
'input': 'div { transform: translate3d(-webkit-calc(((25%/2) * 10px)))), 50%, calc(((25%/2) * 10px))))); }',
'reversable': false
should: 'Should mirror transform with calc: translate3d',
expected: 'div { transform: translate3d(-webkit-calc(-1*(((25%/2) * 10px))))), 50%, calc(((25%/2) * 10px))))); }',
input: 'div { transform: translate3d(-webkit-calc(((25%/2) * 10px)))), 50%, calc(((25%/2) * 10px))))); }',
reversable: false
},
{
'should': 'Should mirror transform : rotate',
'expected': 'div { transform: rotate(-20.75deg); }',
'input': 'div { transform: rotate(20.75deg); }',
'reversable': true
should: 'Should mirror transform : rotate',
expected: 'div { transform: rotate(-20.75deg); }',
input: 'div { transform: rotate(20.75deg); }',
reversable: true
},
{
'should': 'Should mirror transform (with no digits before dot): rotate',
'expected': 'div { transform: rotate(-0.75deg); }',
'input': 'div { transform: rotate(.75deg); }',
'reversable': false
should: 'Should mirror transform (with no digits before dot): rotate',
expected: 'div { transform: rotate(-0.75deg); }',
input: 'div { transform: rotate(.75deg); }',
reversable: false
},
{
'should': 'Should mirror transform with calc: rotate',
'expected': 'div { transform: rotate(calc(-1*(((25%/2) * 10deg)))); }',
'input': 'div { transform: rotate(calc(((25%/2) * 10deg))); }',
'reversable': false
should: 'Should mirror transform with calc: rotate',
expected: 'div { transform: rotate(calc(-1*(((25%/2) * 10deg)))); }',
input: 'div { transform: rotate(calc(((25%/2) * 10deg))); }',
reversable: false
},
{
'should': 'Should mirror transform : rotate3d',
'expected': 'div { transform: rotate3d(-10, 20.15, 10, -45.14deg); }',
'input': 'div { transform: rotate3d(10, 20.15, 10, 45.14deg); }',
'reversable': true
should: 'Should mirror transform : rotate3d',
expected: 'div { transform: rotate3d(-10, 20.15, 10, -45.14deg); }',
input: 'div { transform: rotate3d(10, 20.15, 10, 45.14deg); }',
reversable: true
},
{
'should': 'Should mirror transform (with no digits before dot): rotate3d',
'expected': 'div { transform: rotate3d(-10, 20, 10, -0.14deg); }',
'input': 'div { transform: rotate3d(10, 20, 10, .14deg); }',
'reversable': false
should: 'Should mirror transform (with no digits before dot): rotate3d',
expected: 'div { transform: rotate3d(-10, 20, 10, -0.14deg); }',
input: 'div { transform: rotate3d(10, 20, 10, .14deg); }',
reversable: false
},
{
'should': 'Should mirror transform with calc: rotate3d',
'expected': 'div { transform: rotate3d(-10, 20.15, 10, calc(-1*(((25%/2) * 10deg)))); }',
'input': 'div { transform: rotate3d(10, 20.15, 10, calc(((25%/2) * 10deg))); }',
'reversable': false
should: 'Should mirror transform with calc: rotate3d',
expected: 'div { transform: rotate3d(-10, 20.15, 10, calc(-1*(((25%/2) * 10deg)))); }',
input: 'div { transform: rotate3d(10, 20.15, 10, calc(((25%/2) * 10deg))); }',
reversable: false
},
{
'should': 'Should not mirror transform : rotateX',
'expected': 'div { transform: rotateX(45deg); }',
'input': 'div { transform: rotateX(45deg); }',
'reversable': false
should: 'Should not mirror transform : rotateX',
expected: 'div { transform: rotateX(45deg); }',
input: 'div { transform: rotateX(45deg); }',
reversable: false
},
{
'should': 'Should not mirror transform with calc: rotateX',
'expected': 'div { transform: rotateX(calc(((25%/2) * 10deg))); }',
'input': 'div { transform: rotateX(calc(((25%/2) * 10deg))); }',
'reversable': false
should: 'Should not mirror transform with calc: rotateX',
expected: 'div { transform: rotateX(calc(((25%/2) * 10deg))); }',
input: 'div { transform: rotateX(calc(((25%/2) * 10deg))); }',
reversable: false
},
{
'should': 'Should mirror transform : rotateY',
'expected': 'div { transform: rotateY(-45deg); }',
'input': 'div { transform: rotateY(45deg); }',
'reversable': false
should: 'Should mirror transform : rotateY',
expected: 'div { transform: rotateY(-45deg); }',
input: 'div { transform: rotateY(45deg); }',
reversable: false
},
{
'should': 'Should mirror transform with calc: rotateY',
'expected': 'div { transform: rotateY(calc(-1*(((25%/2) * 10deg)))); }',
'input': 'div { transform: rotateY(calc(((25%/2) * 10deg))); }',
'reversable': false
should: 'Should mirror transform with calc: rotateY',
expected: 'div { transform: rotateY(calc(-1*(((25%/2) * 10deg)))); }',
input: 'div { transform: rotateY(calc(((25%/2) * 10deg))); }',
reversable: false
},
{
'should': 'Should mirror transform : rotateZ',
'expected': 'div { transform: rotateZ(-45.75deg); }',
'input': 'div { transform: rotateZ(45.75deg); }',
'reversable': true
should: 'Should mirror transform : rotateZ',
expected: 'div { transform: rotateZ(-45.75deg); }',
input: 'div { transform: rotateZ(45.75deg); }',
reversable: true
},
{
'should': 'Should mirror transform (with no digits before dot): rotateZ',
'expected': 'div { transform: rotateZ(-0.75deg); }',
'input': 'div { transform: rotateZ(.75deg); }',
'reversable': false
should: 'Should mirror transform (with no digits before dot): rotateZ',
expected: 'div { transform: rotateZ(-0.75deg); }',
input: 'div { transform: rotateZ(.75deg); }',
reversable: false
},
{
'should': 'Should mirror transform with calc: rotateZ',
'expected': 'div { transform: rotateZ(-ms-calc(-1*(((25%/2) * 10deg)))); }',
'input': 'div { transform: rotateZ(-ms-calc(((25%/2) * 10deg))); }',
'reversable': false
should: 'Should mirror transform with calc: rotateZ',
expected: 'div { transform: rotateZ(-ms-calc(-1*(((25%/2) * 10deg)))); }',
input: 'div { transform: rotateZ(-ms-calc(((25%/2) * 10deg))); }',
reversable: false
},
{
'should': 'Should mirror transform : skew',
'expected': 'div { transform: skew(-20.25rad,-30deg); }',
'input': 'div { transform: skew(20.25rad,30deg); }',
'reversable': true
should: 'Should mirror transform : skew',
expected: 'div { transform: skew(-20.25rad,-30deg); }',
input: 'div { transform: skew(20.25rad,30deg); }',
reversable: true
},
{
'should': 'Should mirror transform (with no digits before dot): skew',
'expected': 'div { transform: skew(-0.25rad,-30deg); }',
'input': 'div { transform: skew(.25rad,30deg); }',
'reversable': false
should: 'Should mirror transform (with no digits before dot): skew',
expected: 'div { transform: skew(-0.25rad,-30deg); }',
input: 'div { transform: skew(.25rad,30deg); }',
reversable: false
},
{
'should': 'Should mirror transform with calc: skew',
'expected': 'div { transform: skew(calc(-1*(((25%/2) * 10rad))),calc(-1*(((25%/2) * 10deg)))); }',
'input': 'div { transform: skew(calc(((25%/2) * 10rad)),calc(((25%/2) * 10deg))); }',
'reversable': false
should: 'Should mirror transform with calc: skew',
expected: 'div { transform: skew(calc(-1*(((25%/2) * 10rad))),calc(-1*(((25%/2) * 10deg)))); }',
input: 'div { transform: skew(calc(((25%/2) * 10rad)),calc(((25%/2) * 10deg))); }',
reversable: false
},
{
'should': 'Should mirror transform : skewX',
'expected': 'div { transform: skewX(-20.75rad); }',
'input': 'div { transform: skewX(20.75rad); }',
'reversable': true
should: 'Should mirror transform : skewX',
expected: 'div { transform: skewX(-20.75rad); }',
input: 'div { transform: skewX(20.75rad); }',
reversable: true
},
{
'should': 'Should mirror transform (with no digits before dot): skewX',
'expected': 'div { transform: skewX(-0.75rad); }',
'input': 'div { transform: skewX(.75rad); }',
'reversable': false
should: 'Should mirror transform (with no digits before dot): skewX',
expected: 'div { transform: skewX(-0.75rad); }',
input: 'div { transform: skewX(.75rad); }',
reversable: false
},
{
'should': 'Should mirror transform with calc: skewX',
'expected': 'div { transform: skewX(-moz-calc(-1*(((25%/2) * 10rad)))); }',
'input': 'div { transform: skewX(-moz-calc(((25%/2) * 10rad))); }',
'reversable': false
should: 'Should mirror transform with calc: skewX',
expected: 'div { transform: skewX(-moz-calc(-1*(((25%/2) * 10rad)))); }',
input: 'div { transform: skewX(-moz-calc(((25%/2) * 10rad))); }',
reversable: false
},
{
'should': 'Should mirror transform : skewY',
'expected': 'div { transform: skewY(-10.75grad); }',
'input': 'div { transform: skewY(10.75grad); }',
'reversable': true
should: 'Should mirror transform : skewY',
expected: 'div { transform: skewY(-10.75grad); }',
input: 'div { transform: skewY(10.75grad); }',
reversable: true
},
{
'should': 'Should mirror transform (with no digits before dot): skewY',
'expected': 'div { transform: skewY(-0.75grad); }',
'input': 'div { transform: skewY(.75grad); }',
'reversable': false
should: 'Should mirror transform (with no digits before dot): skewY',
expected: 'div { transform: skewY(-0.75grad); }',
input: 'div { transform: skewY(.75grad); }',
reversable: false
},
{
'should': 'Should mirror transform with calc: skewY',
'expected': 'div { transform: skewY(calc(-1*(((25%/2) * 10grad)))); }',
'input': 'div { transform: skewY(calc(((25%/2) * 10grad))); }',
'reversable': false
should: 'Should mirror transform with calc: skewY',
expected: 'div { transform: skewY(calc(-1*(((25%/2) * 10grad)))); }',
input: 'div { transform: skewY(calc(((25%/2) * 10grad))); }',
reversable: false
},
{
'should': 'Should mirror multiple transforms : translateX translateY Rotate',
'expected': 'div { transform: translateX(-50.25px) translateY(50.25px) rotate(-20.75deg); }',
'input': 'div { transform: translateX(50.25px) translateY(50.25px) rotate(20.75deg); }',
'reversable': true
should: 'Should mirror multiple transforms : translateX translateY Rotate',
expected: 'div { transform: translateX(-50.25px) translateY(50.25px) rotate(-20.75deg); }',
input: 'div { transform: translateX(50.25px) translateY(50.25px) rotate(20.75deg); }',
reversable: true
},
{
'should': 'Should mirror multiple transforms with calc : translateX translateY Rotate',
'expected': 'div { transform: translateX(-ms-calc(-1*(((25%/2) * 10px)))) translateY(-moz-calc(((25%/2) * 10rad))) rotate(calc(-1*(((25%/2) * 10grad)))); }',
'input': 'div { transform: translateX(-ms-calc(((25%/2) * 10px))) translateY(-moz-calc(((25%/2) * 10rad))) rotate(calc(((25%/2) * 10grad))); }',
'reversable': false
should: 'Should mirror multiple transforms with calc : translateX translateY Rotate',
expected: 'div { transform: translateX(-ms-calc(-1*(((25%/2) * 10px)))) translateY(-moz-calc(((25%/2) * 10rad))) rotate(calc(-1*(((25%/2) * 10grad)))); }',
input: 'div { transform: translateX(-ms-calc(((25%/2) * 10px))) translateY(-moz-calc(((25%/2) * 10rad))) rotate(calc(((25%/2) * 10grad))); }',
reversable: false
}
]

136

test/data/values-n-syntax.js
module.exports = [
{
'should': 'Should mirror property value: border-radius (4 values)',
'expected': 'div { border-radius: 40.25px 10.5px 10.75px 40.3px; }',
'input': 'div { border-radius: 10.5px 40.25px 40.3px 10.75px; }',
'reversable': true
should: 'Should mirror property value: border-radius (4 values)',
expected: 'div { border-radius: 40.25px 10.5px 10.75px 40.3px; }',
input: 'div { border-radius: 10.5px 40.25px 40.3px 10.75px; }',
reversable: true
},
{
'should': 'Should mirror property value: border-radius (3 values)',
'expected': 'div { border-radius: 40.75px 10.75px 40.75px 40.3px; }',
'input': 'div { border-radius: 10.75px 40.75px 40.3px; }',
'reversable': false
should: 'Should mirror property value: border-radius (3 values)',
expected: 'div { border-radius: 40.75px 10.75px 40.75px 40.3px; }',
input: 'div { border-radius: 10.75px 40.75px 40.3px; }',
reversable: false
},
{
'should': 'Should mirror property value: border-radius (2 values)',
'expected': 'div { border-radius: 40.25px 10.75px; }',
'input': 'div { border-radius: 10.75px 40.25px; }',
'reversable': true
should: 'Should mirror property value: border-radius (2 values)',
expected: 'div { border-radius: 40.25px 10.75px; }',
input: 'div { border-radius: 10.75px 40.25px; }',
reversable: true
},
{
'should': 'Should mirror property value: border-radius (4 values - double)',
'expected': 'div { border-radius: 40.25px 10.75px .5px 40.75px / .4em 1em 1em 4.5em; }',
'input': 'div { border-radius: 10.75px 40.25px 40.75px .5px / 1em .4em 4.5em 1em; }',
'reversable': true
should: 'Should mirror property value: border-radius (4 values - double)',
expected: 'div { border-radius: 40.25px 10.75px .5px 40.75px / .4em 1em 1em 4.5em; }',
input: 'div { border-radius: 10.75px 40.25px 40.75px .5px / 1em .4em 4.5em 1em; }',
reversable: true
},
{
'should': 'Should mirror property value: border-radius (3 values - double)',
'expected': 'div { border-radius: .40px 10.5px .40px 40px / 4em 1em 4em 3em; }',
'input': 'div { border-radius: 10.5px .40px 40px / 1em 4em 3em; }',
'reversable': false
should: 'Should mirror property value: border-radius (3 values - double)',
expected: 'div { border-radius: .40px 10.5px .40px 40px / 4em 1em 4em 3em; }',
input: 'div { border-radius: 10.5px .40px 40px / 1em 4em 3em; }',
reversable: false
},
{
'should': 'Should mirror property value: border-radius (2 values- double)',
'expected': 'div { border-radius: 40px 10px / 2.5em .75em; }',
'input': 'div { border-radius: 10px 40px / .75em 2.5em; }',
'reversable': true
should: 'Should mirror property value: border-radius (2 values- double)',
expected: 'div { border-radius: 40px 10px / 2.5em .75em; }',
input: 'div { border-radius: 10px 40px / .75em 2.5em; }',
reversable: true
},
{
'should': 'Should mirror property value: border-width',
'expected': 'div { border-width: 1px 4px .3em 2.5em; }',
'input': 'div { border-width: 1px 2.5em .3em 4px; }',
'reversable': true
should: 'Should mirror property value: border-width',
expected: 'div { border-width: 1px 4px .3em 2.5em; }',
input: 'div { border-width: 1px 2.5em .3em 4px; }',
reversable: true
},
{
'should': 'Should mirror property value: border-width (none length)',
'expected': 'div { border-width: thin medium thick none; }',
'input': 'div { border-width: thin none thick medium; }',
'reversable': true
should: 'Should mirror property value: border-width (none length)',
expected: 'div { border-width: thin medium thick none; }',
input: 'div { border-width: thin none thick medium; }',
reversable: true
},
{
'should': 'Should mirror property value: border-style (4 values)',
'expected': 'div { border-style: none dashed dotted solid; }',
'input': 'div { border-style: none solid dotted dashed; }',
'reversable': true
should: 'Should mirror property value: border-style (4 values)',
expected: 'div { border-style: none dashed dotted solid; }',
input: 'div { border-style: none solid dotted dashed; }',
reversable: true
},
{
'should': 'Should mirror property value: border-color (4 values)',
'expected': 'div { border-color: rgba(255, 255, 255, 1) rgb( 0, 0, 0) #000 hsla(0, 100%, 50%, 1); }',
'input': 'div { border-color: rgba(255, 255, 255, 1) hsla(0, 100%, 50%, 1) #000 rgb( 0, 0, 0); }',
'reversable': true
should: 'Should mirror property value: border-color (4 values)',
expected: 'div { border-color: rgba(255, 255, 255, 1) rgb( 0, 0, 0) #000 hsla(0, 100%, 50%, 1); }',
input: 'div { border-color: rgba(255, 255, 255, 1) hsla(0, 100%, 50%, 1) #000 rgb( 0, 0, 0); }',
reversable: true
},
{
'should': 'Should not mirror property value: border-color (3 values)',
'expected': 'div { border-color: #000 rgb( 0, 0, 0) hsla(0, 100%, 50%, 1); }',
'input': 'div { border-color: #000 rgb( 0, 0, 0) hsla(0, 100%, 50%, 1); }',
'reversable': false
should: 'Should not mirror property value: border-color (3 values)',
expected: 'div { border-color: #000 rgb( 0, 0, 0) hsla(0, 100%, 50%, 1); }',
input: 'div { border-color: #000 rgb( 0, 0, 0) hsla(0, 100%, 50%, 1); }',
reversable: false
},
{
'should': 'Should not mirror property value: border-color (2 values)',
'expected': 'div { border-color:rgb( 0, 0, 0) hsla(0, 100%, 50%, 1); }',
'input': 'div { border-color:rgb( 0, 0, 0) hsla(0, 100%, 50%, 1); }',
'reversable': false
should: 'Should not mirror property value: border-color (2 values)',
expected: 'div { border-color:rgb( 0, 0, 0) hsla(0, 100%, 50%, 1); }',
input: 'div { border-color:rgb( 0, 0, 0) hsla(0, 100%, 50%, 1); }',
reversable: false
},
{
'should': 'Should mirror property value: margin',
'expected': 'div { margin: .1em auto 3.5rem 2px; }',
'input': 'div { margin: .1em 2px 3.5rem auto; }',
'reversable': true
should: 'Should mirror property value: margin',
expected: 'div { margin: .1em auto 3.5rem 2px; }',
input: 'div { margin: .1em 2px 3.5rem auto; }',
reversable: true
},
{
'should': 'Should mirror property value: padding',
'expected': 'div { padding: 1px 4px .3rem 2.5em; }',
'input': 'div { padding: 1px 2.5em .3rem 4px; }',
'reversable': true
should: 'Should mirror property value: padding',
expected: 'div { padding: 1px 4px .3rem 2.5em; }',
input: 'div { padding: 1px 2.5em .3rem 4px; }',
reversable: true
},
{
'should': 'Should mirror property value: box-shadow',
'expected': 'div { box-shadow: -60px -16px rgba(0, 128, 128, 0.98), -10.25px 5px 5px #ff0, inset -0.5em 1em 0 white; }',
'input': 'div { box-shadow: 60px -16px rgba(0, 128, 128, 0.98), 10.25px 5px 5px #ff0, inset 0.5em 1em 0 white; }',
'reversable': true
should: 'Should mirror property value: box-shadow',
expected: 'div { box-shadow: -60px -16px rgba(0, 128, 128, 0.98), -10.25px 5px 5px #ff0, inset -0.5em 1em 0 white; }',
input: 'div { box-shadow: 60px -16px rgba(0, 128, 128, 0.98), 10.25px 5px 5px #ff0, inset 0.5em 1em 0 white; }',
reversable: true
},
{
'should': 'Should mirror property value: text-shadow',
'expected': 'div { text-shadow: -60px -16px rgba(0, 128, 128, 0.98), -10.25px 5px 5px #ff0, inset -0.5em 1em 0 white; }',
'input': 'div { text-shadow: 60px -16px rgba(0, 128, 128, 0.98), 10.25px 5px 5px #ff0, inset 0.5em 1em 0 white; }',
'reversable': true
should: 'Should mirror property value: text-shadow',
expected: 'div { text-shadow: -60px -16px rgba(0, 128, 128, 0.98), -10.25px 5px 5px #ff0, inset -0.5em 1em 0 white; }',
input: 'div { text-shadow: 60px -16px rgba(0, 128, 128, 0.98), 10.25px 5px 5px #ff0, inset 0.5em 1em 0 white; }',
reversable: true
},
{
'should': 'Should mirror property value (no digit before the dot): box-shadow, text-shadow',
'expected': 'div { box-shadow: inset -0.5em 1em 0 white; text-shadow: inset -0.5em 1em 0 white; }',
'input': 'div { box-shadow: inset .5em 1em 0 white; text-shadow: inset .5em 1em 0 white; }',
'reversable': false
should: 'Should mirror property value (no digit before the dot): box-shadow, text-shadow',
expected: 'div { box-shadow: inset -0.5em 1em 0 white; text-shadow: inset -0.5em 1em 0 white; }',
input: 'div { box-shadow: inset .5em 1em 0 white; text-shadow: inset .5em 1em 0 white; }',
reversable: false
}
]

90

test/data/values.js
module.exports = [
{
'should': 'Should mirror property value: clear',
'expected': 'div { clear:right; }',
'input': 'div { clear:left; }',
'reversable': true
should: 'Should mirror property value: clear',
expected: 'div { clear:right; }',
input: 'div { clear:left; }',
reversable: true
},
{
'should': 'Should mirror property value: direction',
'expected': 'div { direction:ltr; }',
'input': 'div { direction:rtl; }',
'reversable': true
should: 'Should mirror property value: direction',
expected: 'div { direction:ltr; }',
input: 'div { direction:rtl; }',
reversable: true
},
{
'should': 'Should mirror property value: float',
'expected': 'div { float:right; }',
'input': 'div { float:left; }',
'reversable': true
should: 'Should mirror property value: float',
expected: 'div { float:right; }',
input: 'div { float:left; }',
reversable: true
},
{
'should': 'Should mirror property value: text-align',
'expected': 'div { text-align:right; }',
'input': 'div { text-align:left; }',
'reversable': true
should: 'Should mirror property value: text-align',
expected: 'div { text-align:right; }',
input: 'div { text-align:left; }',
reversable: true
},
{
'should': 'Should mirror property value: cursor nw',
'expected': 'div { cursor:nw-resize; }',
'input': 'div { cursor:ne-resize; }',
'reversable': true
should: 'Should mirror property value: cursor nw',
expected: 'div { cursor:nw-resize; }',
input: 'div { cursor:ne-resize; }',
reversable: true
},
{
'should': 'Should mirror property value: cursor sw',
'expected': 'div { cursor:sw-resize; }',
'input': 'div { cursor:se-resize; }',
'reversable': true
should: 'Should mirror property value: cursor sw',
expected: 'div { cursor:sw-resize; }',
input: 'div { cursor:se-resize; }',
reversable: true
},
{
'should': 'Should mirror property value: cursor nesw',
'expected': 'div { cursor:nesw-resize; }',
'input': 'div { cursor:nwse-resize; }',
'reversable': true
should: 'Should mirror property value: cursor nesw',
expected: 'div { cursor:nesw-resize; }',
input: 'div { cursor:nwse-resize; }',
reversable: true
},
{
'should': 'Should keep property value as is: cursor ew',
'expected': 'div { cursor:ew-resize; }',
'input': 'div { cursor:ew-resize; }',
'reversable': false
should: 'Should keep property value as is: cursor ew',
expected: 'div { cursor:ew-resize; }',
input: 'div { cursor:ew-resize; }',
reversable: false
},
{
'should': 'Should process string map in url: cursor (processUrls: true)',
'expected': '.foo { cursor: url(right.cur), url(rtl.cur), se-resize, auto }',
'input': '.foo { cursor: url(left.cur), url(ltr.cur), sw-resize, auto }',
'reversable': true,
'options': { 'processUrls': true }
should: 'Should process string map in url: cursor (processUrls: true)',
expected: '.foo { cursor: url(right.cur), url(rtl.cur), se-resize, auto }',
input: '.foo { cursor: url(left.cur), url(ltr.cur), sw-resize, auto }',
reversable: true,
options: { processUrls: true }
},
{
'should': 'Should mirror property value: transition',
'expected': '.foo { transition: right .3s ease .1s, left .3s ease .1s, margin-right .3s ease, margin-left .3s ease, padding-right .3s ease, padding-left .3s ease}',
'input': '.foo { transition: left .3s ease .1s, right .3s ease .1s, margin-left .3s ease, margin-right .3s ease, padding-left .3s ease, padding-right .3s ease}',
'reversable': true
should: 'Should mirror property value: transition',
expected: '.foo { transition: right .3s ease .1s, left .3s ease .1s, margin-right .3s ease, margin-left .3s ease, padding-right .3s ease, padding-left .3s ease}',
input: '.foo { transition: left .3s ease .1s, right .3s ease .1s, margin-left .3s ease, margin-right .3s ease, padding-left .3s ease, padding-right .3s ease}',
reversable: true
},
{
'should': 'Should mirror property value: transition-property',
'expected': '.foo { transition-property: right; }',
'input': '.foo { transition-property: left; }',
'reversable': true
should: 'Should mirror property value: transition-property',
expected: '.foo { transition-property: right; }',
input: '.foo { transition-property: left; }',
reversable: true
}
]

16

test/data/variables.js
module.exports = [
{
'should': 'Should not process variables starting with direction',
'expected': ':root {--left-margin: 1em}',
'input': ':root {--left-margin: 1em}',
'reversable': true
should: 'Should not process variables starting with direction',
expected: ':root {--left-margin: 1em}',
input: ':root {--left-margin: 1em}',
reversable: true
},
{
'should': 'Should not process variables containing direction',
'expected': ':root {--brightest: red}',
'input': ':root {--brightest: red}',
'reversable': true
should: 'Should not process variables containing direction',
expected: ':root {--brightest: red}',
input: ':root {--brightest: red}',
reversable: true
}
]

15

test/test.js
/* global describe */
/* global it */
var assert = require('assert')
var rtlcss = require('../lib/rtlcss.js')
var tests = {
const assert = require('assert')
const rtlcss = require('../lib/rtlcss.js')
const tests = {
'# Background:': require('./data/background.js'),

@@ -23,8 +23,7 @@ '# Background Image:': require('./data/background-image.js'),

}
var key
for (key in tests) {
var group = tests[key]
for (const key in tests) {
const group = tests[key]
describe(key, function () {
for (var i = 0; i < group.length; i++) {
var item = group[i]
for (let i = 0; i < group.length; i++) {
const item = group[i]
;(function (test) {

@@ -31,0 +30,0 @@ it(test.should, function (done) {

.travis.yml

Sorry, the diff of this file is not supported yet

test/css/input.expected.css

Sorry, the diff of this file is not supported yet

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

About

Packages

npm

Go

Maven

PyPI

Rubygems

Stay in touch

Get open source security insights delivered straight into your inbox.

  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc