Setting up tests

.github/workflows/salad_ui.yml

@@ -0,0 +1,102 @@
+name: Elixir CI
+
+# Define workflow that runs when changes are pushed to the
+# `main` branch or pushed to a PR branch that targets the `main`
+# branch. Change the branch name if your project uses a
+# different name for the main branch like "master" or "production".
+on:
+  push:
+    branches: [ "master", "main", "staging", "dev", "setup-dev", "setting-up-tests"]  # adapt branch for project
+  pull_request:
+    branches: [ "master", "main", "staging", "dev", "setup-dev", "setting-up-tests"]  # adapt branch for project
+
+# Sets the ENV `MIX_ENV` to `test` for running tests
+env:
+  MIX_ENV: test
+
+permissions:
+  contents: read
+
+jobs:
+  test:
+    # Set up a Postgres DB service. By default, Phoenix applications
+    # use Postgres. This creates a database for running tests.
+    # Additional services can be defined here if required.
+    services:
+      db:
+        image: postgres
+        ports: ['5432:5432']
+        env:
+          POSTGRES_PASSWORD: secret
+        options: >-
+          --health-cmd pg_isready
+          --health-interval 10s
+          --health-timeout 5s
+          --health-retries 5
+
+    runs-on: ubuntu-latest
+    name: Test on OTP ${{matrix.otp}} / Elixir ${{matrix.elixir}}
+    strategy:
+      # Specify the OTP and Elixir versions to use when building
+      # and running the workflow steps.
+      matrix:
+        otp: ['26']       # Define the OTP version [required]
+        elixir: ['1.16.2']    # Define the elixir version [required]
+    steps:
+    # Step: Setup Elixir + Erlang image as the base.
+    - name: Set up Elixir
+      uses: erlef/setup-beam@v1
+      with:
+        otp-version: ${{matrix.otp}}
+        elixir-version: ${{matrix.elixir}}
+
+    # Step: Check out the code.
+    - name: Checkout code
+      uses: actions/checkout@v3
+
+    # Step: Define how to cache deps. Restores existing cache if present.
+    - name: Cache deps
+      id: cache-deps
+      uses: actions/cache@v3
+      env:
+        cache-name: cache-elixir-deps
+      with:
+        path: deps
+        key: ${{ runner.os }}-mix-${{ env.cache-name }}-${{ hashFiles('**/mix.lock') }}
+        restore-keys: |
+          ${{ runner.os }}-mix-${{ env.cache-name }}-
+
+    # Step: Define how to cache the `_build` directory. After the first run,
+    # this speeds up tests runs a lot. This includes not re-compiling our
+    # project's downloaded deps every run.
+    - name: Cache compiled build
+      id: cache-build
+      uses: actions/cache@v3
+      env:
+        cache-name: cache-compiled-build
+      with:
+        path: _build
+        key: ${{ runner.os }}-mix-${{ env.cache-name }}-${{ hashFiles('**/mix.lock') }}
+        restore-keys: |
+          ${{ runner.os }}-mix-${{ env.cache-name }}-
+          ${{ runner.os }}-mix-
+
+    # Step: Download project dependencies. If unchanged, uses
+    # the cached version.
+    - name: Install dependencies
+      run: mix deps.get
+
+    # Step: Compile the project treating any warnings as errors.
+    # Customize this step if a different behavior is desired.
+    - name: Compiles without warnings
+      run: mix compile --warnings-as-errors
+
+    # Step: Check that the checked in code has already been formatted.
+    # This step fails if something was found unformatted.
+    # Customize this step as desired.
+    - name: Check Formatting
+      run: mix format --check-formatted
+
+    # Step: Execute the tests.
+    - name: Run tests
+      run: mix test

.vscode/settings.json

@@ -0,0 +1,4 @@
+{
+    "terminal.integrated.accessibleViewFocusOnCommandExecution": true,
+    "terminal.integrated.accessibleViewPreserveCursorPosition": true
+}

README.md

@@ -106,11 +106,21 @@ Here is how to start develop SaladUI on local machine.
 1. Clone this repo
 2. Clone `https://github.com/bluzky/salad_storybook` in the same directory with `SaladUI`
 3. Start storybook
-```
+```ex
 cd salad_storybook
 mix phx.server
 ```
 
+## Unit Testing
+
+In your project folder make sure the dependencies are installed by running `mix deps.get`, then once completed you can run:
+
+- `mix test` to run tests once or,
+- `mix test.watch` to watch file and run tests on file changes.
+
+To run the failing tests only, just run `mix test.watch --stale`.
+
+  It's also important to note that you must format your code with `mix format` before sending a pull request, otherwise the build in github will fail.
 
 ## List of components
 

lib/salad_ui/dialog.ex

@@ -37,11 +37,11 @@ defmodule SaladUI.Dialog do
               </.dialog_content>
         </.dialog>
   """
-  attr :id, :string, required: true
-  attr :show, :boolean, default: false
-  attr :on_cancel, JS, default: %JS{}
-  attr :class, :string, default: nil
-  slot :inner_block, required: true
+  attr(:id, :string, required: true)
+  attr(:show, :boolean, default: false)
+  attr(:on_cancel, JS, default: %JS{})
+  attr(:class, :string, default: nil)
+  slot(:inner_block, required: true)
 
   def dialog(assigns) do
     ~H"""
@@ -107,8 +107,8 @@ defmodule SaladUI.Dialog do
     """
   end
 
-  attr :class, :string, default: nil
-  slot :inner_block, required: true
+  attr(:class, :string, default: nil)
+  slot(:inner_block, required: true)
 
   def dialog_header(assigns) do
     ~H"""
@@ -118,8 +118,8 @@ defmodule SaladUI.Dialog do
     """
   end
 
-  attr :class, :string, default: nil
-  slot :inner_block, required: true
+  attr(:class, :string, default: nil)
+  slot(:inner_block, required: true)
 
   def dialog_title(assigns) do
     ~H"""
@@ -129,8 +129,8 @@ defmodule SaladUI.Dialog do
     """
   end
 
-  attr :class, :string, default: nil
-  slot :inner_block, required: true
+  attr(:class, :string, default: nil)
+  slot(:inner_block, required: true)
 
   def dialog_description(assigns) do
     ~H"""
@@ -140,8 +140,8 @@ defmodule SaladUI.Dialog do
     """
   end
 
-  attr :class, :string, default: nil
-  slot :inner_block, required: true
+  attr(:class, :string, default: nil)
+  slot(:inner_block, required: true)
 
   def dialog_footer(assigns) do
     ~H"""

lib/salad_ui/dropdown_menu.ex

@@ -35,9 +35,9 @@ defmodule SaladUI.DropdownMenu do
    </.dropdown_menu>
   """
 
-  attr :class, :string, default: nil
-  slot :inner_block, required: true
-  attr :rest, :global
+  attr(:class, :string, default: nil)
+  slot(:inner_block, required: true)
+  attr(:rest, :global)
 
   def dropdown_menu(assigns) do
     ~H"""
@@ -47,9 +47,9 @@ defmodule SaladUI.DropdownMenu do
     """
   end
 
-  attr :class, :string, default: nil
-  slot :inner_block, required: true
-  attr :rest, :global
+  attr(:class, :string, default: nil)
+  slot(:inner_block, required: true)
+  attr(:rest, :global)
 
   def dropdown_menu_trigger(assigns) do
     ~H"""
@@ -65,11 +65,11 @@ defmodule SaladUI.DropdownMenu do
     """
   end
 
-  attr :class, :string, default: nil
-  attr :side, :string, values: ["top", "right", "bottom", "left"], default: "bottom"
-  attr :align, :string, values: ["start", "center", "end"], default: "start"
-  slot :inner_block, required: true
-  attr :rest, :global
+  attr(:class, :string, default: nil)
+  attr(:side, :string, values: ["top", "right", "bottom", "left"], default: "bottom")
+  attr(:align, :string, values: ["start", "center", "end"], default: "start")
+  slot(:inner_block, required: true)
+  attr(:rest, :global)
 
   def dropdown_menu_content(assigns) do
     ~H"""

lib/salad_ui/separator.ex

@@ -10,7 +10,7 @@ defmodule SaladUI.Separator do
      <.separator orientation="horizontal" />
 
   """
-  attr :orientation, :string, values: ~w(vertical horizontal), default: "horizontal"
+  attr(:orientation, :string, values: ~w(vertical horizontal), default: "horizontal")
   attr(:class, :string, default: nil)
   attr(:rest, :global, include: ~w(disabled form name value))
 

lib/salad_ui/sheet.ex

@@ -212,27 +212,6 @@ defmodule SaladUI.Sheet do
     """
   end
 
-  @variants %{
-    side: %{
-      "top" => "inset-x-0 top-0 border-b data-[state=closed]:slide-out-to-top data-[state=open]:slide-in-from-to",
-      "bottom" =>
-        "inset-x-0 bottom-0 border-t data-[state=closed]:slide-out-to-bottom data-[state=open]:slide-in-from-bottom",
-      "left" =>
-        "inset-y-0 right-0 h-full w-3/4  border-l data-[state=closed]:slide-out-to-right data-[state=open]:slide-in-from-right sm:max-w-sm",
-      "right" => "text-foreground"
-    }
-  }
-
-  @default_variants %{
-    side: "default"
-  }
-
-  defp variant(props) do
-    variants = Map.merge(@default_variants, props)
-
-    Enum.map_join(variants, " ", fn {key, value} -> @variants[key][value] end)
-  end
-
   defp show_sheet(js \\ %JS{}, id, side) when is_binary(id) do
     transition =
       case side do

lib/salad_ui/table.ex

@@ -44,9 +44,9 @@ defmodule SaladUI.Table do
        </.table_body>
       </.table>
   """
-  attr :class, :string, default: nil
-  attr :rest, :global
-  slot :inner_block, required: true
+  attr(:class, :string, default: nil)
+  attr(:rest, :global)
+  slot(:inner_block, required: true)
 
   def table(assigns) do
     ~H"""
@@ -56,9 +56,9 @@ defmodule SaladUI.Table do
     """
   end
 
-  attr :class, :string, default: nil
-  attr :rest, :global
-  slot :inner_block, required: true
+  attr(:class, :string, default: nil)
+  attr(:rest, :global)
+  slot(:inner_block, required: true)
 
   def table_header(assigns) do
     ~H"""
@@ -68,9 +68,9 @@ defmodule SaladUI.Table do
     """
   end
 
-  attr :class, :string, default: nil
-  attr :rest, :global
-  slot :inner_block, required: true
+  attr(:class, :string, default: nil)
+  attr(:rest, :global)
+  slot(:inner_block, required: true)
 
   def table_row(assigns) do
     ~H"""
@@ -88,9 +88,9 @@ defmodule SaladUI.Table do
     """
   end
 
-  attr :class, :string, default: nil
-  attr :rest, :global
-  slot :inner_block, required: true
+  attr(:class, :string, default: nil)
+  attr(:rest, :global)
+  slot(:inner_block, required: true)
 
   def table_head(assigns) do
     ~H"""
@@ -108,9 +108,9 @@ defmodule SaladUI.Table do
     """
   end
 
-  attr :class, :string, default: nil
-  attr :rest, :global
-  slot :inner_block, required: true
+  attr(:class, :string, default: nil)
+  attr(:rest, :global)
+  slot(:inner_block, required: true)
 
   def table_body(assigns) do
     ~H"""
@@ -120,9 +120,9 @@ defmodule SaladUI.Table do
     """
   end
 
-  attr :class, :string, default: nil
-  attr :rest, :global
-  slot :inner_block, required: true
+  attr(:class, :string, default: nil)
+  attr(:rest, :global)
+  slot(:inner_block, required: true)
 
   def table_cell(assigns) do
     ~H"""
@@ -155,9 +155,9 @@ defmodule SaladUI.Table do
     """
   end
 
-  attr :class, :string, default: nil
-  attr :rest, :global
-  slot :inner_block, required: true
+  attr(:class, :string, default: nil)
+  attr(:rest, :global)
+  slot(:inner_block, required: true)
 
   def table_caption(assigns) do
     ~H"""