Skip to content

Commit 4d25f8f

Browse files
committed
test: add tests for color
1 parent 61c99fd commit 4d25f8f

File tree

1 file changed

+60
-2
lines changed

1 file changed

+60
-2
lines changed

lib/parsers.test.js

Lines changed: 60 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -224,6 +224,47 @@ describe('parseString', () => {
224224
it.todo('test');
225225
});
226226
describe('parseColor', () => {
227+
it('returns undefined for invalid values', () => {
228+
const invalid = [
229+
'invalid',
230+
'#ffz',
231+
'#1',
232+
'#12',
233+
'#12345',
234+
'#1234567',
235+
'#123456789',
236+
'rg(0, 0, 0)',
237+
'rgbo(0, 0, 0)',
238+
'rgb(0, 0)',
239+
'rgb(0, 0 0)',
240+
'rgb(0%, 0, 0)',
241+
'rgb(0, 1deg, 1px)',
242+
'rgba(0, 1deg, 1px, invalid)',
243+
'rgba(0 0 0 0)',
244+
'rgba(0, 0, 0 / 0)',
245+
'hs(0, 0, 0)',
246+
'hslo(0, 0, 0)',
247+
'hsl(0, 0)',
248+
'hsl(0, 0 0)',
249+
'hsl(0%, 0, 0)',
250+
'hsl(0, 1deg, 1px)',
251+
'hsla(0, 1deg, 1px, invalid)',
252+
'hsla(0 0 0 0)',
253+
'hsla(0, 0, 0 / 0)',
254+
];
255+
invalid.forEach(input => expect(parsers.parseColor(input)).toBeUndefined());
256+
});
257+
it('resolves with lowercased color name or function name', () => {
258+
expect(parsers.parseColor('RED')).toBe('red');
259+
expect(parsers.parseColor('RGb(0, 0, 0)')).toBe('rgb(0, 0, 0)');
260+
});
261+
it('should convert hex to rgba values', () => {
262+
expect(parsers.parseColor('#F00')).toBe('rgb(255, 0, 0)');
263+
expect(parsers.parseColor('#0f06')).toBe('rgba(0, 255, 0, 0.4)');
264+
expect(parsers.parseColor('#0000ff')).toBe('rgb(0, 0, 255)');
265+
expect(parsers.parseColor('#ff00ffff')).toBe('rgb(255, 0, 255)');
266+
expect(parsers.parseColor('#ff00ff66')).toBe('rgba(255, 0, 255, 0.4)');
267+
});
227268
it('should convert hsl to rgb values', () => {
228269
let input = 'hsla(0, 1%, 2%)';
229270
let output = parsers.parseColor(input);
@@ -236,8 +277,25 @@ describe('parseColor', () => {
236277

237278
expect(output).toEqual('rgba(5, 5, 5, 0.5)');
238279
});
239-
240-
it.todo('Add more tests');
280+
it('clamps overflowing rgb values', () => {
281+
expect(parsers.parseColor('rgb(300, 300, 300, 2)')).toBe('rgb(255, 255, 255)');
282+
expect(parsers.parseColor('rgb(-1, -1, -1, -1)')).toBe('rgba(0, 0, 0, 0)');
283+
expect(parsers.parseColor('hsl(540, 100%, 50%)')).toBe('rgb(0, 255, 255)');
284+
expect(parsers.parseColor('hsla(400, 200%, 200%, 200%)')).toBe('rgb(255, 255, 255)');
285+
expect(parsers.parseColor('hsla(-20deg, -1%, -1%, -1%)')).toBe('rgba(0, 0, 0, 0)');
286+
});
287+
it('preserves precision', () => {
288+
expect(parsers.parseColor('rgba(245.5, 245.5, 0, 50.1%)')).toBe('rgba(246, 246, 0, 0.5)');
289+
expect(parsers.parseColor('rgba(245.5, 245.5, 0, 49.9%)')).toBe('rgba(246, 246, 0, 0.498)');
290+
});
291+
it('works with calc()', () => {
292+
expect(parsers.parseColor('rgb(calc(0 + 255), 0, calc(0 + calc(0 + 255)))')).toBe(
293+
'rgb(255, 0, 255)'
294+
);
295+
expect(parsers.parseColor('hsl(calc(0 + 300), 100%, calc(0% + calc(0% + 50%)))')).toBe(
296+
'rgb(255, 0, 255)'
297+
);
298+
});
241299
});
242300
describe('dashedToCamelCase', () => {
243301
it.todo('test');

0 commit comments

Comments
 (0)