shoelace-rails 0.6.1 → 0.7.0

data/test/helpers/form_builder/sl_checkbox_test.rb

@@ -0,0 +1,45 @@
+# frozen_string_literal: true
+require 'test_helper'
+
+require_relative '../../../app/helpers/shoelace/sl_form_helper'
+
+class FormBuilderSlCheckboxTest < ActionView::TestCase
+  include Shoelace::SlFormHelper
+
+  test "#check_box" do
+    sl_form_for(User.new, url: "/") do |form|
+      assert_dom_equal <<~HTML, form.check_box(:name)
+        <input name="user[name]" type="hidden" value="0" #{AUTOCOMPLETE_ATTRIBUTE} />
+        <sl-checkbox value="1" name="user[name]" id="user_name">Name</sl-checkbox>
+      HTML
+    end
+  end
+
+  test "#check_box with an invalid value" do
+    yuki = User.new.tap(&:validate)
+
+    sl_form_for(yuki, url: "/") do |form|
+      assert_dom_equal <<~HTML, form.check_box(:name)
+        <input name="user[name]" type="hidden" value="0" #{AUTOCOMPLETE_ATTRIBUTE} />
+        <sl-checkbox value="1" name="user[name]" id="user_name" data-invalid="" invalid="">Name</sl-checkbox>
+      HTML
+    end
+  end
+
+  test "#check_box with a block" do
+    sl_form_for(User.new, url: "/") do |form|
+      assert_dom_equal <<~HTML, form.check_box(:name) { "Maintainer Name" }
+        <input name="user[name]" type="hidden" value="0" #{AUTOCOMPLETE_ATTRIBUTE} />
+        <sl-checkbox value="1" name="user[name]" id="user_name">Maintainer Name</sl-checkbox>
+      HTML
+    end
+  end
+
+  test "#check_box without a hidden input" do
+    sl_form_for(User.new, url: "/") do |form|
+      assert_dom_equal <<~HTML, form.check_box(:name, include_hidden: false) { "Maintainer Name" }
+        <sl-checkbox value="1" name="user[name]" id="user_name">Maintainer Name</sl-checkbox>
+      HTML
+    end
+  end
+end

data/test/helpers/form_builder/sl_color_picker_test.rb

@@ -0,0 +1,26 @@
+# frozen_string_literal: true
+require 'test_helper'
+
+require_relative '../../../app/helpers/shoelace/sl_form_helper'
+
+class FormBuilderSlColorPickerTest < ActionView::TestCase
+  include Shoelace::SlFormHelper
+
+  test "#color_field" do
+    sl_form_for(User.new, url: "/") do |form|
+      assert_dom_equal <<~HTML, form.color_field(:name)
+        <sl-color-picker name="user[name]" id="user_name" label="Name"></sl-color-picker>
+      HTML
+    end
+  end
+
+  test "#color_field with an invalid value" do
+    yuki = User.new.tap(&:validate)
+
+    sl_form_for(yuki, url: "/") do |form|
+      assert_dom_equal <<~HTML, form.color_field(:name)
+        <sl-color-picker name="user[name]" id="user_name" label="Name" data-invalid="" invalid=""></sl-color-picker>
+      HTML
+    end
+  end
+end

data/test/helpers/form_builder/sl_input_test.rb

@@ -0,0 +1,126 @@
+# frozen_string_literal: true
+require 'test_helper'
+
+require_relative '../../../app/helpers/shoelace/sl_form_helper'
+
+class FormBuilderSlInputTest < ActionView::TestCase
+  include Shoelace::SlFormHelper
+
+  test "#text_field" do
+    sl_form_for(User.new, url: "/") do |form|
+      assert_dom_equal <<~HTML, form.text_field(:name)
+        <sl-input label="Name" type="text" name="user[name]" id="user_name"></sl-input>
+      HTML
+    end
+  end
+
+  test "#text_field with a default value" do
+    sl_form_for(User.new(name: "Yuki"), url: "/") do |form|
+      assert_dom_equal <<~HTML, form.text_field(:name)
+        <sl-input label="Name" type="text" name="user[name]" id="user_name" value="Yuki"></sl-input>
+      HTML
+    end
+  end
+
+  test "#text_field with an invalid value" do
+    yuki = User.new.tap(&:validate)
+
+    sl_form_for(yuki, url: "/") do |form|
+      assert_dom_equal <<~HTML, form.text_field(:name)
+        <sl-input label="Name" type="text" name="user[name]" id="user_name" data-invalid="" invalid=""></sl-input>
+      HTML
+    end
+  end
+
+  test "#date_field" do
+    sl_form_for(User.new, url: "/") do |form|
+      assert_dom_equal <<~HTML, form.date_field(:name)
+        <sl-input label="Name" type="date" name="user[name]" id="user_name"></sl-input>
+      HTML
+    end
+  end
+
+  test "#email_field" do
+    sl_form_for(User.new, url: "/") do |form|
+      assert_dom_equal <<~HTML, form.email_field(:name)
+        <sl-input label="Name" type="email" name="user[name]" id="user_name"></sl-input>
+      HTML
+    end
+  end
+
+  test "#number_field" do
+    sl_form_for(User.new, url: "/") do |form|
+      assert_dom_equal <<~HTML, form.number_field(:name)
+        <sl-input label="Name" type="number" name="user[name]" id="user_name"></sl-input>
+      HTML
+    end
+  end
+
+  test "#password_field" do
+    sl_form_for(User.new, url: "/") do |form|
+      assert_dom_equal <<~HTML, form.password_field(:name)
+        <sl-input label="Name" type="password" name="user[name]" id="user_name"></sl-input>
+      HTML
+    end
+  end
+
+  test "#search_field" do
+    sl_form_for(User.new, url: "/") do |form|
+      assert_dom_equal <<~HTML, form.search_field(:name)
+        <sl-input label="Name" type="search" name="user[name]" id="user_name"></sl-input>
+      HTML
+    end
+  end
+
+  test "#telephone_field" do
+    sl_form_for(User.new, url: "/") do |form|
+      assert_dom_equal <<~HTML, form.telephone_field(:name)
+        <sl-input label="Name" type="tel" name="user[name]" id="user_name"></sl-input>
+      HTML
+    end
+  end
+
+  test "#phone_field" do
+    sl_form_for(User.new, url: "/") do |form|
+      assert_dom_equal <<~HTML, form.phone_field(:name)
+        <sl-input label="Name" type="tel" name="user[name]" id="user_name"></sl-input>
+      HTML
+    end
+  end
+
+  test "#text_field with a block" do
+    sl_form_for(User.new(name: "Yuki"), url: "/") do |form|
+      assert_dom_equal <<~HTML, form.text_field(:name) { 'slot' }
+        <sl-input label="Name" type="text" name="user[name]" id="user_name" value="Yuki">slot</sl-input>
+      HTML
+    end
+  end
+
+  test "#text_field with a default help text block" do
+    with_default_input_slot_method do
+      sl_form_for(User.new(name: "Yuki"), url: "/") do |form|
+        assert_dom_equal <<~HTML, form.text_field(:name)
+          <sl-input label="Name" type="text" name="user[name]" id="user_name" value="Yuki">
+            <div slot="help-text">Help text for name Yuki</div>
+          </sl-input>
+        HTML
+      end
+
+      sl_form_for(User.new(name: "Yuki"), url: "/") do |form|
+        assert_dom_equal <<~HTML, form.text_field(:name) { "slot" }
+          <sl-input label="Name" type="text" name="user[name]" id="user_name" value="Yuki">
+            slot
+          </sl-input>
+        HTML
+      end
+    end
+  end
+
+  test "#url_field" do
+    sl_form_for(User.new, url: "/") do |form|
+      assert_dom_equal <<~HTML, form.url_field(:name)
+        <sl-input label="Name" type="url" name="user[name]" id="user_name"></sl-input>
+      HTML
+    end
+  end
+end

data/test/helpers/form_builder/sl_radio_group_test.rb

@@ -0,0 +1,63 @@
+# frozen_string_literal: true
+require 'test_helper'
+
+require_relative '../../../app/helpers/shoelace/sl_form_helper'
+
+class FormBuilderSlRadioGroupTest < ActionView::TestCase
+  include Shoelace::SlFormHelper
+
+  test "#collection_radio_buttons" do
+    users = {
+      1 => "Yuki Nishijima",
+      2 => "Matz",
+      3 => "Koichi Sasada",
+    }
+
+    sl_form_for(User.new, url: "/") do |form|
+      assert_dom_equal <<~HTML, form.collection_radio_buttons(:name, users, :first, :last)
+        <sl-radio-group label="Name" name="user[name]" id="user_name">
+          <sl-radio value="1" id="user_name_1">Yuki Nishijima</sl-radio>
+          <sl-radio value="2" id="user_name_2">Matz</sl-radio>
+          <sl-radio value="3" id="user_name_3">Koichi Sasada</sl-radio>
+        </sl-radio-group>
+      HTML
+    end
+  end
+
+  test "#collection_radio_buttons with an invalid value" do
+    yuki = User.new.tap(&:validate)
+    users = {
+      1 => "Yuki Nishijima",
+      2 => "Matz",
+      3 => "Koichi Sasada",
+    }
+
+    sl_form_for(yuki, url: "/") do |form|
+      assert_dom_equal <<~HTML, form.collection_radio_buttons(:name, users, :first, :last)
+        <sl-radio-group label="Name" name="user[name]" id="user_name" data-invalid="" invalid="">
+          <sl-radio value="1" id="user_name_1">Yuki Nishijima</sl-radio>
+          <sl-radio value="2" id="user_name_2">Matz</sl-radio>
+          <sl-radio value="3" id="user_name_3">Koichi Sasada</sl-radio>
+        </sl-radio-group>
+      HTML
+    end
+  end
+
+  test "#collection_radio_buttons with a default value" do
+    users = {
+      1 => "Yuki Nishijima",
+      2 => "Matz",
+      3 => "Koichi Sasada",
+    }
+
+    sl_form_for(User.new(name: 1), url: "/") do |form|
+      assert_dom_equal <<~HTML, form.collection_radio_buttons(:name, users, :first, :last)
+        <sl-radio-group label="Name" name="user[name]" value="1" id="user_name">
+          <sl-radio value="1" id="user_name_1">Yuki Nishijima</sl-radio>
+          <sl-radio value="2" id="user_name_2">Matz</sl-radio>
+          <sl-radio value="3" id="user_name_3">Koichi Sasada</sl-radio>
+        </sl-radio-group>
+      HTML
+    end
+  end
+end

data/test/helpers/form_builder/sl_range_test.rb

@@ -0,0 +1,34 @@
+# frozen_string_literal: true
+require 'test_helper'
+
+require_relative '../../../app/helpers/shoelace/sl_form_helper'
+
+class FormBuilderSlRangeTest < ActionView::TestCase
+  include Shoelace::SlFormHelper
+
+  test "#range_field" do
+    sl_form_for(User.new, url: "/") do |form|
+      assert_dom_equal <<~HTML, form.range_field(:name)
+        <sl-range label="Name" name="user[name]" id="user_name"></sl-range>
+      HTML
+    end
+  end
+
+  test "#range_field with an invalid value" do
+    yuki = User.new.tap(&:validate)
+
+    sl_form_for(yuki, url: "/") do |form|
+      assert_dom_equal <<~HTML, form.range_field(:name)
+        <sl-range label="Name" name="user[name]" id="user_name" data-invalid="" invalid=""></sl-range>
+      HTML
+    end
+  end
+
+  test "#range_field without a label" do
+    sl_form_for(User.new, url: "/") do |form|
+      assert_dom_equal <<~HTML, form.range_field(:name, label: nil)
+        <sl-range name="user[name]" id="user_name"></sl-range>
+      HTML
+    end
+  end
+end

data/test/helpers/form_builder/sl_select_test.rb

@@ -0,0 +1,320 @@
+# frozen_string_literal: true
+require 'test_helper'
+
+require_relative '../../../app/helpers/shoelace/sl_form_helper'
+
+class FormBuilderSlSelectTest < ActionView::TestCase
+  include Shoelace::SlFormHelper
+
+  test "#select" do
+    users = {
+      "Yuki Nishijima" => 1,
+      "Matz" => 2,
+      "Koichi Sasada" => 3
+    }
+
+    sl_form_for(User.new, url: "/") do |form|
+      assert_dom_equal <<~HTML, form.select(:name, users)
+        <sl-select label="Name" name="user[name]" id="user_name">
+          <sl-option value="1">Yuki Nishijima</sl-option>
+          <sl-option value="2">Matz</sl-option>
+          <sl-option value="3">Koichi Sasada</sl-option>
+        </sl-select>
+      HTML
+    end
+  end
+
+  test "#select with an invalid value" do
+    yuki = User.new.tap(&:validate)
+    users = {
+      "Yuki Nishijima" => 1,
+      "Matz" => 2,
+      "Koichi Sasada" => 3
+    }
+
+    sl_form_for(yuki, url: "/") do |form|
+      assert_dom_equal <<~HTML, form.select(:name, users)
+        <sl-select label="Name" name="user[name]" id="user_name" data-invalid="" invalid="">
+          <sl-option value="1">Yuki Nishijima</sl-option>
+          <sl-option value="2">Matz</sl-option>
+          <sl-option value="3">Koichi Sasada</sl-option>
+        </sl-select>
+      HTML
+    end
+  end
+
+  test "#select with a default help text block" do
+    with_default_input_slot_method do
+      sl_form_for(User.new, url: "/") do |form|
+        assert_dom_equal <<~HTML, form.select(:name, "Yuki Nishijima" => 1)
+          <sl-select label="Name" name="user[name]" id="user_name">
+            <sl-option value="1">Yuki Nishijima</sl-option>
+            <div slot="help-text">Help text for name</div>
+          </sl-select>
+        HTML
+      end
+    end
+  end
+
+  test "#select with a block that does not return anything" do
+    sl_form_for(User.new, url: "/") do |form|
+      assert_dom_equal <<~HTML, form.select(:name, "Yuki Nishijima" => 1) { }
+        <sl-select label="Name" name="user[name]" id="user_name">
+          <sl-option value="1">Yuki Nishijima</sl-option>
+        </sl-select>
+      HTML
+    end
+  end
+
+  test "#select with a custom value" do
+    users = {
+      "Yuki Nishijima" => 1,
+      "Matz" => 2,
+      "Koichi Sasada" => 3
+    }
+
+    sl_form_for(User.new, url: "/") do |form|
+      assert_dom_equal <<~HTML, form.select(:name, users, {}, { value: 3 })
+        <sl-select label="Name" value="3" name="user[name]" id="user_name">
+          <sl-option value="1">Yuki Nishijima</sl-option>
+          <sl-option value="2">Matz</sl-option>
+          <sl-option value="3">Koichi Sasada</sl-option>
+        </sl-select>
+      HTML
+    end
+  end
+
+  test "#select with custom selected and disabled values" do
+    users = {
+      "Yuki Nishijima" => 1,
+      "Matz" => 2,
+      "Koichi Sasada" => 3
+    }
+
+    sl_form_for(User.new, url: "/") do |form|
+      assert_dom_equal <<~HTML, form.select(:name, users, selected: 3, disabled: 1)
+        <sl-select label="Name" name="user[name]" id="user_name">
+          <sl-option value="1" disabled="disabled">Yuki Nishijima</sl-option>
+          <sl-option value="2">Matz</sl-option>
+          <sl-option value="3" checked="checked">Koichi Sasada</sl-option>
+        </sl-select>
+      HTML
+    end
+  end
+
+  test "#select with multiple" do
+    users = {
+      "Yuki Nishijima" => 1,
+      "Matz" => 2,
+      "Koichi Sasada" => 3
+    }
+
+    sl_form_for(User.new, url: "/") do |form|
+      assert_dom_equal <<~HTML, form.select(:name, users, {}, { multiple: true })
+        <sl-select label="Name" name="user[name][]" id="user_name" multiple="multiple">
+          <sl-option value="1">Yuki Nishijima</sl-option>
+          <sl-option value="2">Matz</sl-option>
+          <sl-option value="3">Koichi Sasada</sl-option>
+        </sl-select>
+      HTML
+    end
+  end
+
+  test "#select with grouped options" do
+    users = {
+      "Main maintainers" => [
+        ["Matz", 2],
+        ["Koichi Sasada", 3]
+      ],
+      "Default gem maintainers" => [
+        ["Yuki Nishijima", 1],
+      ]
+    }
+
+    sl_form_for(User.new, url: "/") do |form|
+      assert_dom_equal <<~HTML, form.select(:name, users)
+        <sl-select label="Name" name="user[name]" id="user_name">
+          <small>Main maintainers</small>
+          <sl-option value="2">Matz</sl-option>
+          <sl-option value="3">Koichi Sasada</sl-option>
+          <sl-divider></sl-divider>
+          <small>Default gem maintainers</small>
+          <sl-option value="1">Yuki Nishijima</sl-option>
+        </sl-select>
+      HTML
+    end
+  end
+
+  test "#select with grouped options with a default value" do
+    users = {
+      "Main maintainers" => [
+        ["Matz", 2],
+        ["Koichi Sasada", 3]
+      ],
+      "Default gem maintainers" => [
+        ["Yuki Nishijima", 1],
+      ]
+    }
+
+    sl_form_for(User.new(name: 2), url: "/") do |form|
+      assert_dom_equal <<~HTML, form.select(:name, users)
+        <sl-select label="Name" name="user[name]" id="user_name" value="2">
+          <small>Main maintainers</small>
+          <sl-option value="2" checked="checked">Matz</sl-option>
+          <sl-option value="3">Koichi Sasada</sl-option>
+          <sl-divider></sl-divider>
+          <small>Default gem maintainers</small>
+          <sl-option value="1">Yuki Nishijima</sl-option>
+        </sl-select>
+      HTML
+    end
+  end
+
+  test "#collection_select" do
+    users = {
+      1 => "Yuki Nishijima",
+      2 => "Matz",
+      3 => "Koichi Sasada",
+    }
+
+    sl_form_for(User.new, url: "/") do |form|
+      assert_dom_equal <<~HTML, form.collection_select(:name, users, :first, :last)
+        <sl-select label="Name" name="user[name]" id="user_name">
+          <sl-option value="1">Yuki Nishijima</sl-option>
+          <sl-option value="2">Matz</sl-option>
+          <sl-option value="3">Koichi Sasada</sl-option>
+        </sl-select>
+      HTML
+    end
+  end
+
+  test "#collection_select with a default help text block" do
+    with_default_input_slot_method do
+      sl_form_for(User.new, url: "/") do |form|
+        assert_dom_equal <<~HTML, form.collection_select(:name, { 1 => "Yuki Nishijima" }, :first, :last)
+          <sl-select label="Name" name="user[name]" id="user_name">
+            <sl-option value="1">Yuki Nishijima</sl-option>
+            <div slot="help-text">Help text for name </div>
+          </sl-select>
+        HTML
+      end
+    end
+  end
+
+  test "#collection_select with an invalid value" do
+    yuki = User.new.tap(&:validate)
+    users = {
+      1 => "Yuki Nishijima",
+      2 => "Matz",
+      3 => "Koichi Sasada",
+    }
+
+    sl_form_for(yuki, url: "/") do |form|
+      assert_dom_equal <<~HTML, form.collection_select(:name, users, :first, :last)
+        <sl-select label="Name" name="user[name]" id="user_name" data-invalid="" invalid="">
+          <sl-option value="1">Yuki Nishijima</sl-option>
+          <sl-option value="2">Matz</sl-option>
+          <sl-option value="3">Koichi Sasada</sl-option>
+        </sl-select>
+      HTML
+    end
+  end
+
+  test "#collection_select with a default value" do
+    users = {
+      1 => "Yuki Nishijima",
+      2 => "Matz",
+      3 => "Koichi Sasada",
+    }
+
+    sl_form_for(User.new(name: "2"), url: "/") do |form|
+      assert_dom_equal <<~HTML, form.collection_select(:name, users, :first, :last)
+        <sl-select label="Name" name="user[name]" id="user_name" value="2">
+          <sl-option value="1">Yuki Nishijima</sl-option>
+          <sl-option value="2" checked="checked">Matz</sl-option>
+          <sl-option value="3">Koichi Sasada</sl-option>
+        </sl-select>
+      HTML
+    end
+  end
+
+  test "#grouped_collection_select" do
+    users = [
+      OpenStruct.new(
+        group_name: "Main maintainers",
+        members: [
+          OpenStruct.new(id: 1, name: "Matz"),
+          OpenStruct.new(id: 2, name: "Koichi Sasada"),
+        ]
+      ),
+      OpenStruct.new(
+        group_name: "Default gem maintainers",
+        members: [OpenStruct.new(id: 3, name: "Yuki Nishijima")]
+      ),
+    ]
+
+    sl_form_for(User.new(name: "2"), url: "/") do |form|
+      assert_dom_equal <<~HTML, form.grouped_collection_select(:name, users, :members, :group_name, :id, :name)
+        <sl-select label="Name" name="user[name]" id="user_name" value="2">
+          <small>Main maintainers</small>
+          <sl-option value="1">Matz</sl-option>
+          <sl-option value="2" checked="checked">Koichi Sasada</sl-option>
+          <sl-divider></sl-divider>
+          <small>Default gem maintainers</small>
+          <sl-option value="3">Yuki Nishijima</sl-option>
+        </sl-select>
+      HTML
+    end
+  end
+
+  test "#grouped_collection_select with a default help text block" do
+    users = [
+      OpenStruct.new(
+        group_name: "Default gem maintainers",
+        members: [OpenStruct.new(id: 3, name: "Yuki Nishijima")]
+      ),
+    ]
+
+    with_default_input_slot_method do
+      sl_form_for(User.new(name: "2"), url: "/") do |form|
+        assert_dom_equal <<~HTML, form.grouped_collection_select(:name, users, :members, :group_name, :id, :name)
+          <sl-select label="Name" name="user[name]" id="user_name" value="2">
+            <small>Default gem maintainers</small>
+            <sl-option value="3">Yuki Nishijima</sl-option>
+            <div slot="help-text">Help text for name 2</div>
+          </sl-select>
+        HTML
+      end
+    end
+  end
+
+  test "#grouped_collection_select with an invalid value" do
+    yuki = User.new.tap(&:validate)
+    users = [
+      OpenStruct.new(
+        group_name: "Main maintainers",
+        members: [
+          OpenStruct.new(id: 1, name: "Matz"),
+          OpenStruct.new(id: 2, name: "Koichi Sasada"),
+        ]
+      ),
+      OpenStruct.new(
+        group_name: "Default gem maintainers",
+        members: [OpenStruct.new(id: 3, name: "Yuki Nishijima")]
+      ),
+    ]
+
+    sl_form_for(yuki, url: "/") do |form|
+      assert_dom_equal <<~HTML, form.grouped_collection_select(:name, users, :members, :group_name, :id, :name)
+        <sl-select label="Name" name="user[name]" id="user_name" data-invalid="" invalid="">
+          <small>Main maintainers</small>
+          <sl-option value="1">Matz</sl-option>
+          <sl-option value="2">Koichi Sasada</sl-option>
+          <sl-divider></sl-divider>
+          <small>Default gem maintainers</small>
+          <sl-option value="3">Yuki Nishijima</sl-option>
+        </sl-select>
+      HTML
+    end
+  end
+end

data/test/helpers/form_builder/sl_switch_test.rb

@@ -0,0 +1,26 @@
+# frozen_string_literal: true
+require 'test_helper'
+
+require_relative '../../../app/helpers/shoelace/sl_form_helper'
+
+class FormBuilderSlRangeTest < ActionView::TestCase
+  include Shoelace::SlFormHelper
+
+  test "#switch_field" do
+    sl_form_for(User.new, url: "/") do |form|
+      assert_dom_equal <<~HTML, form.switch_field(:name)
+        <sl-switch name="user[name]" id="user_name">Name</sl-switch>
+      HTML
+    end
+  end
+
+  test "#switch_field with an invalid value" do
+    yuki = User.new.tap(&:validate)
+
+    sl_form_for(yuki, url: "/") do |form|
+      assert_dom_equal <<~HTML, form.switch_field(:name)
+        <sl-switch name="user[name]" id="user_name" data-invalid="" invalid="">Name</sl-switch>
+      HTML
+    end
+  end
+end