@bookklik/senangstart-css 0.2.8 → 0.2.10

package/tests/unit/core/tokenizer-core.test.js

@@ -0,0 +1,102 @@
+/**
+ * SenangStart CSS - Tokenizer Core Unit Tests
+ */
+
+import { describe, it } from 'node:test';
+import assert from 'node:assert';
+import { tokenize, isValidToken } from '../../../src/core/tokenizer-core.js';
+
+describe('Tokenizer Core', () => {
+
+  describe('isValidToken', () => {
+
+    it('returns false for missing property', () => {
+      assert.strictEqual(isValidToken({ value: 'val' }), false);
+    });
+
+    it('returns false for non-string property', () => {
+      assert.strictEqual(isValidToken({ property: 123, value: 'val' }), false);
+    });
+
+    it('returns false for too long property', () => {
+      assert.strictEqual(isValidToken({ property: 'a'.repeat(101), value: 'val' }), false);
+    });
+
+    it('returns false for non-string value', () => {
+      assert.strictEqual(isValidToken({ property: 'prop', value: 123 }), false);
+    });
+
+    it('returns false for too long value', () => {
+      assert.strictEqual(isValidToken({ property: 'prop', value: 'a'.repeat(501) }), false);
+    });
+
+    it('returns false for invalid breakpoint', () => {
+      assert.strictEqual(isValidToken({ property: 'prop', value: 'val', breakpoint: 'unknown' }), false);
+    });
+
+    it('returns false for invalid state', () => {
+      assert.strictEqual(isValidToken({ property: 'prop', value: 'val', state: 'unknown' }), false);
+    });
+
+    it('returns true for valid minimal token', () => {
+      assert.strictEqual(isValidToken({ property: 'prop', value: 'val' }), true);
+    });
+
+    it('returns true for valid full token', () => {
+      assert.strictEqual(isValidToken({ 
+        property: 'prop', 
+        value: 'val', 
+        breakpoint: 'tab', 
+        state: 'hover' 
+      }), true);
+    });
+
+    it('returns true for null value', () => {
+      assert.strictEqual(isValidToken({ property: 'prop', value: null }), true);
+    });
+  });
+
+  describe('tokenize - Validation Edge Cases', () => {
+
+    it('returns error for non-string raw input', () => {
+      const token = tokenize(123, 'space');
+      assert.strictEqual(token.error, 'Invalid token format');
+    });
+
+    it('returns error for empty raw input', () => {
+      const token = tokenize('', 'space');
+      assert.strictEqual(token.error, 'Invalid token format');
+    });
+
+    it('returns error for too long raw input', () => {
+      const token = tokenize('a'.repeat(201), 'space');
+      assert.strictEqual(token.error, 'Invalid token format');
+    });
+
+    it('returns error for invalid token structure', () => {
+      // unknown:bg:white -> unknown is not a breakpoint, so it becomes property 'unknown'
+      // but if we force an invalid state or something
+      const token = tokenize('unknown:state:prop:val', 'space');
+      // wait, tokenize doesn't throw on unknown prefixes unless validated by isValidToken
+      // if parts[0] is not a breakpoint, it's not shifted.
+      
+      const invalidToken = tokenize('prop:val:too:many:parts', 'space');
+      // This will still be a valid token structure but might not be what's expected.
+      
+      // Force isValidToken to fail by using a reserved word that isn't a breakpoint or state in a prefix position
+      // but since tokenize logic only checks BREAKPOINTS.includes(parts[0]), it defaults to property.
+      
+      // Let's test a case where it results in an invalid token structure
+      const longProp = 'a'.repeat(101);
+      const tokenLong = tokenize(`${longProp}:val`, 'space');
+      assert.strictEqual(tokenLong.error, 'Invalid token structure');
+    });
+
+    it('handles single part tokens for space/visual attributes', () => {
+      const token = tokenize('single', 'space');
+      assert.strictEqual(token.property, 'single');
+      assert.strictEqual(token.value, 'single');
+    });
+  });
+
+});

package/tests/unit/definitions/index.test.js

@@ -0,0 +1,108 @@
+import { describe, it } from 'node:test';
+import assert from 'node:assert';
+import {
+  getAllDefinitions,
+  getDefinitionsByCategory,
+  getDefinition,
+  validateDefinitions,
+  buildAllMaps
+} from '../../../src/definitions/index.js';
+
+describe('Utility Definitions Index', () => {
+  describe('getAllDefinitions', () => {
+    it('returns a flat array of all definitions', () => {
+      const allDefs = getAllDefinitions();
+      assert.ok(Array.isArray(allDefs));
+      assert.ok(allDefs.length > 0);
+      // Verify some known definitions are present
+      const names = allDefs.map(d => d.name);
+      assert.ok(names.includes('display'));
+      assert.ok(names.includes('padding'));
+      assert.ok(names.includes('text-color'));
+      assert.ok(names.includes('background-color'));
+    });
+  });
+
+  describe('getDefinitionsByCategory', () => {
+    it('returns definitions grouped by category', () => {
+      const byCategory = getDefinitionsByCategory();
+      assert.ok(byCategory.layout);
+      assert.ok(byCategory.space);
+      assert.ok(byCategory.visual);
+      assert.ok(Array.isArray(byCategory.layout));
+      assert.ok(Array.isArray(byCategory.space));
+      assert.ok(Array.isArray(byCategory.visual));
+    });
+  });
+
+  describe('getDefinition', () => {
+    it('returns a specific definition by name', () => {
+      const def = getDefinition('display');
+      assert.strictEqual(def.name, 'display');
+      assert.strictEqual(def.category, 'layout');
+    });
+
+    it('returns null for unknown definitions', () => {
+      const def = getDefinition('nonexistent-definition');
+      assert.strictEqual(def, null);
+    });
+  });
+
+  describe('validateDefinitions', () => {
+    it('validates that all definitions are complete', () => {
+      const result = validateDefinitions();
+      assert.strictEqual(result.valid, true);
+      assert.strictEqual(result.errors.length, 0);
+    });
+
+    it('reports missing fields', () => {
+      const brokenDefs = [
+        { name: 'broken' } // Missing property, description, descriptionMs, category
+      ];
+      const result = validateDefinitions(brokenDefs);
+      assert.strictEqual(result.valid, false);
+      assert.ok(result.errors.some(e => e.includes("Missing 'property'")));
+      assert.ok(result.errors.some(e => e.includes("Missing 'description'")));
+      assert.ok(result.errors.some(e => e.includes("Missing 'descriptionMs'")));
+      assert.ok(result.errors.some(e => e.includes("Missing 'category'")));
+    });
+
+    it('reports unknown name for missing fields if name is missing', () => {
+      const brokenDefs = [
+        { property: 'test' } // Missing name
+      ];
+      const result = validateDefinitions(brokenDefs);
+      assert.ok(result.errors.some(e => e.includes("in definition 'unknown'")));
+    });
+
+    it('reports missing examples', () => {
+      const brokenDefs = [
+        {
+          name: 'no-examples',
+          property: 'test',
+          description: 'test',
+          descriptionMs: 'test',
+          category: 'test',
+          examples: []
+        }
+      ];
+      const result = validateDefinitions(brokenDefs);
+      assert.strictEqual(result.valid, false);
+      assert.ok(result.errors.some(e => e.includes("Missing examples in definition 'no-examples'")));
+    });
+  });
+
+  describe('buildAllMaps', () => {
+    it('builds all CSS generator maps', () => {
+      const maps = buildAllMaps();
+      assert.ok(maps.layoutMap);
+      assert.ok(maps.spacePropertyMap);
+      assert.ok(maps.typographyKeywords);
+      
+      // Check for some expected values
+      assert.strictEqual(maps.layoutMap['flex'], 'display: flex;');
+      assert.strictEqual(maps.spacePropertyMap['p'], 'padding: var(--s-{value});');
+      assert.ok(maps.typographyKeywords['italic'] !== undefined);
+    });
+  });
+});

package/tests/unit/definitions/layout_definitions.test.js

@@ -0,0 +1,40 @@
+import { describe, it } from 'node:test';
+import assert from 'node:assert';
+import { buildLayoutMap } from '../../../src/definitions/layout.js';
+
+describe('Layout Definitions', () => {
+  describe('buildLayoutMap', () => {
+    it('builds a map of layout values to CSS', () => {
+      const map = buildLayoutMap();
+      assert.ok(typeof map === 'object');
+      // Check for some common layout values
+      assert.strictEqual(map['flex'], 'display: flex;');
+      assert.strictEqual(map['grid'], 'display: grid;');
+      assert.strictEqual(map['hidden'], 'display: none;');
+    });
+
+    it('skips range values like "1-12"', () => {
+      const map = buildLayoutMap();
+      // Values like '1-12' (used in grid-cols etc) should be skipped by buildLayoutMap
+      // as they are handled by dynamic generators or special syntax
+      assert.strictEqual(map['1-12'], undefined);
+    });
+
+    it('skips mocked range values to hit coverage', () => {
+      const mockDefinitions = {
+        test: {
+          name: 'test',
+          syntax: 'layout="["',
+          dynamic: false,
+          values: [
+            { value: '1-5', css: 'test: {n};' },
+            { value: 'normal', css: 'test: normal;' }
+          ]
+        }
+      };
+      const map = buildLayoutMap(mockDefinitions);
+      assert.strictEqual(map['1-5'], undefined);
+      assert.strictEqual(map['normal'], 'test: normal;');
+    });
+  });
+});

package/tests/unit/utils/common.test.js

@@ -0,0 +1,26 @@
+import { describe, it } from 'node:test';
+import assert from 'node:assert';
+import { sanitizeValue } from '../../../src/utils/common.js';
+
+describe('Common Utilities', () => {
+  describe('sanitizeValue', () => {
+    it('returns empty string for non-string input', () => {
+      // @ts-ignore
+      assert.strictEqual(sanitizeValue(null), '');
+      // @ts-ignore
+      assert.strictEqual(sanitizeValue(undefined), '');
+      // @ts-ignore
+      assert.strictEqual(sanitizeValue(123), '');
+      // @ts-ignore
+      assert.strictEqual(sanitizeValue({}), '');
+    });
+
+    it('sanitizes dangerous characters', () => {
+      assert.strictEqual(sanitizeValue('color: red;'), 'color: red_');
+    });
+
+    it('returns the same string if no dangerous characters are present', () => {
+      assert.strictEqual(sanitizeValue('red-500'), 'red-500');
+    });
+  });
+});

package/scripts/bundle-jit.js

@@ -1,45 +0,0 @@
-#!/usr/bin/env node
-
-/**
- * Bundle JIT Runtime with esbuild
- * Bundles src/cdn/senangstart-engine.js into a self-contained IIFE for browser use
- */
-
-import * as esbuild from 'esbuild';
-import { dirname, join } from 'path';
-import { fileURLToPath } from 'url';
-
-const __dirname = dirname(fileURLToPath(import.meta.url));
-const root = join(__dirname, '..');
-
-console.log('📦 Bundling JIT runtime...');
-
-// Build unminified version
-await esbuild.build({
-  entryPoints: [join(root, 'src', 'cdn', 'senangstart-engine.js')],
-  bundle: true,
-  format: 'iife',
-  outfile: join(root, 'dist', 'senangstart-css.js'),
-  minify: false,
-  banner: {
-    js: '/* SenangStart CSS - JIT Runtime v0.2.0 | MIT License */'
-  }
-});
-
-console.log('✓ Created dist/senangstart-css.js');
-
-// Build minified version
-await esbuild.build({
-  entryPoints: [join(root, 'src', 'cdn', 'senangstart-engine.js')],
-  bundle: true,
-  format: 'iife',
-  outfile: join(root, 'dist', 'senangstart-css.min.js'),
-  minify: true,
-  banner: {
-    js: '/* SenangStart CSS v0.2.0 | MIT */'
-  }
-});
-
-console.log('✓ Created dist/senangstart-css.min.js');
-console.log('');
-console.log('📦 Bundle complete!');