276ed71f31
Migrated from design-system-swarm with fresh git history.
Old project history preserved in /home/overbits/apps/design-system-swarm
Core components:
- MCP Server (Python FastAPI with mcp 1.23.1)
- Claude Plugin (agents, commands, skills, strategies, hooks, core)
- DSS Backend (dss-mvp1 - token translation, Figma sync)
- Admin UI (Node.js/React)
- Server (Node.js/Express)
- Storybook integration (dss-mvp1/.storybook)
Self-contained configuration:
- All paths relative or use DSS_BASE_PATH=/home/overbits/dss
- PYTHONPATH configured for dss-mvp1 and dss-claude-plugin
- .env file with all configuration
- Claude plugin uses ${CLAUDE_PLUGIN_ROOT} for portability
Migration completed: $(date)
🤖 Clean migration with full functionality preserved
130 lines
4.5 KiB
Python
130 lines
4.5 KiB
Python
"""Integration tests for Style Dictionary wrapper"""
|
|
|
|
import pytest
|
|
from pathlib import Path
|
|
from dss.tools.style_dictionary import StyleDictionaryWrapper
|
|
from dss.themes import get_default_light_theme
|
|
|
|
|
|
@pytest.mark.integration
|
|
class TestStyleDictionaryIntegration:
|
|
"""Test Style Dictionary integration"""
|
|
|
|
def test_convert_tokens_to_css_vars(self):
|
|
"""Test converting DSS theme to CSS custom properties"""
|
|
theme = get_default_light_theme()
|
|
sd = StyleDictionaryWrapper()
|
|
|
|
css_output = sd.convert_tokens_to_css_vars(theme)
|
|
|
|
# Check that CSS output is valid
|
|
assert ":root {" in css_output
|
|
assert "--background:" in css_output
|
|
assert "--primary:" in css_output
|
|
assert "--space-md:" in css_output
|
|
assert "}" in css_output
|
|
|
|
def test_convert_theme_to_sd_format(self):
|
|
"""Test converting DSS theme to Style Dictionary format"""
|
|
theme = get_default_light_theme()
|
|
sd = StyleDictionaryWrapper()
|
|
|
|
sd_format = sd._convert_theme_to_sd_format(theme)
|
|
|
|
# Check structure
|
|
assert "color" in sd_format
|
|
assert "spacing" in sd_format
|
|
assert "radius" in sd_format
|
|
assert "typography" in sd_format
|
|
|
|
# Check color tokens
|
|
assert "background" in sd_format["color"]
|
|
assert "primary" in sd_format["color"]
|
|
assert sd_format["color"]["primary"]["value"] == "oklch(0.65 0.18 250)"
|
|
|
|
# Check spacing tokens
|
|
assert "space-md" in sd_format["spacing"]
|
|
assert sd_format["spacing"]["space-md"]["value"] == "16px"
|
|
|
|
def test_create_sd_config_css(self):
|
|
"""Test creating Style Dictionary config for CSS output"""
|
|
sd = StyleDictionaryWrapper()
|
|
build_path = Path("/tmp/test")
|
|
|
|
config = sd._create_sd_config("css", build_path)
|
|
|
|
assert "source" in config
|
|
assert "platforms" in config
|
|
assert "css" in config["platforms"]
|
|
assert config["platforms"]["css"]["transformGroup"] == "css"
|
|
assert config["platforms"]["css"]["files"][0]["format"] == "css/variables"
|
|
|
|
def test_create_sd_config_scss(self):
|
|
"""Test creating Style Dictionary config for SCSS output"""
|
|
sd = StyleDictionaryWrapper()
|
|
build_path = Path("/tmp/test")
|
|
|
|
config = sd._create_sd_config("scss", build_path)
|
|
|
|
assert "scss" in config["platforms"]
|
|
assert config["platforms"]["scss"]["transformGroup"] == "scss"
|
|
assert config["platforms"]["scss"]["files"][0]["format"] == "scss/variables"
|
|
|
|
def test_create_sd_config_json(self):
|
|
"""Test creating Style Dictionary config for JSON output"""
|
|
sd = StyleDictionaryWrapper()
|
|
build_path = Path("/tmp/test")
|
|
|
|
config = sd._create_sd_config("json", build_path)
|
|
|
|
assert "json" in config["platforms"]
|
|
assert config["platforms"]["json"]["files"][0]["format"] == "json/nested"
|
|
|
|
@pytest.mark.slow
|
|
def test_transform_theme_to_css(self):
|
|
"""Test full transformation to CSS (requires npm)"""
|
|
theme = get_default_light_theme()
|
|
sd = StyleDictionaryWrapper()
|
|
|
|
result = sd.transform_theme(theme, output_format="css")
|
|
|
|
# Check result structure
|
|
assert "success" in result
|
|
assert "output_format" in result
|
|
assert result["output_format"] == "css"
|
|
|
|
# If style-dictionary is installed, check output
|
|
if result["success"]:
|
|
assert "files" in result
|
|
assert "theme.css" in result["files"]
|
|
css_content = result["files"]["theme.css"]
|
|
assert "--" in css_content # CSS variables
|
|
|
|
def test_css_var_naming_convention(self):
|
|
"""Test that CSS variable names follow kebab-case convention"""
|
|
theme = get_default_light_theme()
|
|
sd = StyleDictionaryWrapper()
|
|
|
|
css_output = sd.convert_tokens_to_css_vars(theme)
|
|
|
|
# Check naming conventions
|
|
assert "--space-md:" in css_output
|
|
assert "--radius-sm:" in css_output
|
|
assert "--text-base:" in css_output
|
|
|
|
# Should not have camelCase or underscores
|
|
assert "spacemd" not in css_output.lower()
|
|
assert "space_md" not in css_output
|
|
|
|
def test_css_output_includes_comments(self):
|
|
"""Test that CSS output includes token descriptions as comments"""
|
|
theme = get_default_light_theme()
|
|
sd = StyleDictionaryWrapper()
|
|
|
|
css_output = sd.convert_tokens_to_css_vars(theme)
|
|
|
|
# Check for comments
|
|
assert "/*" in css_output
|
|
assert "Main background color" in css_output
|
|
assert "Primary brand color" in css_output
|