capybara setup in spec_helper

# capybara setup
require 'capybara/rails'
require 'capybara/rspec'
require 'capybara/poltergeist'
Capybara.javascript_driver = :poltergeist

demo.rb

module Demo
  TICK = "✓"

  attr_accessor :last_step

  def demo_step description, args={}
    if demo?
      page.execute_script %{
        $("body").prepend("<div id='step' style='font-size: 2em' class='alert alert-info'>#{description}<button style='margin-left:15px' onclick='$(this).parent().hide()'>Go</button></div>");
      }
      page.execute_script %{
        $("body").prepend("<div id='last-step' style='font-size: 2em' class='alert'>#{last_step} #{TICK}</div>");
      } if last_step.present?
      @last_step = description unless args[:title]
      using_wait_time(1000) do
        page.should have_no_css '#step', :visible => true
      end
    end

    if demo_step?
      puts "Step: #{description}".cyan
    end
  end

  def demo_step?
    example.metadata[:step]
  end

  def demo?
    example.metadata[:demo]
  end

  def set_speed(speed)
    begin
      page.driver.browser.send(:bridge).speed=speed
    rescue
    end
  end
end

RSpec.configuration.include Demo

RSpec.configure do |config|
  config.before :each do
    if demo?
      Capybara.current_driver = :selenium
      set_speed(:slow)
      visit '/'
      demo_step(example.description, { :title => true })
    end
  end

  config.after :each do
    if demo?
      Capybara.use_default_driver
      set_speed(:medium)
    end
  end
end

module Selenium::WebDriver::Firefox
  class Bridge
    attr_accessor :speed

    def execute(*args)
      result = raw_execute(*args)['value']
      case speed
        when :slow
          sleep 0.3
        when :medium
          sleep 0.1
        when :fast
          sleep 0.05
      end
      result
    end
  end
end

How to demo feature specs.md

In order to demo your feature specs, follow these steps:

1. Add capybara, poltergeist, launchy and selenium-webdriver to your Gemfile under test and development group.
2. Add the attached demo helper to your spec/support.
3. Add the capybara config to your spec_helper file.
4. Run bundle install.
5. Write your feature with its scenario specs.
6. Put a demo filter on each scenario you want to demo. ( refer to the example below )
7. Run bundle exec rspec spec.

Note: you should have firefox and phantomjs installed.

If you still have any questions, you can take a look at my example blog application: example blog app