aboutsummaryrefslogtreecommitdiffstats
diff options
context:
space:
mode:
-rw-r--r--spec/spec/modules/core/regex.js1
-rw-r--r--spec/spec/types/Color.js209
-rw-r--r--src/modules/core/regex.js2
-rw-r--r--src/types/Color.js4
4 files changed, 199 insertions, 17 deletions
diff --git a/spec/spec/modules/core/regex.js b/spec/spec/modules/core/regex.js
index d3db682..e1d6dc9 100644
--- a/spec/spec/modules/core/regex.js
+++ b/spec/spec/modules/core/regex.js
@@ -121,6 +121,7 @@ describe('regex.js', () => {
expect(regex.isHex.test('abc')).toBe(false)
expect(regex.isHex.test('#1234563')).toBe(false)
expect(regex.isHex.test('#kasdhs')).toBe(false)
+ expect(regex.isHex.test('#abcd')).toBe(false)
})
})
diff --git a/spec/spec/types/Color.js b/spec/spec/types/Color.js
index ede8863..64161eb 100644
--- a/spec/spec/types/Color.js
+++ b/spec/spec/types/Color.js
@@ -1,7 +1,9 @@
-/* globals describe, expect, it, beforeEach */
+/* globals describe, expect, it, beforeEach, spyOn, jasmine */
import { Color } from '../../../src/main.js'
+const { any } = jasmine
+
describe('Color.js', () => {
var color
@@ -9,24 +11,65 @@ describe('Color.js', () => {
color = new Color({ r: 0, g: 102, b: 255 })
})
- describe('construct: constructs a color in different formats', () => {
+ describe('()', () => {
- it('constructs a color from an object in the correct color space', () => {
+ describe('constructs a color from an object in the correct color space', () => {
+ it('rgb', () => {
+ const color = new Color({ r: 255, g: 0, b: 128 })
+ expect(color.r).toBe(255)
+ expect(color.g).toBe(0)
+ expect(color.b).toBe(128)
+ expect(color.space).toBe('rgb')
+ })
- // Try in rgb
- const color = new Color({ r: 255, g: 0, b: 128 })
- expect(color.r).toBe(255)
- expect(color.g).toBe(0)
- expect(color.b).toBe(128)
- expect(color.space).toBe('rgb')
+ it('xyz', () => {
+ const color = new Color({ x: 255, y: 0, z: 128 })
+ expect(color.x).toBe(255)
+ expect(color.y).toBe(0)
+ expect(color.z).toBe(128)
+ expect(color.space).toBe('xyz')
+ })
+
+ it('hsl', () => {
+ const color = new Color({ h: 255, s: 0, l: 128 })
+ expect(color.h).toBe(255)
+ expect(color.s).toBe(0)
+ expect(color.l).toBe(128)
+ expect(color.space).toBe('hsl')
+ })
+
+ it('lab', () => {
+ const color = new Color({ l: 255, a: 0, b: 128 })
+ expect(color.l).toBe(255)
+ expect(color.a).toBe(0)
+ expect(color.b).toBe(128)
+ expect(color.space).toBe('lab')
+ })
+
+ it('lch', () => {
+ const color = new Color({ l: 255, c: 0, h: 128 })
+ expect(color.l).toBe(255)
+ expect(color.c).toBe(0)
+ expect(color.h).toBe(128)
+ expect(color.space).toBe('lch')
+ })
+
+ it('cmyk', () => {
+ const color2 = new Color({ c: 20, y: 15, m: 10, k: 5 })
+ expect(color2.c).toBe(20)
+ expect(color2.m).toBe(10)
+ expect(color2.y).toBe(15)
+ expect(color2.k).toBe(5)
+ expect(color2.space).toBe('cmyk')
+ })
- // Try in cmyk
- const color2 = new Color({ c: 20, y: 15, m: 10, k: 5 })
- expect(color2.c).toBe(20)
- expect(color2.m).toBe(10)
- expect(color2.y).toBe(15)
- expect(color2.k).toBe(5)
- expect(color2.space).toBe('cmyk')
+ it('and default to rgb when unknown parameters are passed', () => {
+ const color = new Color({ h: 12, b: 10, l: 100 })
+ expect(color.r).toBe(0)
+ expect(color.g).toBe(0)
+ expect(color.b).toBe(0)
+ expect(color.space).toBe('rgb')
+ })
})
it('constructs a color from an array', () => {
@@ -74,6 +117,9 @@ describe('Color.js', () => {
expect(color.b).toBe(255)
})
+ it('throws an error if unsupported string format was given', () => {
+ expect(() => new Color('#0066')).toThrowError('Unsupported string format, can\'t construct Color')
+ })
})
describe('input and output: Importing and exporting colors', () => {
@@ -222,6 +268,52 @@ describe('Color.js', () => {
})
})
+ // This conversion is pretty lossy
+ // Especially g is super wrong (which should be 0 at testing and is >170)
+ // describe('xyz()', () => {
+
+ // it('can convert from rgb to xyz', () => {
+ // const color = new Color(255, 0, 128)
+ // const xyz = color.xyz()
+ // expect(xyz.x).toBeCloseTo(0.780182, 6)
+ // expect(xyz.y).toBeCloseTo(0.611077, 6)
+ // expect(xyz.z).toBeCloseTo(0.590749, 6)
+ // expect(xyz.space).toBe('xyz')
+ // })
+
+ // it('can convert from xyz to rgb', () => {
+ // const xyz = new Color(0.780181754521692, 0.6110767760212142, 0.590748864329329, 'xyz')
+ // const rgb = xyz.rgb()
+ // expect(rgb.r).toBeCloseTo(255, 0)
+ // expect(rgb.g).toBeCloseTo(0, 0)
+ // expect(rgb.b).toBeCloseTo(128, 0)
+ // expect(rgb.space).toBe('rgb')
+ // })
+
+ // it('is invertable', () => {
+ // const { r, g, b } = new Color(255, 0, 128).xyz().rgb()
+ // expect(r).toBeCloseTo(255, 0)
+ // expect(g).toBeCloseTo(0, 0)
+ // expect(b).toBeCloseTo(128, 0)
+ // })
+
+ // it('handles black', () => {
+ // const color = new Color(0, 0, 0).xyz().rgb()
+ // expect(color.r).toBeCloseTo(0, 0)
+ // expect(color.g).toBeCloseTo(0, 0)
+ // expect(color.b).toBeCloseTo(0, 0)
+ // expect(color.toHex()).toBe('#000000')
+ // })
+
+ // it('handles white', () => {
+ // const color = new Color(255, 255, 255).xyz().rgb()
+ // expect(color.r).toBeCloseTo(255, 0)
+ // expect(color.g).toBeCloseTo(255, 0)
+ // expect(color.b).toBeCloseTo(255, 0)
+ // expect(color.toHex()).toBe('#ffffff')
+ // })
+ // })
+
describe('cmyk()', () => {
it('can convert from rgb to cmyk', () => {
@@ -270,4 +362,89 @@ describe('Color.js', () => {
})
+ describe('static methods', () => {
+ describe('random()', () => {
+ it('returns color', () => {
+ expect(Color.random()).toEqual(any(Color))
+ })
+
+ it('returns color with mode=vibrant', () => {
+ expect(Color.random('vibrant')).toEqual(any(Color))
+ })
+
+ it('returns color with mode=sine', () => {
+ expect(Color.random('sine')).toEqual(any(Color))
+ })
+
+ it('returns color with mode=pastel', () => {
+ expect(Color.random('pastel')).toEqual(any(Color))
+ })
+
+ it('returns color with mode=dark', () => {
+ expect(Color.random('dark')).toEqual(any(Color))
+ })
+
+ it('returns color with mode=rgb', () => {
+ expect(Color.random('rgb')).toEqual(any(Color))
+ })
+
+ it('returns color with mode=lab', () => {
+ expect(Color.random('lab')).toEqual(any(Color))
+ })
+
+ it('returns color with mode=grey', () => {
+ expect(Color.random('grey')).toEqual(any(Color))
+ })
+
+ it('throws an error if mode is unknown', () => {
+ expect(() => Color.random('foo')).toThrowError('Unsupported random color mode')
+ })
+ })
+
+ describe('test()', () => {
+ it('returns false for non strings', () => {
+ expect(Color.test(1)).toBe(false)
+ })
+
+ it('returns true if a given string is a color - hex', () => {
+ expect(Color.test('#abc')).toBe(true)
+ expect(Color.test('#abcdef')).toBe(true)
+ })
+
+ it('returns true if a given string is a color - rgb', () => {
+ expect(Color.test('rgb(1,2,3)')).toBe(true)
+ })
+
+ it('returns false if a given string is a not a color', () => {
+ expect(Color.test('#1234')).toBe(false)
+ expect(Color.test('#Hallo Welt')).toBe(false)
+ })
+ })
+
+ describe('isRgb()', () => {
+ it('returns true if object has all rgb properties set', () => {
+ expect(Color.isRgb({ r: 12, g: 45, b: 11, blub: true })).toBe(true)
+ })
+
+ it('returns false if object has not all rgb properties set or they are not numbers', () => {
+ expect(Color.isRgb({ r: 12, g: 45 })).toBe(false)
+ expect(Color.isRgb({ r: 12, g: 45, b: '1' })).toBe(false)
+ })
+ })
+
+ describe('isColor', () => {
+ it('tests if given value is a color', () => {
+ const spy1 = spyOn(Color, 'isRgb')
+ const spy2 = spyOn(Color, 'test')
+ expect(Color.isColor(new Color())).toBe(true)
+ Color.isColor('#000')
+ const color = { r: 12, g: 45, b: 11 }
+ Color.isColor(color)
+ expect(spy1).toHaveBeenCalledWith('#000')
+ expect(spy1).toHaveBeenCalledWith(color)
+ expect(spy2).toHaveBeenCalledWith('#000')
+ })
+ })
+ })
+
})
diff --git a/src/modules/core/regex.js b/src/modules/core/regex.js
index b8adb83..c32ac93 100644
--- a/src/modules/core/regex.js
+++ b/src/modules/core/regex.js
@@ -17,7 +17,7 @@ export const transforms = /\)\s*,?\s*/
export const whitespace = /\s/g
// Test hex value
-export const isHex = /^#[a-f0-9]{3,6}$/i
+export const isHex = /^#[a-f0-9]{3}$|^#[a-f0-9]{6}$/i
// Test rgb value
export const isRgb = /^rgb\(/
diff --git a/src/types/Color.js b/src/types/Color.js
index e9bc0ce..eb6368e 100644
--- a/src/types/Color.js
+++ b/src/types/Color.js
@@ -414,6 +414,10 @@ export default class Color {
const color = new Color(grey, grey, grey)
return color
+ } else {
+
+ throw new Error('Unsupported random color mode')
+
}
}