@shohojdhara/atomix 0.5.0 → 0.5.1

package/scripts/cli/__tests__/token-manager.test.js

@@ -1,251 +0,0 @@
-/**
- * Token Manager Tests
- */
-
-import { describe, it, expect, beforeEach, afterEach, vi } from 'vitest';
-import { 
-  listTokens,
-  validateTokens,
-  exportTokens,
-  importTokens,
-  fixTokens,
-  setProjectRoot
-} from '../token-manager.js';
-import { mkdtemp, rm, writeFile, readFile, mkdir } from 'fs/promises';
-import { join } from 'path';
-import { tmpdir } from 'os';
-
-// Mock dependencies
-vi.mock('ora', () => ({
-  default: vi.fn(() => ({
-    start: vi.fn(() => ({
-      succeed: vi.fn(),
-      fail: vi.fn(),
-      text: ''
-    }))
-  }))
-}));
-
-vi.mock('chalk', () => ({
-  default: {
-    green: vi.fn((text) => text),
-    red: vi.fn((text) => text),
-    yellow: vi.fn((text) => text),
-    cyan: vi.fn((text) => text),
-    gray: vi.fn((text) => text),
-    bold: vi.fn((obj) => obj)
-  }
-}));
-
-describe('Token Manager', () => {
-  let tempDir;
-  let tokenDir;
-
-  beforeEach(async () => {
-    const tmp = await mkdtemp(join(tmpdir(), 'atomix-test-'));
-    // Ensure absolute path
-    // On some systems/configs tmpdir might return symlinked path or weirdness
-    const { resolve } = await import('path');
-    tempDir = resolve(tmp);
-    
-    tokenDir = join(tempDir, 'src', 'styles', '01-settings');
-    await mkdir(tokenDir, { recursive: true });
-    setProjectRoot(tempDir);
-  });
-
-  afterEach(async () => {
-    setProjectRoot('');
-    await rm(tempDir, { recursive: true, force: true });
-    vi.clearAllMocks();
-  });
-
-  describe('listTokens', () => {
-    it('should list tokens from valid files', async () => {
-      // Create test token files
-      await writeFile(join(tokenDir, '_settings.colors.scss'), `
-$primary-500: #7AFFD7 !default;
-$secondary-500: #FF5733 !default;
---atomix-color-primary: #7AFFD7;
---atomix-color-secondary: #FF5733;
-      `);
-
-      const result = await listTokens();
-      
-      expect(result.tokens).toHaveProperty('colors');
-      // Check keys inside the category object
-      const colorTokens = result.tokens.colors.tokens;
-      expect(colorTokens).toHaveProperty('$primary-500');
-      expect(colorTokens).toHaveProperty('--atomix-color-primary');
-    });
-
-    it('should handle missing files gracefully', async () => {
-      const result = await listTokens();
-      expect(result.tokens).toEqual({});
-      expect(result.categoryCount).toBe(0);
-    });
-  });
-
-  describe('validateTokens', () => {
-    it('should detect hardcoded colors', async () => {
-      await writeFile(join(tokenDir, '_settings.colors.scss'), `
-$primary: #ffffff !default;
-$secondary: #000000 !default;
-background: #ff0000; // Hardcoded color
-      `);
-
-      const result = await validateTokens();
-      
-      expect(result.warnings).toContainEqual(
-        expect.objectContaining({
-          category: 'hardcoded-value',
-          file: expect.stringContaining('_settings.colors.scss')
-        })
-      );
-    });
-
-    it('should detect missing !default flags', async () => {
-      await writeFile(join(tokenDir, '_settings.colors.scss'), `
-$primary: #7AFFD7; // Missing !default
-$secondary: #FF5733 !default;
-      `);
-
-      const result = await validateTokens();
-      
-      expect(result.issues).toContainEqual(
-        expect.objectContaining({
-          category: 'missing-default',
-          file: expect.stringContaining('_settings.colors.scss')
-        })
-      );
-    });
-
-    it('should validate naming conventions', async () => {
-      await writeFile(join(tokenDir, '_settings.colors.scss'), `
-$Invalid-Name: #7AFFD7 !default;
-$valid_name: #FF5733 !default;
-      `);
-
-      const result = await validateTokens();
-      
-      expect(result.issues).toContainEqual(
-        expect.objectContaining({
-          category: 'naming-convention',
-          file: expect.stringContaining('_settings.colors.scss')
-        })
-      );
-    });
-  });
-
-  describe('exportTokens', () => {
-    it('should export tokens as JSON', async () => {
-      await writeFile(join(tokenDir, '_settings.colors.scss'), `
-$primary-500: #7AFFD7 !default;
---atomix-color-primary: #7AFFD7;
-      `);
-
-      const outputPath = join(tempDir, 'tokens.json');
-      await exportTokens('json', outputPath);
-
-      const exported = JSON.parse(await readFile(outputPath, 'utf8'));
-      expect(exported).toHaveProperty('colors');
-      expect(exported.colors).toHaveProperty('$primary-500');
-    });
-
-    it('should export tokens as CSS custom properties', async () => {
-      await writeFile(join(tokenDir, '_settings.colors.scss'), `
-$primary-500: #7AFFD7 !default;
---atomix-color-primary: #7AFFD7;
-      `);
-
-      const outputPath = join(tempDir, 'tokens.css');
-      await exportTokens('css', outputPath);
-
-      const css = await readFile(outputPath, 'utf8');
-      expect(css).toContain('--atomix-color-primary: #7AFFD7');
-    });
-
-    it('should export tokens as TypeScript', async () => {
-      await writeFile(join(tokenDir, '_settings.colors.scss'), `
-$primary-500: #7AFFD7 !default;
---atomix-color-primary: #7AFFD7;
-      `);
-
-      const outputPath = join(tempDir, 'tokens.ts');
-      await exportTokens('ts', outputPath);
-
-      const ts = await readFile(outputPath, 'utf8');
-      expect(ts).toContain('export interface');
-      expect(ts).toContain('AtomixTokens');
-    });
-  });
-
-  describe('importTokens', () => {
-    it('should import tokens from JSON', async () => {
-      const jsonPath = join(tempDir, 'tokens.json');
-      await writeFile(jsonPath, JSON.stringify({
-        colors: {
-          '$primary-500': '#7AFFD7',
-          '--atomix-color-primary': '#7AFFD7'
-        }
-      }));
-
-      await importTokens(jsonPath);
-
-      // Verify the tokens were written to SCSS files
-      const colorsFile = await readFile(join(tokenDir, '_settings.colors.scss'), 'utf8');
-      expect(colorsFile).toContain('$primary-500: #7AFFD7 !default');
-      expect(colorsFile).toContain('--atomix-color-primary: #7AFFD7');
-    });
-
-    it('should import tokens from JavaScript', async () => {
-      const jsPath = join(tempDir, 'tokens.js');
-      await writeFile(jsPath, `
-export const tokens = {
-  colors: {
-    '$primary-500': '#7AFFD7',
-    '--atomix-color-primary': '#7AFFD7'
-  }
-};
-      `);
-
-      await importTokens(jsPath);
-
-      const colorsFile = await readFile(join(tokenDir, '_settings.colors.scss'), 'utf8');
-      expect(colorsFile).toContain('$primary-500: #7AFFD7 !default');
-    });
-
-    it('should handle malformed JSON gracefully', async () => {
-      const jsonPath = join(tempDir, 'invalid.json');
-      await writeFile(jsonPath, '{ invalid json }');
-
-      await expect(importTokens(jsonPath)).rejects.toThrow();
-    });
-  });
-
-  describe('fixTokens', () => {
-    it('should add missing !default flags', async () => {
-      await writeFile(join(tokenDir, '_settings.colors.scss'), `
-$primary: #7AFFD7;
-$secondary: #FF5733 !default;
-      `);
-
-      await fixTokens();
-
-      const content = await readFile(join(tokenDir, '_settings.colors.scss'), 'utf8');
-      expect(content).toContain('$primary: var(--atomix-color-primary) !default');
-    });
-
-    it('should convert hardcoded colors to variables', async () => {
-      await writeFile(join(tokenDir, '_settings.colors.scss'), `
-$primary: #7AFFD7 !default;
-background: #ffffff;
-      `);
-
-      await fixTokens();
-
-      const content = await readFile(join(tokenDir, '_settings.colors.scss'), 'utf8');
-      // Should replace hardcoded colors with variables
-      expect(content).toContain('var(--atomix-color-text)');
-    });
-  });
-});

package/scripts/cli/__tests__/token-provider.test.js

@@ -1,361 +0,0 @@
-/**
- * Token Provider & Validator Tests
- * Tests for Phase 1: Enhanced Design Token Integration
- */
-
-import { describe, it, expect, beforeEach } from 'vitest';
-import { 
-  TokenProvider, 
-  TOKEN_FORMATS, 
-  TOKEN_CATEGORIES,
-  tokenProvider 
-} from '../internal/tokens/token-provider.js';
-import { 
-  TokenValidator, 
-  VALIDATION_RULES, 
-  SEVERITY,
-  tokenValidator 
-} from '../internal/tokens/token-validator.js';
-
-describe('TokenProvider', () => {
-  let provider;
-
-  beforeEach(() => {
-    provider = new TokenProvider();
-  });
-
-  describe('Initialization', () => {
-    it('should create a new TokenProvider instance', () => {
-      expect(provider).toBeInstanceOf(TokenProvider);
-    });
-
-    it('should have default options', () => {
-      expect(provider.tokenPath).toBe('./design-tokens');
-      expect(provider.format).toBe(TOKEN_FORMATS.JSON);
-      expect(provider.tokens).toEqual({});
-    });
-
-    it('should accept custom options', () => {
-      const customProvider = new TokenProvider({
-        tokenPath: './custom-tokens',
-        format: TOKEN_FORMATS.CSS
-      });
-      
-      expect(customProvider.tokenPath).toBe('./custom-tokens');
-      expect(customProvider.format).toBe(TOKEN_FORMATS.CSS);
-    });
-  });
-
-  describe('Token Loading', () => {
-    it('should throw error when file not found', async () => {
-      await expect(provider.loadTokens('./non-existent.json'))
-        .rejects
-        .toThrow('Token file not found');
-    });
-
-    it('should categorize tokens correctly', () => {
-      const categorizeToken = provider.categorizeToken.bind(provider);
-      
-      expect(categorizeToken('color-primary')).toBe(TOKEN_CATEGORIES.COLOR);
-      expect(categorizeToken('space-sm')).toBe(TOKEN_CATEGORIES.SPACING);
-      expect(categorizeToken('font-size-lg')).toBe(TOKEN_CATEGORIES.TYPOGRAPHY);
-      expect(categorizeToken('shadow-md')).toBe(TOKEN_CATEGORIES.SHADOW);
-      expect(categorizeToken('radius-lg')).toBe(TOKEN_CATEGORIES.RADIUS);
-      expect(categorizeToken('duration-fast')).toBe(TOKEN_CATEGORIES.ANIMATION);
-    });
-
-    it('should infer token types from values', () => {
-      const inferTokenType = provider.inferTokenType.bind(provider);
-      
-      expect(inferTokenType('#ff0000')).toBe('color');
-      expect(inferTokenType('rgb(255, 0, 0)')).toBe('color');
-      expect(inferTokenType('hsl(0, 100%, 50%)')).toBe('color');
-      expect(inferTokenType('16px')).toBe('dimension');
-      expect(inferTokenType('1rem')).toBe('dimension');
-      expect(inferTokenType('300ms')).toBe('duration');
-      expect(inferTokenType('0.5s')).toBe('duration');
-      expect(inferTokenType(42)).toBe('number');
-    });
-  });
-
-  describe('Token Merging', () => {
-    it('should merge multiple token sets', () => {
-      const existing = {
-        color: { primary: { value: '#000' } },
-        spacing: { sm: { value: '8px' } }
-      };
-      
-      const newTokens = {
-        color: { secondary: { value: '#fff' } },
-        typography: { base: { value: '16px' } }
-      };
-      
-      const merged = provider.mergeTokens(existing, newTokens);
-      
-      expect(merged.color.primary).toBeDefined();
-      expect(merged.color.secondary).toBeDefined();
-      expect(merged.spacing.sm).toBeDefined();
-      expect(merged.typography.base).toBeDefined();
-    });
-  });
-
-  describe('Token Export', () => {
-    beforeEach(() => {
-      provider.tokens = {
-        color: {
-          primary: { value: '#007bff', type: 'color' },
-          secondary: { value: '#6c757d', type: 'color' }
-        },
-        spacing: {
-          sm: { value: '8px', type: 'dimension' },
-          lg: { value: '16px', type: 'dimension' }
-        }
-      };
-    });
-
-    it('should export to JSON format', () => {
-      const json = provider.exportTokens(TOKEN_FORMATS.JSON, { pretty: false });
-      const parsed = JSON.parse(json);
-      
-      expect(parsed.color.primary.value).toBe('#007bff');
-      expect(parsed.spacing.lg.value).toBe('16px');
-    });
-
-    it('should export to CSS custom properties', () => {
-      const css = provider.exportTokens(TOKEN_FORMATS.CSS, { 
-        selector: ':root',
-        prefix: 'atomix'
-      });
-      
-      expect(css).toContain(':root {');
-      expect(css).toContain('--atomix-color-primary: #007bff;');
-      expect(css).toContain('--atomix-spacing-lg: 16px;');
-    });
-
-    it('should export to W3C DTCG format', () => {
-      const dtcg = provider.exportTokens(TOKEN_FORMATS.W3C_DTCG);
-      
-      expect(dtcg.$schema).toBe('https://design-tokens.org/schema.json');
-      expect(dtcg.tokens.color.primary.value).toBe('#007bff');
-    });
-  });
-});
-
-describe('TokenValidator', () => {
-  let validator;
-
-  beforeEach(() => {
-    validator = new TokenValidator();
-  });
-
-  describe('Initialization', () => {
-    it('should create a new TokenValidator instance', () => {
-      expect(validator).toBeInstanceOf(TokenValidator);
-    });
-
-    it('should register all built-in rules', () => {
-      expect(validator.rules.size).toBeGreaterThan(0);
-      expect(validator.rules.has('COLOR_CONTRAST')).toBe(true);
-      expect(validator.rules.has('SEMANTIC_NAMING')).toBe(true);
-      expect(validator.rules.has('NO_HARDCODED_COLORS')).toBe(true);
-    });
-
-    it('should have all rules enabled by default', () => {
-      expect(validator.enabledRules.length).toBeGreaterThan(0);
-    });
-  });
-
-  describe('Validation Rules', () => {
-    it('should validate color contrast', () => {
-      const tokens = {
-        color: {
-          text: { value: '#999999' },
-          background: { value: '#ffffff' }
-        }
-      };
-      
-      const result = validator.validate(tokens);
-      
-      // Low contrast should be flagged
-      const contrastIssue = result.issues.find(i => i.rule === 'color-contrast');
-      expect(contrastIssue).toBeDefined();
-      expect(contrastIssue.severity).toBe(SEVERITY.ERROR);
-    });
-
-    it('should detect semantic naming issues', () => {
-      const tokens = {
-        color: {
-          blue: { value: '#0000ff' },
-          red: { value: '#ff0000' }
-        }
-      };
-      
-      const result = validator.validate(tokens);
-      
-      const namingIssue = result.issues.find(i => i.rule === 'semantic-naming');
-      expect(namingIssue).toBeDefined();
-      expect(namingIssue.severity).toBe(SEVERITY.WARNING);
-    });
-
-    it('should pass semantic naming for brand colors', () => {
-      const tokens = {
-        color: {
-          brandBlue: { value: '#0000ff' },
-          primaryRed: { value: '#ff0000' }
-        }
-      };
-      
-      const result = validator.validate(tokens);
-      
-      // Filter out token-completeness warnings which are expected
-      const namingIssue = result.issues.find(i => i.rule === 'semantic-naming');
-      // Should not flag brand colors or primary/secondary prefixed colors
-      expect(namingIssue).toBeUndefined();
-    });
-
-    it('should detect hardcoded colors in code', () => {
-      const codeContent = `
-        const styles = {
-          color: '#ff0000',
-          backgroundColor: 'rgb(0, 123, 255)',
-          borderColor: 'hsl(120, 100%, 50%)'
-        };
-      `;
-      
-      const result = validator.validate({}, { codeContent });
-      
-      const hardcodedIssue = result.issues.find(i => i.rule === 'no-hardcoded-colors');
-      expect(hardcodedIssue).toBeDefined();
-      expect(hardcodedIssue.matches).toHaveLength(3);
-    });
-
-    it('should validate token completeness', () => {
-      const tokens = {
-        color: { primary: { value: '#000' } }
-        // Missing spacing and typography
-      };
-      
-      const result = validator.validate(tokens);
-      
-      const completenessIssues = result.issues.filter(i => i.rule === 'token-completeness');
-      expect(completenessIssues.length).toBeGreaterThan(0);
-    });
-
-    it('should detect duplicate tokens', () => {
-      const tokens = {
-        color: {
-          primary: { value: '#007bff' },
-          main: { value: '#007bff' }
-        },
-        spacing: {
-          sm: { value: '8px' },
-          small: { value: '8px' }
-        }
-      };
-      
-      const result = validator.validate(tokens);
-      
-      const duplicateIssues = result.issues.filter(i => i.rule === 'duplicate-detection');
-      expect(duplicateIssues.length).toBeGreaterThan(0);
-    });
-  });
-
-  describe('Rule Management', () => {
-    it('should toggle rules on/off', () => {
-      const initialCount = validator.enabledRules.length;
-      
-      validator.toggleRule('COLOR_CONTRAST', false);
-      expect(validator.enabledRules).not.toContain('COLOR_CONTRAST');
-      
-      validator.toggleRule('COLOR_CONTRAST', true);
-      expect(validator.enabledRules).toContain('COLOR_CONTRAST');
-    });
-
-    it('should allow registering custom rules', () => {
-      const customRule = {
-        name: 'custom-rule',
-        description: 'Custom validation rule',
-        severity: SEVERITY.INFO,
-        validate: (tokens) => []
-      };
-      
-      validator.registerRule('CUSTOM_RULE', customRule);
-      
-      expect(validator.rules.has('CUSTOM_RULE')).toBe(true);
-    });
-
-    it('should reject invalid rules', () => {
-      expect(() => {
-        validator.registerRule('INVALID', { name: 'test' });
-      }).toThrow('must have name, validate, and severity');
-    });
-  });
-
-  describe('Validation Report', () => {
-    it('should generate formatted report', () => {
-      const tokens = {
-        color: {
-          lowContrast: { value: '#ccc' },
-          background: { value: '#fff' }
-        }
-      };
-      
-      const result = validator.validate(tokens);
-      const report = validator.getReport(result);
-      
-      expect(report).toContain('Token Validation Report');
-      expect(report).toContain('Status:');
-      expect(report).toContain('Summary:');
-      expect(report).toContain('Errors:');
-    });
-  });
-});
-
-describe('Integration Tests', () => {
-  it('should load and validate tokens together', async () => {
-    const provider = new TokenProvider();
-    const validator = new TokenValidator();
-    
-    // Simulate loading tokens
-    provider.tokens = {
-      color: {
-        primary: { value: '#007bff', type: 'color' },
-        success: { value: '#22c55e', type: 'color' }
-      },
-      spacing: {
-        4: { value: '1rem', type: 'dimension' },
-        8: { value: '2rem', type: 'dimension' }
-      }
-    };
-    
-    const tokens = provider.getAllTokens();
-    const result = validator.validate(tokens);
-    
-    expect(result).toBeDefined();
-    expect(typeof result.valid).toBe('boolean');
-    expect(result.summary).toBeDefined();
-  });
-
-  it('should validate component with loaded tokens', () => {
-    const provider = new TokenProvider();
-    const validator = new TokenValidator();
-    
-    provider.tokens = {
-      color: {
-        primary: { value: '#007bff' }
-      }
-    };
-    
-    const cleanCode = `
-      const Component = () => {
-        return <div style={{ color: 'var(--color-primary)' }} />;
-      };
-    `;
-    
-    const result = validator.validateComponent(cleanCode, provider.getAllTokens());
-    
-    // Should not have hardcoded color errors
-    const hardcodedIssue = result.issues.find(i => i.rule === 'no-hardcoded-colors');
-    expect(hardcodedIssue).toBeUndefined();
-  });
-});