jamey/berrypod
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects 1 Releases Wiki Activity

fix: resolve compilation warnings and update tests to match implementation

Browse Source 
- Remove unused generate_mood/1, generate_typography/1, generate_shape/1,
  generate_density/1 functions from CSSGenerator (now handled via CSS
  data attributes)
- Prefix unused _opts parameters in Printify.Client
- Remove unused created_products variable from MockupGenerator
- Update CSSGeneratorTest to test actual generated CSS (accent colors,
  font size scale, layout width, etc.)
- Update PresetsTest to match 8 presets (not 9)
- Fix PreviewDataTest to accept local image paths
- Update ThemeLiveTest to use correct selectors and match actual UI
This commit is contained in:
Jamey Greenwood
2026-01-15 22:36:15 +00:00
parent 974d91ce33
commit d4dbd8998f
10 changed files with 807 additions and 344 deletions
Download Patch File Download Diff File Expand all files Collapse all files

230
test/simpleshop_theme/theme/css_generator_test.exs
View File

@@ -16,118 +16,6 @@ defmodule SimpleshopTheme.Theme.CSSGeneratorTest do
assert css =~ "--t-accent-l:"
end
test "generates correct mood variables for neutral" do
settings = %ThemeSettings{mood: "neutral"}
css = CSSGenerator.generate(settings)
assert css =~ "--t-surface-base: #ffffff"
assert css =~ "--t-text-primary: #171717"
assert css =~ "--t-border-default: #e5e5e5"
end
test "generates correct mood variables for dark" do
settings = %ThemeSettings{mood: "dark"}
css = CSSGenerator.generate(settings)
assert css =~ "--t-surface-base: #0a0a0a"
assert css =~ "--t-text-primary: #fafafa"
assert css =~ "--t-border-default: #262626"
assert css =~ "--p-shadow-strength: 0.25"
end
test "generates correct mood variables for warm" do
settings = %ThemeSettings{mood: "warm"}
css = CSSGenerator.generate(settings)
assert css =~ "--t-surface-base: #fdf8f3"
assert css =~ "--t-text-primary: #1c1917"
end
test "generates correct mood variables for cool" do
settings = %ThemeSettings{mood: "cool"}
css = CSSGenerator.generate(settings)
assert css =~ "--t-surface-base: #f4f7fb"
assert css =~ "--t-text-primary: #0f172a"
end
test "generates correct typography for clean" do
settings = %ThemeSettings{typography: "clean"}
css = CSSGenerator.generate(settings)
assert css =~ "--t-font-heading: var(--p-font-inter)"
assert css =~ "--t-font-body: var(--p-font-inter)"
assert css =~ "--t-heading-weight: 600"
end
test "generates correct typography for editorial" do
settings = %ThemeSettings{typography: "editorial"}
css = CSSGenerator.generate(settings)
assert css =~ "--t-font-heading: var(--p-font-fraunces)"
assert css =~ "--t-font-body: var(--p-font-source)"
end
test "generates correct typography for modern" do
settings = %ThemeSettings{typography: "modern"}
css = CSSGenerator.generate(settings)
assert css =~ "--t-font-heading: var(--p-font-space)"
assert css =~ "--t-heading-weight: 500"
end
test "generates correct shape for sharp" do
settings = %ThemeSettings{shape: "sharp"}
css = CSSGenerator.generate(settings)
assert css =~ "--t-radius-button: 0"
assert css =~ "--t-radius-card: 0"
end
test "generates correct shape for soft" do
settings = %ThemeSettings{shape: "soft"}
css = CSSGenerator.generate(settings)
assert css =~ "--t-radius-button: var(--p-radius-md)"
assert css =~ "--t-radius-card: var(--p-radius-lg)"
end
test "generates correct shape for round" do
settings = %ThemeSettings{shape: "round"}
css = CSSGenerator.generate(settings)
assert css =~ "--t-radius-button: var(--p-radius-lg)"
assert css =~ "--t-radius-card: var(--p-radius-xl)"
end
test "generates correct shape for pill" do
settings = %ThemeSettings{shape: "pill"}
css = CSSGenerator.generate(settings)
assert css =~ "--t-radius-button: var(--p-radius-full)"
end
test "generates correct density for spacious" do
settings = %ThemeSettings{density: "spacious"}
css = CSSGenerator.generate(settings)
assert css =~ "--t-density: 1.25"
end
test "generates correct density for balanced" do
settings = %ThemeSettings{density: "balanced"}
css = CSSGenerator.generate(settings)
assert css =~ "--t-density: 1"
end
test "generates correct density for compact" do
settings = %ThemeSettings{density: "compact"}
css = CSSGenerator.generate(settings)
assert css =~ "--t-density: 0.85"
end
test "converts hex colors to HSL" do
settings = %ThemeSettings{accent_color: "#ff0000"}
css = CSSGenerator.generate(settings)
@@ -138,6 +26,26 @@ defmodule SimpleshopTheme.Theme.CSSGeneratorTest do
assert css =~ "--t-accent-l: 50%"
end
test "handles blue accent color" do
settings = %ThemeSettings{accent_color: "#0000ff"}
css = CSSGenerator.generate(settings)
# Blue should be H=240, S=100%, L=50%
assert css =~ "--t-accent-h: 240"
assert css =~ "--t-accent-s: 100%"
assert css =~ "--t-accent-l: 50%"
end
test "handles green accent color" do
settings = %ThemeSettings{accent_color: "#00ff00"}
css = CSSGenerator.generate(settings)
# Green should be H=120, S=100%, L=50%
assert css =~ "--t-accent-h: 120"
assert css =~ "--t-accent-s: 100%"
assert css =~ "--t-accent-l: 50%"
end
test "includes secondary colors" do
settings = %ThemeSettings{
secondary_accent_color: "#ea580c",
@@ -149,5 +57,103 @@ defmodule SimpleshopTheme.Theme.CSSGeneratorTest do
assert css =~ "--t-secondary-accent: #ea580c"
assert css =~ "--t-sale-color: #dc2626"
end
test "generates font size scale for small" do
settings = %ThemeSettings{font_size: "small"}
css = CSSGenerator.generate(settings)
assert css =~ "--t-font-size-scale: 1.125"
end
test "generates font size scale for medium" do
settings = %ThemeSettings{font_size: "medium"}
css = CSSGenerator.generate(settings)
assert css =~ "--t-font-size-scale: 1.1875"
end
test "generates font size scale for large" do
settings = %ThemeSettings{font_size: "large"}
css = CSSGenerator.generate(settings)
assert css =~ "--t-font-size-scale: 1.25"
end
test "generates heading weight override for regular" do
settings = %ThemeSettings{heading_weight: "regular"}
css = CSSGenerator.generate(settings)
assert css =~ "--t-heading-weight-override: 400"
end
test "generates heading weight override for bold" do
settings = %ThemeSettings{heading_weight: "bold"}
css = CSSGenerator.generate(settings)
assert css =~ "--t-heading-weight-override: 700"
end
test "generates layout width for contained" do
settings = %ThemeSettings{layout_width: "contained"}
css = CSSGenerator.generate(settings)
assert css =~ "--t-layout-max-width: 1100px"
end
test "generates layout width for wide" do
settings = %ThemeSettings{layout_width: "wide"}
css = CSSGenerator.generate(settings)
assert css =~ "--t-layout-max-width: 1400px"
end
test "generates layout width for full" do
settings = %ThemeSettings{layout_width: "full"}
css = CSSGenerator.generate(settings)
assert css =~ "--t-layout-max-width: 100%"
end
test "generates button style for filled" do
settings = %ThemeSettings{button_style: "filled"}
css = CSSGenerator.generate(settings)
assert css =~ "--t-button-style: filled"
end
test "generates button style for outline" do
settings = %ThemeSettings{button_style: "outline"}
css = CSSGenerator.generate(settings)
assert css =~ "--t-button-style: outline"
end
test "generates product text alignment" do
settings = %ThemeSettings{product_text_align: "center"}
css = CSSGenerator.generate(settings)
assert css =~ "--t-product-text-align: center"
end
test "generates image aspect ratio for square" do
settings = %ThemeSettings{image_aspect_ratio: "square"}
css = CSSGenerator.generate(settings)
assert css =~ "--t-image-aspect-ratio: 1 / 1"
end
test "generates image aspect ratio for portrait" do
settings = %ThemeSettings{image_aspect_ratio: "portrait"}
css = CSSGenerator.generate(settings)
assert css =~ "--t-image-aspect-ratio: 3 / 4"
end
test "generates image aspect ratio for landscape" do
settings = %ThemeSettings{image_aspect_ratio: "landscape"}
css = CSSGenerator.generate(settings)
assert css =~ "--t-image-aspect-ratio: 4 / 3"
end
end
end

24
test/simpleshop_theme/theme/presets_test.exs
View File

@@ -4,11 +4,11 @@ defmodule SimpleshopTheme.Theme.PresetsTest do
alias SimpleshopTheme.Theme.Presets
describe "all/0" do
test "returns all 9 presets" do
test "returns all 8 presets" do
presets = Presets.all()
assert is_map(presets)
assert map_size(presets) == 9
assert map_size(presets) == 8
assert Map.has_key?(presets, :gallery)
assert Map.has_key?(presets, :studio)
assert Map.has_key?(presets, :boutique)
@@ -17,7 +17,6 @@ defmodule SimpleshopTheme.Theme.PresetsTest do
assert Map.has_key?(presets, :minimal)
assert Map.has_key?(presets, :night)
assert Map.has_key?(presets, :classic)
assert Map.has_key?(presets, :impulse)
end
end
@@ -74,8 +73,8 @@ defmodule SimpleshopTheme.Theme.PresetsTest do
test "returns minimal preset" do
preset = Presets.get(:minimal)
assert preset.mood == "cool"
assert preset.typography == "minimal"
assert preset.mood == "neutral"
assert preset.typography == "impulse"
assert preset.shape == "sharp"
assert preset.accent_color == "#171717"
end
@@ -96,18 +95,6 @@ defmodule SimpleshopTheme.Theme.PresetsTest do
assert preset.accent_color == "#166534"
end
test "returns impulse preset with extended settings" do
preset = Presets.get(:impulse)
assert preset.mood == "neutral"
assert preset.typography == "impulse"
assert preset.shape == "sharp"
assert preset.accent_color == "#000000"
assert preset.font_size == "medium"
assert preset.heading_weight == "regular"
assert preset.product_text_align == "center"
end
test "returns nil for nonexistent preset" do
assert Presets.get(:nonexistent) == nil
end
@@ -118,7 +105,7 @@ defmodule SimpleshopTheme.Theme.PresetsTest do
names = Presets.list_names()
assert is_list(names)
assert length(names) == 9
assert length(names) == 8
assert :gallery in names
assert :studio in names
assert :boutique in names
@@ -127,7 +114,6 @@ defmodule SimpleshopTheme.Theme.PresetsTest do
assert :minimal in names
assert :night in names
assert :classic in names
assert :impulse in names
end
end
end

7
test/simpleshop_theme/theme/preview_data_test.exs
View File

@@ -45,11 +45,14 @@ defmodule SimpleshopTheme.Theme.PreviewDataTest do
for product <- products do
assert is_binary(product.image_url)
assert String.starts_with?(product.image_url, "http")
# Images can be either local paths (starting with /) or full URLs
assert String.starts_with?(product.image_url, "/") or
String.starts_with?(product.image_url, "http")
if product.hover_image_url do
assert is_binary(product.hover_image_url)
assert String.starts_with?(product.hover_image_url, "http")
assert String.starts_with?(product.hover_image_url, "/") or
String.starts_with?(product.hover_image_url, "http")
end
end
end

47
test/simpleshop_theme_web/live/theme_live_test.exs
View File

@@ -29,12 +29,11 @@ defmodule SimpleshopThemeWeb.ThemeLiveTest do
test "renders theme editor page", %{conn: conn} do
{:ok, _view, html} = live(conn, ~p"/admin/theme")
assert html =~ "Theme Editor"
assert html =~ "Save Theme"
assert html =~ "Presets"
assert html =~ "Theme Studio"
assert html =~ "preset"
end
test "displays all 9 presets", %{conn: conn} do
test "displays all 8 presets", %{conn: conn} do
{:ok, _view, html} = live(conn, ~p"/admin/theme")
assert html =~ "gallery"
@@ -45,7 +44,6 @@ defmodule SimpleshopThemeWeb.ThemeLiveTest do
assert html =~ "minimal"
assert html =~ "night"
assert html =~ "classic"
assert html =~ "impulse"
end
test "displays current theme settings", %{conn: conn} do
@@ -61,10 +59,9 @@ defmodule SimpleshopThemeWeb.ThemeLiveTest do
test "displays generated CSS in preview", %{conn: conn} do
{:ok, _view, html} = live(conn, ~p"/admin/theme")
# CSS generator outputs accent colors and layout variables
assert html =~ ".preview-frame, .shop-root"
assert html =~ "--t-accent-h:"
assert html =~ "--t-surface-base:"
assert html =~ "--t-font-heading:"
end
test "applies preset and updates preview", %{conn: conn} do
@@ -93,14 +90,18 @@ defmodule SimpleshopThemeWeb.ThemeLiveTest do
assert html =~ "All Products"
end
test "save theme button works", %{conn: conn} do
test "theme settings are saved when applying a preset", %{conn: conn} do
{:ok, view, _html} = live(conn, ~p"/admin/theme")
# Apply a preset
view
|> element("button", "Save Theme")
|> element("button", "gallery")
|> render_click()
assert view |> element("button", "Save Theme") |> has_element?()
# Verify settings were persisted
theme_settings = Settings.get_theme_settings()
assert theme_settings.mood == "warm"
assert theme_settings.typography == "editorial"
end
test "all preview page buttons are present", %{conn: conn} do
@@ -121,7 +122,7 @@ defmodule SimpleshopThemeWeb.ThemeLiveTest do
# Click the "dark" mood button
html =
view
|> element("button", "dark")
|> element("button[phx-value-setting_value='dark']")
|> render_click()
# Verify the setting was updated
@@ -135,7 +136,7 @@ defmodule SimpleshopThemeWeb.ThemeLiveTest do
# Click the "round" shape button
view
|> element("button", "round")
|> element("button[phx-value-setting_value='round']")
|> render_click()
# Verify the setting was updated
@@ -148,7 +149,7 @@ defmodule SimpleshopThemeWeb.ThemeLiveTest do
# Click the "compact" density button
view
|> element("button", "compact")
|> element("button[phx-value-setting_value='compact']")
|> render_click()
# Verify the setting was updated
@@ -159,9 +160,9 @@ defmodule SimpleshopThemeWeb.ThemeLiveTest do
test "grid columns customization buttons work", %{conn: conn} do
{:ok, view, _html} = live(conn, ~p"/admin/theme")
# Click the "2" grid columns button
# Click the "2 columns" grid columns button
view
|> element("button", "2")
|> element("button", "2 columns")
|> render_click()
# Verify the setting was updated
@@ -169,13 +170,13 @@ defmodule SimpleshopThemeWeb.ThemeLiveTest do
assert theme_settings.grid_columns == "2"
end
test "typography customization select works", %{conn: conn} do
test "typography customization buttons work", %{conn: conn} do
{:ok, view, _html} = live(conn, ~p"/admin/theme")
# Change typography via the form
# Click the "modern" typography button
view
|> element("form[phx-value-field='typography']")
|> render_change(%{"typography" => "modern"})
|> element("button[phx-value-setting_value='modern']")
|> render_click()
# Verify the setting was updated
theme_settings = Settings.get_theme_settings()
@@ -187,7 +188,7 @@ defmodule SimpleshopThemeWeb.ThemeLiveTest do
# Click the "centered" header layout button
view
|> element("button", "centered")
|> element("button[phx-value-setting_value='centered']")
|> render_click()
# Verify the setting was updated
@@ -204,12 +205,12 @@ defmodule SimpleshopThemeWeb.ThemeLiveTest do
# Change a setting
new_html =
view
|> element("button", "dark")
|> element("button[phx-value-setting_value='dark']")
|> render_click()
# Verify CSS has changed (dark mode should have different surface colors)
# Verify CSS has changed
refute initial_css == new_html
assert new_html =~ "--t-surface-base:"
assert new_html =~ "--t-accent-h:"
end
end
end