@@ -224,6 +224,47 @@ describe('parseString', () => {
224224 it . todo ( 'test' ) ;
225225} ) ;
226226describe ( '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} ) ;
242300describe ( 'dashedToCamelCase' , ( ) => {
243301 it . todo ( 'test' ) ;
0 commit comments