ViewSpec

ViewSpec lets you create example-led specifications for components, partials and views using an expressive Ruby DSL.

Specs can then be used in your tests, to render previews for development and visual testing or to generate documentation.

# button_vspec.rb

ViewSpec.spec ButtonComponent do
  title "Button (ViewComponent)"

  scenario "default" do
    preview do
      render ButtonComponent.new(text: "Button text")
    end
  end

  scenario "editable params" do
    param :text, :string, default: "Button text"
    param :type, :symbol, default: :button

    preview do
      render ButtonComponent.new(**params)
    end
  end

  scenario "buttons galore" do
    preview <<~ERB
      <%= render ButtonComponent.new(text: "Button 1") %>
      <%= render ButtonComponent.new(text: "Button 2") %>
      <%= render ButtonComponent.new(text: "Button 3") %>
      <%= render ButtonComponent.new(text: "Button 4") %>
    ERB
  end

  group "themes" do
    scenario "primary" do
      preview { render ButtonComponent.new(text: "Primary", theme: :primary) }
    end

    scenario "secondary" do
      preview { render ButtonComponent.new(text: "Secondary", theme: :secondary) }
    end

    scenario "danger" do
      preview { render ButtonComponent.new(text: "Danger", theme: :danger) }
    end
  end
end