Parse metric values for gradients
This commit is contained in:
parent
066fa8297b
commit
eb33883a04
2 changed files with 32 additions and 26 deletions
|
@ -27,6 +27,8 @@ module.exports = (function() {
|
||||||
radialGradient: /^radial\-gradient/i,
|
radialGradient: /^radial\-gradient/i,
|
||||||
sideOrCorner: /^to (left (top|bottom)|right (top|bottom)|left|right|top|bottom)/i,
|
sideOrCorner: /^to (left (top|bottom)|right (top|bottom)|left|right|top|bottom)/i,
|
||||||
pixelValue: /^([0-9]+)px/,
|
pixelValue: /^([0-9]+)px/,
|
||||||
|
percentageValue: /^([0-9]+)\%/,
|
||||||
|
emValue: /^([0-9]+)em/,
|
||||||
startCall: /^\(/,
|
startCall: /^\(/,
|
||||||
endCall: /^\)/,
|
endCall: /^\)/,
|
||||||
comma: /^,/
|
comma: /^,/
|
||||||
|
@ -38,7 +40,7 @@ module.exports = (function() {
|
||||||
function error(msg) {
|
function error(msg) {
|
||||||
var err = new Error(input + ':' + cursor + ': ' + msg);
|
var err = new Error(input + ':' + cursor + ': ' + msg);
|
||||||
err.position = cursor;
|
err.position = cursor;
|
||||||
err.message = msg;
|
//err.message = msg;
|
||||||
err.source = input;
|
err.source = input;
|
||||||
throw err;
|
throw err;
|
||||||
}
|
}
|
||||||
|
@ -79,8 +81,8 @@ module.exports = (function() {
|
||||||
matchOrientation);
|
matchOrientation);
|
||||||
}
|
}
|
||||||
|
|
||||||
function matchGradient(gradientType, token, orientationMatcher) {
|
function matchGradient(gradientType, pattern, orientationMatcher) {
|
||||||
var captures = scan(token),
|
var captures = scan(pattern),
|
||||||
orientation,
|
orientation,
|
||||||
colorStops;
|
colorStops;
|
||||||
|
|
||||||
|
@ -174,14 +176,16 @@ module.exports = (function() {
|
||||||
}
|
}
|
||||||
|
|
||||||
function matchLength() {
|
function matchLength() {
|
||||||
return matchPixel();
|
return matchMetric(tokens.pixelValue, 'px') ||
|
||||||
|
matchMetric(tokens.percentageValue, '%') ||
|
||||||
|
matchMetric(tokens.emValue, 'em');
|
||||||
}
|
}
|
||||||
|
|
||||||
function matchPixel() {
|
function matchMetric(pattern, metric) {
|
||||||
var captures = scan(tokens.pixelValue);
|
var captures = scan(pattern);
|
||||||
if (captures) {
|
if (captures) {
|
||||||
return {
|
return {
|
||||||
type: 'px',
|
type: metric,
|
||||||
value: captures[1]
|
value: captures[1]
|
||||||
};
|
};
|
||||||
}
|
}
|
||||||
|
|
|
@ -39,44 +39,44 @@ describe('gradient-parser.js', function () {
|
||||||
expect(typeof gradientParser).to.equal('function');
|
expect(typeof gradientParser).to.equal('function');
|
||||||
});
|
});
|
||||||
|
|
||||||
describe('when parsing wrong definition should throw an error', function() {
|
describe('error cases', function() {
|
||||||
it('when there\'s one more comma in definitions', function() {
|
it('one more comma in definitions', function() {
|
||||||
expect(function() {
|
expect(function() {
|
||||||
gradientParser('linear-gradient(red, blue),');
|
gradientParser('linear-gradient(red, blue),');
|
||||||
}).to.throwException(/One extra comma/);
|
}).to.throwException(/One extra comma/);
|
||||||
});
|
});
|
||||||
|
|
||||||
it('when there\'s one more comma in colors', function() {
|
it('one more comma in colors', function() {
|
||||||
expect(function() {
|
expect(function() {
|
||||||
gradientParser('linear-gradient(red, blue,)');
|
gradientParser('linear-gradient(red, blue,)');
|
||||||
}).to.throwException(/Expected color definition/);
|
}).to.throwException(/Expected color definition/);
|
||||||
});
|
});
|
||||||
|
|
||||||
it('when there\'s invalid input', function() {
|
it('invalid input', function() {
|
||||||
expect(function() {
|
expect(function() {
|
||||||
gradientParser('linear-gradient(red, blue) aaa');
|
gradientParser('linear-gradient(red, blue) aaa');
|
||||||
}).to.throwException(/Invalid input not EOF/);
|
}).to.throwException(/Invalid input not EOF/);
|
||||||
});
|
});
|
||||||
|
|
||||||
it('when there\'s missing open call', function() {
|
it('missing open call', function() {
|
||||||
expect(function() {
|
expect(function() {
|
||||||
gradientParser('linear-gradient red, blue');
|
gradientParser('linear-gradient red, blue');
|
||||||
}).to.throwException(/Missing \(/);
|
}).to.throwException(/Missing \(/);
|
||||||
});
|
});
|
||||||
|
|
||||||
it('when there\'s missing comma before color stops', function() {
|
it('missing comma before color stops', function() {
|
||||||
expect(function() {
|
expect(function() {
|
||||||
gradientParser('linear-gradient(to right red, blue)');
|
gradientParser('linear-gradient(to right red, blue)');
|
||||||
}).to.throwException(/Missing comma before color stops/);
|
}).to.throwException(/Missing comma before color stops/);
|
||||||
});
|
});
|
||||||
|
|
||||||
it('when there\'s missing color stops', function() {
|
it('missing color stops', function() {
|
||||||
expect(function() {
|
expect(function() {
|
||||||
gradientParser('linear-gradient(to right, )');
|
gradientParser('linear-gradient(to right, )');
|
||||||
}).to.throwException(/Expected color definition/);
|
}).to.throwException(/Expected color definition/);
|
||||||
});
|
});
|
||||||
|
|
||||||
it('when there\'s missing closing call', function() {
|
it('missing closing call', function() {
|
||||||
expect(function() {
|
expect(function() {
|
||||||
gradientParser('linear-gradient(to right, red, blue aaa');
|
gradientParser('linear-gradient(to right, red, blue aaa');
|
||||||
}).to.throwException(/Missing \)/);
|
}).to.throwException(/Missing \)/);
|
||||||
|
@ -132,20 +132,22 @@ describe('gradient-parser.js', function () {
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
||||||
describe('parse an definition with full color stop', function() {
|
['px', 'em', '%'].forEach(function(metric) {
|
||||||
beforeEach(function() {
|
describe('parse color stop for metric '+ metric, function() {
|
||||||
ast = gradientParser('linear-gradient(blue 10px, transparent)');
|
|
||||||
subject = ast[0];
|
|
||||||
});
|
|
||||||
|
|
||||||
describe('the first color', function() {
|
|
||||||
beforeEach(function() {
|
beforeEach(function() {
|
||||||
subject = subject.colorStops[0];
|
ast = gradientParser('linear-gradient(blue 10' + metric + ', transparent)');
|
||||||
|
subject = ast[0];
|
||||||
});
|
});
|
||||||
|
|
||||||
it('should have the length', function() {
|
describe('the first color', function() {
|
||||||
expect(subject.length.type).to.equal('px');
|
beforeEach(function() {
|
||||||
expect(subject.length.value).to.equal('10');
|
subject = subject.colorStops[0];
|
||||||
|
});
|
||||||
|
|
||||||
|
it('should have the length', function() {
|
||||||
|
expect(subject.length.type).to.equal(metric);
|
||||||
|
expect(subject.length.value).to.equal('10');
|
||||||
|
});
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
Loading…
Reference in a new issue