Ruby on Rails crash course #2 – first step

Melanjutkan project kita sebelumnya, sekarang kita akan mulai membuat aplikasi todo list kita, kita sebut aplikasi kita mytasks.

Sebelumnya pastikan rails, rspec, rspec-rails, factory_girl dan cucumber sudah terinstall di komputer kita, lalu kita buat aplikasi kita dengan perintah

$ rails mytasks
$ cd mytasks

Perintah ini akan membuat susunan direktori aplikasi kita lalu kita masuk kedalam direktori aplikasi kita, lalu kita lanjutkan dengan membuat direktori yang diperlukan oleh rspec

$ ./script/generate rspec

kita lanjutkan dengan membuat susunan direktori yang diperlukan oleh cucumber dengan perintah

$ ./script/generate cucumber

lalu kita perlu hapus file index.html agar kita bisa menentukan halaman root atau homepage kita

$ rm public/index.html

lalu kita buat file feature untuk menyebutkan fitur aplikasi kita yang pertama, kita namakan file kita homepage_access.feature (cucumber memerlukan file yang menyebutkan fitur aplikasi dengan ekstensi .feature). Disini saya akan menggunakan vim, tapi kita bisa pakai text editor apapun. File feature ini akan berada di dalam direktori feature

$ vim feature/homepage_access.feature

Isi file itu kira-kira seperti ini

Feature: Homepage access
     In order access the application
     As an anonymous user
     I want to be able to visit the homepage

     Scenario: Homepage access
         Given I am not registered to the application
         When I go to the homepage
         Then I should see "Welcome to mytask"

Untuk mengetahui lebih jauh tentang cucumber coba main ke situsnya atau kalau mau lihat contohnya bisa lihat screencast dari Ryan Bates. Setelah kita simpan file feature ini, kita coba jalankan perintah

$ cucumber features

Output perintah tersebut kira-kira seperti ini

Feature: Homepage access
 In order to access the application
 As an anonymous user
 I want to be able to visit the homepage

 Scenario: Homepage access                    # features/user_login.feature:6
 Given I am not registered to the application # features/user_login.feature:7
 When I go to the homepage                    # features/step_definitions/webrat_steps.rb:10
 Then I should see "Welcome to mytask"        # features/step_definitions/webrat_steps.rb:93

1 scenario (1 undefined)
3 steps (2 skipped, 1 undefined)
0m0.187s

You can implement step definitions for undefined steps with these snippets:

Given /^I am not registered to the application$/ do
 pending
end

dari hasil perintah diatas kita lihat bahwa ada dua step yang di lewati oleh cucumber dan satu step yang masih belum dikenali. Untuk membuat step – step tersebut passed kita perlu membuat file step definition. Kita buat file dengan nama homepage_access_step.rb dan kita simpan dalam direktori feature/step_definitions. Isi file tersebut kira – kira seperti ini (cukup copy paste dari snippet yang disediakan diatas dan edit baris yang berisi kata pending)

Given /^I am not registered to the application$/ do
    User.delete_all
end

kita simpan file itu lalu kita jalankan perintah cucumber features lagi, hasilnya seperti ini (beberapa bagian dipotong agar tidak terlalu panjang)

 Scenario: Homepage access                    # features/user_login.feature:6
 Given I am not registered to the application # features/step_definitions/homepage_access_step.rb:1
 uninitialized constant User (NameError)
 ./features/step_definitions/homepage_access_step.rb:2:in `/^I am not registered to the application$/'
 features/user_login.feature:7:in `Given I am not registered to the application'

1 scenario (1 failed)
3 steps (1 failed, 2 skipped)

Apa? error? yup, cucumber mengeluh tentang uninitialized constant User (NameError), mengapa seperti itu? tentu saja, kita kan belum punya kelas User, untuk itu kita perlu membuat model User itu. Jalankan perintah berikut untuk membuat model User berikut Controller dan View-nya, lalu kita migrasikan databasenya dan kita clone ke database untuk test

$ ./script/generate rspec_scaffold User login:string password:string name:string
$ rake db:migrate
$ rake db:test:clone

lalu kita jalankan perintah cucumber features lagi, kali ini hasilnya

 Scenario: Homepage access                    # features/user_login.feature:6
 Given I am not registered to the application # features/step_definitions/homepage_access_step.rb:1
 When I go to the homepage                    # features/step_definitions/webrat_steps.rb:10
 No route matches "/" with {:method=>:get} (ActionController::RoutingError)
 (eval):2:in `visit'
 ./features/step_definitions/webrat_steps.rb:11:in `/^I go to (.+)$/'
 features/user_login.feature:8:in `When I go to the homepage'

sekarang cucumber mengeluh bahwa dia tidak bisa menemukan route untuk the homepage, untuk itu kita harus menambahkan mapping di file routes.rb. Kita buka file config/routes.rb dan kita tambahkan baris berikut di bawah baris yang berisi map.resources :users, hasilnya seperti ini

map.resources :users
map.root :controller => 'homepage'

lagi kita jalankan cucumber features, kali ini hasilnya

When I go to the homepage                    # features/step_definitions/webrat_steps.rb:10
 uninitialized constant HomepageController (NameError)
 (eval):2:in `visit'
 ./features/step_definitions/webrat_steps.rb:11:in `/^I go to (.+)$/'
 features/user_login.feature:8:in `When I go to the homepage'

uninitialized constant HomepageController (NameError), tentunya karena kita belum punya HomepageController, tak masalah, kita bisa buat dengan perintah berikut

$ ./script/generate rspec_controller homepage index

lagi -lagi kita jalankan cuucmber features

Given I am not registered to the application # features/step_definitions/homepage_access_step.rb:1
 When I go to the homepage                    # features/step_definitions/webrat_steps.rb:10
 Then I should see "Welcome to mytask"        # features/step_definitions/webrat_steps.rb:93
 expected the following element's content to include "Welcome to mytask":
 Homepage#index
 Find me in app/views/homepage/index.html.erb (Spec::Expectations::ExpectationNotMetError)
 ./features/step_definitions/webrat_steps.rb:94:in `/^I should see "([^\"]*)"$/'
 features/user_login.feature:9:in `Then I should see "Welcome to mytask"'

kali ini errornya berbeda, cucumber mengeluh tidak melihat kata-kata Welcome to mytask, kali ini yang perlu kita perbaiki adalah file index.html.erb. buka file app/views/homepage/index.html.erb dan edit hingga hasilnya kira – kira seperti ini

<h1>Welcome to mytask</h1>
Some other content goes here...

dan kita jalankan perintah cucumber features lagi, sekarang hasilnya…

Feature: Homepage access
    In order to access the application
    As an anonymous user
    I want to be able to visit the homepage

  Scenario: Homepage access                      # features/user_login.feature:6
    Given I am not registered to the application # features/step_definitions/homepage_access_step.rb:1
    When I go to the homepage                    # features/step_definitions/webrat_steps.rb:10
    Then I should see "Welcome to mytask"        # features/step_definitions/webrat_steps.rb:93

1 scenario (1 passed)
3 steps (3 passed)

Yay… kali ini semua skenario dan step lolos.

Apa yang kita dapatkan dari sini? dengan cucumber dan rspec kita menerapkan konsep BDD ketika kita mengembangkan aplikasi, dimana BDD ini menekankan bahwa kita menulis test dulu baru kode untuk aplikasi kita. Cucumber juga menerapkan konsep pengembangan Outside In, dimana cucumber akan menjalankan test seperti layaknya user kita berinteraksi dengan aplikasi kita, untuk lebih tahu tentang cucumber, rspec silahkan main ke situsnya masing-masing, saya juga ga terlalu bisa menjelaskan :p.

Selanjutnya kita akan lebih berfokus dengan rspec untuk menjalankan unit testing, sambung ke episode berikutnya…

Welcome to mytask
Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s