The next step in the exploration-from-the-homepage Cucumber scenario is returning back to the homepage. Amazingly, I have made it through three and a half months of my chain without a site-wide layout. That will need to change in order to get this next step passing.
Haml layouts in Sinatra are designated by creating a
layout.haml file. The following simple layout should do the trick:%htmlBefore defining the click-logo-to-return-home step, I re-run the whole Cucumber scenario to make sure the layout not break anything. Unfortunately, the earlier step that checked the number of meal thumbnail images on the homepage is now failing:
%title= ["EEE Cooks", @title].compact.join(": ")
%body
#header
#eee-header-logo
%a{:href => "/"}
%img{:alt => "Home", :src => "/images/eee_corner.png"}
= yield
#footer
When I view the site's homepageThe thumbnails are still there, so what gives? The failing Cucumber scenario is currently defined as:
Then I should see the 10 most recent meals prominently displayed
And the prominently displayed meals should include a thumbnail image
expected following output to contain a <img/> tag:
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" "http://www.w3.org/TR/REC-html40/loose.dtd">
<html>
<head><title>EEE Cooks</title></head>
<html><body>
<div id="header">
<div id="eee-header-logo">
<a href="/">
<img alt="Home" src="/images/eee_corner.png"></a>
</div>
</div>
<div class="meals">
<h1>Meals</h1>
<a href="/meals/2009/06/11">
<img height="150" width="200" src="/images/2009-06-11/meal0.jpg"></a>
<h2>
<a href="/meals/2009/06/11">Meal 0</a>
</h2>
<p>meal summary</p>
...
Then /^the prominently displayed meals should include a thumbnail image$/ doAh, rather than verifying that there are 10 meal thumbnail images, I am trying to verify that there are 10 images on the entire homepage. The addition of the site logo has upped the number of images on the homepage to 11. A CSS selector can provide the necessary context to only check meal thumbnails:
response.should have_selector("img", :count => 10)
end
Then /^the prominently displayed meals should include a thumbnail image$/ doThe additional context in the scenario step gets it passing, so now I can try defining the click-the-logo step:
response.should have_selector(".meals img", :count => 10)
end
When /^I click the site logo$/ doThat link is now on the page, thanks to the newly added layout, so this step is passing.
click_link "/"
end
The next step is simply verifying that the user is back on the homepage after clicking the site logo. At this point, the distinguishing characteristic of the homepage is the inclusion of 10 meal summaries. So I use that to verify this step:
Then /^I should see the homepage$/ doNow that the user has gone from homepage to meal, to recipe, and back to the homepage, the next step is clicking on the recipe text under the 6th meal on the homepage. The primary reason for choosing the 6th meal/recipe was that this was the first that was vegetarian (the first 5 were Italian). Subsequent steps will verify that it behaves like vegetarian recipes should (i.e. the vegetarian category link is highlighted).
response.should have_selector(".meals h2", :count => 10)
end
In this scenario, each meal has exactly one menu item—a recipe created just for that meal. Recipe names follow an obvious convention such that the recipe for the 6th meal should be named "Recipe for Meal 5" (meal indexes start at zero). The user should be able to click on the 6th recipe by clicking that text:
When /^I click the recipe link under the 6th meal$/ doThe second to last step in this scenario—verifying that the user is now on the recipe page—was already defined. After a small tweak to ensure that it applies for all recipes, I am onto the final step in this scenario, verifying that the vegetarian category is highlighted on this recipe page.
click_link "Recipe for Meal 5"
end
For a previous recipe, I defined a should-have-the-italian-category scenario step:
Then /^the Italian category should be highlighted$/ doA quick
response.should have_selector("a",
:class => "active",
:content => "Italian")
end
Regexp rewrite will get that step working for both Italian and vegetarian recipes:Then /^the (\w+) category should be highlighted$/ do |category|And, with that, I am all done with another scenario:
response.should have_selector("a",
:class => "active",
:content => category)
end
(commit)
With the entire scenario green, I will likely spend some time refactoring before moving onto the next scenario. Tomorrow.
No comments:
Post a Comment