defmodule BerrypodWeb.Admin.ThemeTest do use BerrypodWeb.ConnCase, async: false import Phoenix.LiveViewTest import Berrypod.AccountsFixtures alias Berrypod.Settings setup do user = user_fixture() %{user: user} end describe "Index (unauthenticated)" do test "redirects to login when not authenticated", %{conn: conn} do {:error, redirect} = live(conn, ~p"/admin/theme") assert {:redirect, %{to: path}} = redirect assert path == ~p"/users/log-in" end end describe "Index (authenticated)" do setup %{conn: conn, user: user} do conn = log_in_user(conn, user) %{conn: conn} end test "renders theme editor page", %{conn: conn} do {:ok, _view, html} = live(conn, ~p"/admin/theme") assert html =~ "

Theme

" assert html =~ "preset" end test "displays all 8 presets", %{conn: conn} do {:ok, _view, html} = live(conn, ~p"/admin/theme") assert html =~ "gallery" assert html =~ "studio" assert html =~ "boutique" assert html =~ "bold" assert html =~ "playful" assert html =~ "minimal" assert html =~ "night" assert html =~ "classic" end test "displays current theme settings", %{conn: conn} do {:ok, _settings} = Settings.apply_preset(:gallery) {:ok, _view, html} = live(conn, ~p"/admin/theme") assert html =~ "warm" assert html =~ "editorial" assert html =~ "soft" assert html =~ "spacious" end 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 for shop pages assert html =~ ".themed {" assert html =~ "--t-accent-h:" end test "applies preset and updates preview", %{conn: conn} do {:ok, view, _html} = live(conn, ~p"/admin/theme") html = view |> element("button", "gallery") |> render_click() theme_settings = Settings.get_theme_settings() assert theme_settings.mood == "warm" assert theme_settings.typography == "editorial" assert html =~ "warm" assert html =~ "editorial" end test "switches preview page", %{conn: conn} do {:ok, view, _html} = live(conn, ~p"/admin/theme") html = view |> element("button", "Collection") |> render_click() assert html =~ "All Products" end 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", "gallery") |> render_click() # 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 {:ok, _view, html} = live(conn, ~p"/admin/theme") assert html =~ "Home" assert html =~ "Collection" assert html =~ "Product" assert html =~ "Cart" assert html =~ "About" assert html =~ "Contact" assert html =~ "404" end test "mood customization buttons work", %{conn: conn} do {:ok, view, _html} = live(conn, ~p"/admin/theme") # Click the "dark" mood button html = view |> element("button[phx-value-setting_value='dark']") |> render_click() # Verify the setting was updated theme_settings = Settings.get_theme_settings() assert theme_settings.mood == "dark" assert html =~ "dark" end test "shape customization buttons work", %{conn: conn} do {:ok, view, _html} = live(conn, ~p"/admin/theme") # Click the "round" shape button view |> element("button[phx-value-setting_value='round']") |> render_click() # Verify the setting was updated theme_settings = Settings.get_theme_settings() assert theme_settings.shape == "round" end test "density customization buttons work", %{conn: conn} do {:ok, view, _html} = live(conn, ~p"/admin/theme") # Click the "compact" density button view |> element("button[phx-value-setting_value='compact']") |> render_click() # Verify the setting was updated theme_settings = Settings.get_theme_settings() assert theme_settings.density == "compact" end test "grid columns customization buttons work", %{conn: conn} do {:ok, view, _html} = live(conn, ~p"/admin/theme") # Click the "2 columns" grid columns button view |> element("button", "2 columns") |> render_click() # Verify the setting was updated theme_settings = Settings.get_theme_settings() assert theme_settings.grid_columns == "2" end test "typography customization buttons work", %{conn: conn} do {:ok, view, _html} = live(conn, ~p"/admin/theme") # Click the "modern" typography button view |> element("button[phx-value-setting_value='modern']") |> render_click() # Verify the setting was updated theme_settings = Settings.get_theme_settings() assert theme_settings.typography == "modern" end test "header layout customization buttons work", %{conn: conn} do {:ok, view, _html} = live(conn, ~p"/admin/theme") # Click the "centered" header layout button view |> element("button[phx-value-setting_value='centered']") |> render_click() # Verify the setting was updated theme_settings = Settings.get_theme_settings() assert theme_settings.header_layout == "centered" end test "CSS regenerates when settings change", %{conn: conn} do {:ok, view, html} = live(conn, ~p"/admin/theme") # Capture initial CSS initial_css = html # Change a setting new_html = view |> element("button[phx-value-setting_value='dark']") |> render_click() # Verify CSS has changed refute initial_css == new_html assert new_html =~ "--t-accent-h:" end end end