Setting Up a Rails 3 Project wit Cucumber

 Start by generating a new Rails app:
$ rails new showtime

This creates a showtime directory and generates the skeleton for a Rails
app inside it. Now cd into that directory, and take a look around:

$ cd showtime

One of the generated files is the Gemfile we use to configure the gems
we want bundled with our app using Bundler. Open the Gemfile, and
modify it as follows:



gem 'mysql'
gem 'therubyracer'

group :development, :test do
gem "rspec-rails", ">= 2.0.0"
gem "cucumber-rails", ">= 0.3.2"
gem "webrat", ">= 0.7.2"
end


We add these to the :development group so that their generators and
rake tasks are available without having to type RAILS_ENV=test. We add
them to the :test group to make sure that their code is available when
running in the test environment.

Now we’ll use Bundler to install those gems and all of their dependen-
cies:
$ bundle


Now we’ll use the rspec:install generator to install a few files we’ll need in
the app:

$ rails g rspec:install
create .rspec
create spec
create spec/spec_helper.rb
create autotest
create autotest/discover.rb

Here’s a description of each file and directory that was generated:
• spec: The directory where you place specs for your Rails app.
• .rspec: Add options to this file that you want rspec to utilize when
running any of the rake spec tasks.
• spec/spec_helper.rb: This file is used to load and configure rspec.
It is also where you would require and configure any additional
helpers or tools that your project utilizes when running specs.
• autotest/discover.rb: Used by Autotest to discover what type of Auto-
test class to load.

Now we’ll use the cucumber:install generator to install files Cucumber
needs:
$ rails g cucumber:install
create config/cucumber.yml
create script/cucumber
chmod script/cucumber
create features/step_definitions
create features/step_definitions/web_steps.rb
create features/support
create features/support/env.rb
create features/support/paths.rb
exist lib/tasks
create lib/tasks/cucumber.rake
gsub config/database.yml
gsub config/database.yml
force config/database.yml


Cucumber adds a few more files than RSpec does. Let’s take a look at
each one:
• config/cucumber.yml: Used to store profiles that provide control
over what features and scenarios to run. See Section 18.9, Con-
figuration, on page 280.
• script/cucumber: The command-line feature runner.
• features/step_definitions: All of your step definitions will go in this
directory.
• features/step_definitions/web_steps.rb: Contains step definitions that
are commonly used with web apps. We’ll learn more about this file
in Chapter 21, Simulating the Browser with Webrat, on page 298.
• features/support: This directory holds any Ruby code that needs to
be loaded to run your scenarios that are not step definitions, like
helper methods shared between step definitions.
• features/support/env.rb: Bootstraps and configures the Cucumber
runner environment.
• features/support/paths.rb: Support for mapping descriptive page
names used in scenario steps to their URLs.

• lib/tasks/cucumber.rake: Adds the rake cucumber task, which pre-
pares the test database and runs all of your application’s features.
And that’s it!

To make sure everything is wired up correctly, run these
commands:

$rake db:migrate
$rake db:test:prepare
$rake spec
$rake cucumber

You should see output like this when you run rake spec:2
No examples matching ./spec/**/*_spec.rb could be found
And you should see output like this when you run rake cucumber:
0 scenarios
0 step

HOW SIMPLE FANCYBOX IS IN RAILS 3 ?

gem 'jquery-rails'
gem 'fancybox-rails'

Then run bundle install to update your application's bundle.

Now you need to edit your app/assets/javascripts/application.js file and add the following line:

//= require jquery
//= require fancybox

And then edit your app/assets/stylesheets/application.css file to look something like:

/*
 *= require_self    # it may be present previously , so if system crash remove it
 *= require fancybox
 *= require_tree .
 */



Then in the view page where you want to add  fancy box design just add the following function within head in script tag

<script type = "text/javascript">
$(document).ready(function() {

/* This is basic - uses default settings */

$("a.flickr_photo").fancybox({'type': 'image'});/*a.flickr_photo is for creating flickr_photo class that too within  fancybox*/
$("a.flickr_ajax").fancybox();/* in the same way , flickr_ajax is another class , */
/*we ll create different class and ll reference to those class where we want

 });
</script>


then in the link add some code
<a class='flickr_photo' href="/assets/product/<%=prod.image%>">
we add the above line before image tag