Thursday, June 25, 2009

Ponies and Filling out Forms with Webrat

‹prev | My Chain | next›

Following up on yesterday's simple form-by-example, today I get to fill out that form with Webrat.

Yay! Good clean fun.

In the site feedback Cucumber scenario, I am seeing the feedback form. Next up is "When I fill out the form with effusive praise", which I can define with:
When /^I fill out the form with effusive praise$/ do
fill_in "Name", :with => "Bob"
fill_in "Email", :with => ""
fill_in "Subject", :with => "Your site is awesome!"
fill_in "Message", :with => "The recipes are delicious and your use of CouchDB is impressive."
That's it! Webrat is just awesome.

This works because I have wisely wrapped my <label> tags around the input fields:
  <form action='email'>
<input name='name' size='30' type='text' />

<input name='email' size='30' type='text' />
<input name='subject' size='50' type='text' />
<textarea cols='55' name='message' rows='8'></textarea>

<input name='Send Comments' type='submit' />
For the uninitiated, <label> tags not only cue Webrat which form fields to complete, but also activate the HTML form field when the label text is clicked—especially handy when clicking those tiny radio buttons or checkboxes.

I could also have added id attributes to the various form fields (e.g. <input id="email-input" type="text"…/>) and then done the label with a for attribute (e.g. <label for="email-input">Email</label>). That would have the same effect in most browsers, but would have the added benefit of working in Internet Explorer (wrapping <label> tags does not work in Internet Explorer), but why make life easier for Internet Explorer users?

With that step marked as complete, it is time to do something in response to submitting the feedback form. I drive-by-example a simple "Thanks for the feedback" page. Before I am really done, I need to actually do something with the feedback. In the various legacy versions of EEE Cooks, all that we do with the feedback is send an email. According to the Sinatra FAQ, that means Pony:
cstrom@jaynestown:~/repos/eee-code$ gem install pony
Building native extensions. This could take a while...
Successfully installed tmail-
Successfully installed pony-0.3
2 gems installed
Pony is a great little gem—it does just enough to make sending email simple. The RSpec example that I use to drive sending email is:
    it "should send us an email" do
with(hash_including(:subject => "Subject"))

post "/email",
:name => "Bob",
:subject => "Subject",
:message => "Feedback message."
The actual implementation:
post '/email' do
message = <<"_EOM"
From: #{params[:name]}
Email: #{params[:email]}


Pony.mail(:to => "us _at_".gsub(/\s*_at_\s*/, '@'),
:subject => params[:subject],
:body => message)

haml :email
That is a good stopping point for today. Tomorrow, I will work my way back out to the Cucumber scenario.


  1. Why'd you use that gsub for the @ in your :to address?

  2. Grande -- sshhh... that's my super-secret email obfuscation method :P

    The source code is published both to my blog and on github. I figured it best not to tempt fate by hard-coding the real email address there. Bottom line: the gsub adds no real value. It merely makes it slightly more difficult for 'bots to scrape my email address.

  3. Gotcha, thanks.

    Also, thanks for putting up this blog! I've been learning Couch & Cucumber at work for a project, and this has been very valuable. Even with RSpec, I've learned quite a bit from you. So... Thanks!

  4. Thanks!

    I definitely set off on this expedition with selfish intentions (getting a project done and forcing myself to learn). I had no idea if it would be helpful to anyone else, but it's great to hear that it is :)