color-cleaner/tests/cleanerService.test.js

A CLI tool to clean and consolidate colors in your project files.

import { getHexColors, consolidateColors } from '../lib/cleanerService.js';

describe('getHexColors', () => {
    test('converts colors to hex format', () => {
        const input = [
            { color: 'rgb(255, 0, 0)', lineNumber: 1, currentPath: 'file1.css' },
            { color: 'blue', lineNumber: 2, currentPath: 'file1.css' },
            { color: 'transparent', lineNumber: 3, currentPath: 'file1.css' }
        ];

        const result = getHexColors(input);

        expect(result).toEqual([
            { color: '#ff0000', lineNumber: 1, currentPath: 'file1.css' },
            { color: '#0000ff', lineNumber: 2, currentPath: 'file1.css' },
            { color: '#00000000', lineNumber: 3, currentPath: 'file1.css' }
        ]);
    });
});

describe('consolidateColors', () => {
    test('groups similar colors together', () => {
        const input = [
            { color: '#ff0000', lineNumber: 1, currentPath: 'file1.css' },
            { color: '#ff0101', lineNumber: 2, currentPath: 'file1.css' },
            { color: '#0000ff', lineNumber: 3, currentPath: 'file1.css' }
        ];

        const result = consolidateColors(input, 10);

        expect(result).toHaveLength(2);
        expect(result[0].items).toHaveLength(2);
        expect(result[1].items).toHaveLength(1);
        expect(result[0].color).toBe('#ff0000');
        expect(result[1].color).toBe('#0000ff');
    });

    test('handles empty input', () => {
        const result = consolidateColors([]);
        expect(result).toEqual([]);
    });

    test('respects threshold parameter', () => {
        const input = [
            { color: '#ff0000', lineNumber: 1, currentPath: 'file1.css' },
            { color: '#ff0101', lineNumber: 2, currentPath: 'file1.css' },
            { color: '#ff0202', lineNumber: 3, currentPath: 'file1.css' }
        ];

        const result = consolidateColors(input, 1);

        expect(result).toHaveLength(3);
        result.forEach(group => {
            expect(group.items).toHaveLength(1);
        });
    });

    test('groups identical colors together', () => {
        const input = [
            { color: '#ff0000', lineNumber: 1, currentPath: 'file1.css' },
            { color: '#ff0000', lineNumber: 2, currentPath: 'file1.css' },
            { color: '#ff0000', lineNumber: 3, currentPath: 'file1.css' }
        ];

        const result = consolidateColors(input, 10);

        expect(result).toHaveLength(1);
        expect(result[0].items).toHaveLength(3);
        expect(result[0].color).toBe('#ff0000');
    });

    test('keeps very different colors separate', () => {
        const input = [
            { color: '#ff0000', lineNumber: 1, currentPath: 'file1.css' },
            { color: '#00ff00', lineNumber: 2, currentPath: 'file1.css' },
            { color: '#0000ff', lineNumber: 3, currentPath: 'file1.css' }
        ];

        const result = consolidateColors(input, 10);

        expect(result).toHaveLength(3);
        result.forEach(group => {
            expect(group.items).toHaveLength(1);
        });
    });

    test('handles mix of similar and different colors', () => {
        const input = [
            { color: '#ff0000', lineNumber: 1, currentPath: 'file1.css' },
            { color: '#ff0101', lineNumber: 2, currentPath: 'file1.css' },
            { color: '#00ff00', lineNumber: 3, currentPath: 'file1.css' },
            { color: '#00fe00', lineNumber: 4, currentPath: 'file1.css' },
            { color: '#0000ff', lineNumber: 5, currentPath: 'file1.css' }
        ];

        const result = consolidateColors(input, 10);

        expect(result).toHaveLength(3);
        expect(result[0].items).toHaveLength(2);
        expect(result[1].items).toHaveLength(2);
        expect(result[2].items).toHaveLength(1);
    });

    test('handles very small threshold', () => {
        const input = [
            { color: '#ff0000', lineNumber: 1, currentPath: 'file1.css' },
            { color: '#ff0001', lineNumber: 2, currentPath: 'file1.css' }
        ];

        const result = consolidateColors(input, 0.1);

        expect(result).toHaveLength(2);
        result.forEach(group => {
            expect(group.items).toHaveLength(1);
        });
    });

    test('handles large number of colors with varying similarities', () => {
        const input = [
            { color: '#ff0000', lineNumber: 1, currentPath: 'file1.css' },
            { color: '#ff0101', lineNumber: 2, currentPath: 'file1.css' },
            { color: '#ff0202', lineNumber: 3, currentPath: 'file1.css' },
            { color: '#00ff00', lineNumber: 4, currentPath: 'file1.css' },
            { color: '#00fe00', lineNumber: 5, currentPath: 'file1.css' },
            { color: '#00fd00', lineNumber: 6, currentPath: 'file1.css' },
            { color: '#0000ff', lineNumber: 7, currentPath: 'file1.css' },
            { color: '#0001ff', lineNumber: 8, currentPath: 'file1.css' },
            { color: '#0002ff', lineNumber: 9, currentPath: 'file1.css' },
            { color: '#ff0000', lineNumber: 10, currentPath: 'file1.css' }
        ];

        const result = consolidateColors(input, 5);

        expect(result.length).toBeGreaterThan(1);
        expect(result.length).toBeLessThan(10);
        result.forEach(group => {
            expect(group.items.length).toBeGreaterThan(0);
        });
    });

    test('higher threshold results in fewer color groups', () => {
        const input = [
            { color: '#ff0000', lineNumber: 1, currentPath: 'file1.css' },
            { color: '#ff0101', lineNumber: 2, currentPath: 'file1.css' },
            { color: '#ff0202', lineNumber: 3, currentPath: 'file1.css' },
            { color: '#00ff00', lineNumber: 4, currentPath: 'file1.css' },
            { color: '#00fe00', lineNumber: 5, currentPath: 'file1.css' },
            { color: '#00fd00', lineNumber: 6, currentPath: 'file1.css' },
            { color: '#0000ff', lineNumber: 7, currentPath: 'file1.css' },
            { color: '#0001ff', lineNumber: 8, currentPath: 'file1.css' },
            { color: '#0002ff', lineNumber: 9, currentPath: 'file1.css' },
            { color: '#ff0000', lineNumber: 10, currentPath: 'file1.css' },
            { color: '#ff0101', lineNumber: 11, currentPath: 'file1.css' },
            { color: '#ff0202', lineNumber: 12, currentPath: 'file1.css' },
            { color: '#00ff00', lineNumber: 13, currentPath: 'file1.css' },
            { color: '#00fe00', lineNumber: 14, currentPath: 'file1.css' },
            { color: '#00fd00', lineNumber: 15, currentPath: 'file1.css' }
        ];

        const lowThresholdResult = consolidateColors(input, 1);
        const highThresholdResult = consolidateColors(input, 441);

        expect(lowThresholdResult.length).toBeGreaterThan(highThresholdResult.length);
    });

    test('lower threshold results in more color groups', () => {
        const input = [
            { color: '#ff0000', lineNumber: 1, currentPath: 'file1.css' },
            { color: '#ff0101', lineNumber: 2, currentPath: 'file1.css' },
            { color: '#ff0202', lineNumber: 3, currentPath: 'file1.css' },
            { color: '#00ff00', lineNumber: 4, currentPath: 'file1.css' },
            { color: '#00fe00', lineNumber: 5, currentPath: 'file1.css' },
            { color: '#00fd00', lineNumber: 6, currentPath: 'file1.css' },
            { color: '#0000ff', lineNumber: 7, currentPath: 'file1.css' },
            { color: '#0001ff', lineNumber: 8, currentPath: 'file1.css' },
            { color: '#0002ff', lineNumber: 9, currentPath: 'file1.css' },
            { color: '#ff0000', lineNumber: 10, currentPath: 'file1.css' },
            { color: '#ff0101', lineNumber: 11, currentPath: 'file1.css' },
            { color: '#ff0202', lineNumber: 12, currentPath: 'file1.css' },
            { color: '#00ff00', lineNumber: 13, currentPath: 'file1.css' },
            { color: '#00fe00', lineNumber: 14, currentPath: 'file1.css' },
            { color: '#00fd00', lineNumber: 15, currentPath: 'file1.css' }
        ];

        const result1 = consolidateColors(input, 1);
        const result2 = consolidateColors(input, 200);
        const result3 = consolidateColors(input, 441);

        expect(result1.length).toBeGreaterThan(result2.length);
        expect(result2.length).toBeGreaterThan(result3.length);
    });

});