Merge pull request #14 from matestack/revert-13-revert-6-textarea

Revert "Revert "Textarea component implementation""

Author: jonasjabari

docs/api/form/textarea.md

@@ -0,0 +1,59 @@
+# Textarea
+
+The Bootstrap `textarea` form component, implemented in Ruby. Use it like any of the other matestack form components in your apps, pages and components. It offers customizable options to simply achieve what is possible in Bootstrap with this component. See below for more information about the configuration options.
+
+## `bs_form_textarea(*args, &block)`
+
+Renders a Bootstrap textarea field.
+
+**Optional options**
+
+* `label` - Expects a string, gets displayed before the select menu
+* `form_text` - Expects a string, gets displayed after the select menu
+* `disabled` - If set to `:true`, the input field is set to disabled and clicking them doesn't yield any effec
+* `placeholder` - Expects a string to be displayed as a placeholder for whatever the user decides to choose for the `:file` input. Defaults to "Choose file"
+* `variant` - Expects a symbol to change the size of the select menu, you can use either `:sm` or `:lg`
+* `rows` - Specifies the visible number of lines in a text area.
+* `cols` - Specifies the visible width of a textarea.
+
+## Examples
+
+### Example 1: Basic usage
+
+```ruby
+bs_form_textarea key: :foo, type: :text
+```
+
+### Example 2: Basic usage with label and form text
+
+```ruby
+bs_form_textarea key: :foo, type: :text, label: "Input field", form_text: "some notes"
+```
+
+### Example 3: Basic usage as disabled input
+
+```ruby
+bs_form_textarea key: :foo, type: :text, disabled: true
+```
+
+returns
+
+### Example 4: Basic usage with custom class
+
+```ruby
+bs_form_textarea key: :foo, type: :text, class: "some-class"
+```
+
+### Example 5: Basic usage with placeholder
+
+```ruby
+bs_form_textarea key: :foo, type: :text, placeholder: "fill!"
+```
+
+### Example 6: Basic usage with rows and cols set
+
+```ruby
+bs_form_textarea key: :foo, type: :text, rows: 5, cols: 30
+```
+
+

lib/matestack/ui/bootstrap.rb

@@ -98,6 +98,7 @@ module Form
 end
 require "#{base_path}/form/checkbox"
 require "#{base_path}/form/input"
+require "#{base_path}/form/textarea"
 require "#{base_path}/form/radio"
 require "#{base_path}/form/select"
 require "#{base_path}/form/submit"

lib/matestack/ui/bootstrap/form/textarea.rb

@@ -0,0 +1,50 @@
+class Matestack::Ui::Bootstrap::Form::Textarea < Matestack::Ui::VueJs::Components::Form::Textarea
+
+  include Matestack::Ui::Bootstrap::Registry
+
+  vue_name "matestack-ui-core-form-textarea"
+
+  optional :form_text
+  optional :disabled
+  optional :placeholder
+  optional :rows
+  optional :cols
+
+  def response
+    div class: "matestack-ui-bootstrap-textarea" do
+      label input_label, for: attribute_key,  class: "form-label" if input_label
+      textarea options.merge(textarea_attributes).merge(bootstrap_textarea_attributes)
+      render_errors
+      render_form_text if context.form_text
+    end
+  end
+
+  def bootstrap_textarea_attributes
+    {
+      id: (options[:id] || attribute_key),
+      class: (options[:class] || "") << (" form-control"),
+      rows: context.rows,
+      cols: context.cols,
+      disabled: context.disabled
+    }
+  end
+
+  def render_errors
+    if display_errors?
+      div class: 'invalid-feedback', 'v-for': "error in #{error_key}" do
+        plain '{{ error }}'
+      end
+    end
+  end
+
+  def input_error_class
+    'is-invalid'
+  end
+
+  def render_form_text
+    div id: "form_text_for_#{attribute_key}", class: "form-text" do
+      plain context.form_text
+    end
+  end
+
+end

lib/matestack/ui/bootstrap/registry.rb

@@ -114,6 +114,10 @@ def bs_form_input(text=nil, options=nil, &block)
     Matestack::Ui::Bootstrap::Form::Input.(text, options, &block)
   end
 
+  def bs_form_textarea(text=nil, options=nil, &block)
+    Matestack::Ui::Bootstrap::Form::Textarea.(text, options, &block)
+  end
+
   def bs_form_select(text=nil, options=nil, &block)
     Matestack::Ui::Bootstrap::Form::Select.(text, options, &block)
   end

spec/test/form/textarea_spec.rb

@@ -0,0 +1,124 @@
+require 'rails_helper'
+require_relative "../../support/form_test_controller"
+
+RSpec.describe "Bootstrap::Form::Textarea", type: :feature, js: true do
+  include Utils
+
+  before :all do
+    Rails.application.routes.append do
+      scope "form_text_input_spec" do
+        post '/textarea_success_form_test', to: 'form_test#success_submit', as: 'textarea_success_form_test'
+        post '/textarea_failure_form_test', to: 'form_test#failure_submit', as: 'textarea_failure_form_test'
+      end
+    end
+    Rails.application.reload_routes!
+  end
+
+  before :each do
+    allow_any_instance_of(FormTestController).to receive(:expect_params)
+  end
+
+  it 'renders basic bootstrap textarea field' do
+    form_config = get_form_config(path: textarea_success_form_test_path)
+    matestack_render do
+      matestack_form form_config do
+        bs_form_textarea key: :foo, type: :text
+        bs_form_submit text: "Submit"
+      end
+    end
+    visit example_path
+    expect(page).to have_selector('form > div.matestack-ui-bootstrap-textarea > textarea.form-control#foo')
+
+    fill_in "foo", with: "bar"
+
+    expect_any_instance_of(FormTestController).to receive(:expect_params)
+      .with(hash_including(wrapper: { foo: "bar" }))
+
+    click_button "Submit"
+  end
+
+  it 'renders basic bootstrap textarea field with server errors' do
+    form_config = get_form_config(path: textarea_failure_form_test_path)
+    matestack_render do
+      matestack_form form_config do
+        bs_form_textarea key: :foo, type: :text
+        bs_form_submit text: "Submit"
+      end
+    end
+    visit example_path
+
+    click_button "Submit"
+
+    expect(page).to have_xpath('//form//textarea[@id="foo" and contains(@class, "form-control") and contains(@class, "is-invalid")]')
+
+    expect(page).to have_xpath('//form//div[contains(@class, "invalid-feedback") and contains(text(), "can\'t be blank")]')
+    expect(page).to have_xpath('//form//div[contains(@class, "invalid-feedback") and contains(text(), "is invalid")]')
+  end
+
+  it 'renders basic bootstrap textarea field with additional custom class' do
+    form_config = get_form_config(path: textarea_success_form_test_path)
+    matestack_render do
+      matestack_form form_config do
+        bs_form_textarea key: :foo, type: :text, class: "some-class"
+        bs_form_submit text: "Submit"
+      end
+    end
+    visit example_path
+    expect(page).to have_xpath('//form//textarea[@id="foo" and contains(@class, "form-control") and contains(@class, "some-class")]')
+  end
+
+  it 'renders basic bootstrap textarea field with label' do
+    form_config = get_form_config(path: textarea_success_form_test_path)
+    matestack_render do
+      matestack_form form_config do
+        bs_form_textarea key: :foo, type: :text, label: "Some label"
+        bs_form_submit text: "Submit"
+      end
+    end
+    visit example_path
+    expect(page).to have_xpath('//form//label[@for="foo" and @class="form-label" and contains(text(), "Some label")]')
+  end
+
+  it 'renders basic bootstrap textarea field with placeholder' do
+    form_config = get_form_config(path: textarea_success_form_test_path)
+    matestack_render do
+      matestack_form form_config do
+        bs_form_textarea key: :foo, type: :text, placeholder: "fill!"
+        bs_form_submit text: "Submit"
+      end
+    end
+    visit example_path
+    expect(page).to have_xpath('//form//textarea[@id="foo" and @placeholder="fill!" and contains(@class, "form-control")]')
+  end
+
+  it 'renders basic bootstrap textarea field with form text' do
+    form_config = get_form_config(path: textarea_success_form_test_path)
+    matestack_render do
+      matestack_form form_config do
+        bs_form_textarea key: :foo, type: :text, form_text: "some notes"
+        bs_form_submit text: "Submit"
+      end
+    end
+    visit example_path
+    expect(page).to have_xpath('//form//div[@id="form_text_for_foo" and contains(@class, "form-text") and contains(text(), "some notes")]')
+  end
+
+  it 'renders basic bootstrap textarea field with form rows and cols' do
+    form_config = get_form_config(path: textarea_success_form_test_path)
+    matestack_render do
+      matestack_form form_config do
+        bs_form_textarea key: :foo1, id: :foo1, type: :text, rows: 3, cols: 10
+        bs_form_textarea key: :foo2, id: :foo2, type: :text, rows: 10, cols: 30
+        bs_form_submit text: "Submit"
+      end
+    end
+    visit example_path
+    expect(page.find('textarea#foo1')['rows']).to eq '3'
+    expect(page.find('textarea#foo1')['cols']).to eq '10'
+    expect(page.find('textarea#foo2')['rows']).to eq '10'
+    expect(page.find('textarea#foo2')['cols']).to eq '30'
+  end
+
+
+
+end