Here’s how I set up Cucumber
First, I edited the Gemfile for a project and added this group:
Once done, I run at the project root:
It pulls down the gems needed – in this case, I’m mainly using cucumber-rails and watir-webdriver.
After the install, I run a rails generator call to set up cucumber from the project root:
This will create a features folder… it’s layout will be like this:
At the root of the features folder, I put my BDD test. This is where you define the goals… you can think of it as the high level “Given When Thens.” What’s cool about Cucumber, is that the NO code goes in this file, it’s simple. In GEB, or groovy frameworks, simple code goes in the BDD tests. But in Cucumber, NOTHING but the BDD goes there.
The BDD Test
In my test, I wrote the following in a ruby file at the root here:
Scenario: User searches for the book Cucumber
Given a user goes to Amazon.com
When they input the title Cucumber in the Amazon search field
And they click submit
Then they should see a resuls list with Cucumber in the title
So the directory looks like:
If you were to run the command “cucumber” now, it would return back a statement that there are no step definitions. Which is true, there aren’t. The step definitions is the code that makes this test work. Right now, it just has the BDD language, but no code.
The Step Definitions
So lets create the amazon_test.rb ruby file… in there I use Watir-webdriver to power the browser… and I use Cucumber to write the Given When Thens’. Here’s my file’s contents:
Given /^a user goes to Amazon.com$/ do
@browser = Watir::Browser.new(:ff)
When /^they input the title Cucumber in the Amazon search field$/ do
@browser.text_field(:name => “field-keywords”).set “Cucumber”
And /^they click submit$/ do
@browser.button(:class => “nav-submit-input”).click
Then /^they should see a resuls list with Cucumber in the title$/ do
@browser.h1(:id => “breadCrumb”) == “Cucumber”
Now if we run “cucumber” – it will execute each scenario in the test and each part of the test. If it fails to get a value for any of the steps, it will return the error in the console. If you have a ANSI color coded terminal you’ll get results in a nice color coding.
Breaking the Code Down
First line defines the browser I’m using. In this case it’s Firefox.
After that I tell it where to go, in this case www.amazon.com
Next I’m finding the main search field on Amazon (“field-keywords”) – I’m searching for the name on the field. It would be better to search by ID, but I’m going for a field name search. In the same line, I’m passing the value of “cucumber” into the field.
Next I find the submit button and click it.
Then I find the breadcrumb on the page, and verify the value is “Cucumber”
Finally I close the browser to end the test.