[ WrocLoveRb 2012] user perspective testing using ruby

2,085 views

Published on

How we are writing user perspective tests using tools rspec, capybara, kameleon. To get more readable & maintaiable integration and acceptance tests .

https://github.com/cs3b/kameleon

Published in: Technology, Art & Photos
0 Comments
1 Like
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total views
2,085
On SlideShare
0
From Embeds
0
Number of Embeds
61
Actions
Shares
0
Downloads
14
Comments
0
Likes
1
Embeds 0
No embeds

No notes for slide

[ WrocLoveRb 2012] user perspective testing using ruby

  1. 1. User perspectivetesting using Ruby Michał Czyż @cs3b
  2. 2. selleo.com
  3. 3. http://webout.eu
  4. 4. User perspectivetesting using Ruby
  5. 5. https://twitter.com/#!/moonmaster9000/status/169540724474384384
  6. 6. https://twitter.com/#!/athoshun/statuses/165138347432488962
  7. 7. https://twitter.com/#!/defkode/status/124066265642967040http://www.jackkinsella.ie/2011/09/26/why-bother-with-cucumber-testing.html
  8. 8. http://blog.jonasbandi.net/2010/09/acceptance-vs-integration-tests.html
  9. 9. KAMELEONhttp://www.funnypictures24.com/funny2/funnyphotoshopped166.jpg
  10. 10. fill_in & withinpage.fill_in Login, :with => me@in.compage.within(body) do ... end
  11. 11. click
  12. 12. click Administrations, Products,click :and_dismiss => Deleteclick :and_accept => Deleteclick :image => OKclick :element => "#some_div"
  13. 13. fill_in
  14. 14. fill_in www.selleo.com => Linkfill_in www.selleo.com => Link Selleo => Company, Poland => Country
  15. 15. fill_in :check => Remember mefill_in :check => [ Red, Green, Grey ]
  16. 16. fill_in :uncheck => Remember mefill_in :uncheck => [ Red, Green, Grey ]
  17. 17. fill_in :choose => Femalefill_in :choose => [ Europe, Poland ]
  18. 18. fill_in :select => { Poland => Countries }fill_in :select => { Poland => Countries, Silesia => Provinces }
  19. 19. fill_in :unselect => { Poland => Countries }fill_in :unselect => { Poland => Countries, Silesia => Provinces }
  20. 20. fill_in :attach => { me.png => Avatar}fill_in :attach => { me.png => Avatar, selleo.png => Company Logo }
  21. 21. # spec_helper.rbKameleon.configure do |c| c.assets_dir = (...)/fixtures/assetsend
  22. 22. see
  23. 23. see www.selleo.com,see one, another piece of text, and another one
  24. 24. see :link => Wrocloverbsee :link => { Wrocloverb => http://wrocloverb.com }see :links => { Wrocloverb => http://wrocloverb.com, Selleo => http://www.selleo.com }
  25. 25. see :image => OKsee :image => icon_ok.pngsee :images => [ completed, approved ]
  26. 26. see Ruby => First Namesee Wisła => City, Silesia => Province
  27. 27. see :field => Emailsee :fields => [Email, City, Street ]
  28. 28. see :empty => Last Namesee :empty => [ Last Name, City ]
  29. 29. see :checked => Remember mesee :checked => [ Newsletter, Remember me ]
  30. 30. see :unchecked => Remember mesee :unchecked => [ Newsletter, Remember me ]
  31. 31. see :selected => { Poland => Countries }see :selected => { Poland => Countries, Silesia => Provinces }
  32. 32. see :selected => { [ Red, Green, Orange ] => Colors }
  33. 33. see :unselected => { Poland => Countries }see :unselected => { Poland => Countries, Silesia => Provinces }
  34. 34. see :unselected => { [ Red, Green, Orange ] => Colors }
  35. 35. see :ordered => [ Bart, Tom, Anette ]
  36. 36. see 5 => ".element"see 3 => :menu_itemsee 5 => [:xpath, //div[@class="element"] ]
  37. 37. not_see
  38. 38. not_see phpnot_see java, c#, .net
  39. 39. not_see :field => Emailnot_see :fields => [ Email, City, Street ]
  40. 40. not_see :link => Wrocloverbnot_see :link => { Wrocloverb => http://wrocloverb.com }not_see :links => [ Wrocloverb, Selleo ]
  41. 41. not_see :image => OKnot_see :image => ok.pngnot_see :images => [ OK, rails.png ]
  42. 42. act_as
  43. 43. visit(/)act_as(:default) do click Productsend
  44. 44. visit(/)create_session(:user)visit(/login)act_as(:default) do not_see :field => Emailendact_as(:user)see :fields => [ Email, Password ]
  45. 45. http://s1.desktopia.net/wp-content/uploads/walls/thumbs/Funny-Chameleon-575x359.jpg
  46. 46. click_link "Products"within(table.index tr:nth-child(2)) { page.should have_content("apache baseball cap") }within(table.index tr:nth-child(3)) { page.should have_content("zomg shirt") }click_link "admin_products_listing_name_title"within(table.index tr:nth-child(2)) { page.should have_content("zomg shirt") }within(table.index tr:nth-child(3)) { page.should have_content("apache baseball cap") }https://github.com/spree/spree/blob/master/core/spec/requests/admin/products/products_spec.rb#L22
  47. 47. click "Products"within(table.index) do see :ordered => [ "apache baseball cap", "zomg shirt" ]endclick "admin_products_listing_name_title"within(table.index) do see :ordered => [ "zomg shirt", "apache baseball cap"]end
  48. 48. click_link "Products"click_link "admin_new_product"fill_in "product_name", :with => "Baseball Cap"fill_in "product_sku", :with => "B100"fill_in "product_price", :with => "100"fill_in "product_available_on", :with => "2012/01/24"select "Size", :from => "Prototype"check "Large"click_button "Create"page.should have_content("successfullycreated!")https://github.com/spree/spree/blob/master/core/spec/requests/admin/products/products_spec.rb#L77
  49. 49. click "Products", "admin_new_product"fill_in "Baseball Cap" => "product_name", "B100" => "product_sku", "100" => "product_price", "2012/01/24" => "product_available_on", :select => { "Size" => "Prototype" }, :check => "Large"click "Create"see "successfully created!"
  50. 50. within(:css, table.index tr:nth-child(2)) { click_link "Edit" }fill_in "adjustment_amount", :with => "99"fill_in "adjustment_label", :with => "rebate 99"click_button "Continue"page.should have_content("successfully updated!")page.should have_content("rebate 99")page.should have_content("$99.00")https://github.com/spree/spree/blob/master/core/spec/requests/admin/orders/adjustments_spec.rb#L48
  51. 51. within(:row => 2) { click "Edit" }fill_in 99 => "adjustment_amount", "rebate 99" => "adjustment_label"click "Continue"see "successfully updated!", "rebate 99", "$99.00"
  52. 52. click_link "Orders"within(table#listing_orders tbody tr:nth-child(1)) { click_link "R100" }click_link "Payments"within(#payment_status) { page.shouldhave_content("Payment: balance due") }find(table.index tbody tr:nth-child(2) td:nth-child(2)).text.should == "$39.98"find(table.index tbody tr:nth-child(2) td:nth-child(3)).text.should == "Credit Card"find(table.index tbody tr:nth-child(2) td:nth-child(4)).text.should == "pending"https://github.com/spree/spree/blob/master/core/spec/requests/admin/orders/payments_spec.rb#L32
  53. 53. click "Orders"within(table#listing_orders, :row => 1) do click_link "R100"endclick "Payments"within(#payment_status) do see("Payment: balance due")endwithin(:cell =>[2,2]) { see "$39.98" }within(:cell =>[2,3]) { see "Credit Card" }within(:cell =>[2,4]) { see "pending" }
  54. 54. DEMO inspired by a case takenfrom a production system
  55. 55. create_session(:user)sign_in_as(:user)create_session(:admin)sign_in_as(:admin)
  56. 56. act_as(:user) do not_see IS OPEN, IS CLOSED within(:right_column) do not_see Submit a proposal, Submit endend
  57. 57. act_as(:admin) do within(:menu) { click Set Contest } fill_in S vs C => Name, 2012-01-19 08:00:00 => starts at, 2012-01-20 08:00:00 => ends at click Create Contest see Contest was successfully createdend
  58. 58. Timecop.travel(2012, 1, 19, 8, 59, 55) do act_as(:user) do refresh_page see IS CLOSED sleep 10 not_see IS CLOSED see IS OPEN endend
  59. 59. Timecop.travel(2012, 1, 19, 9, 1, 1) do act_as(:user) do refresh_page %w(ruby ... haml).each do |content| fill_in content => proposal_content click Submit end end
  60. 60. act_as(:admin) do click Sticker proposals, Load more %w(ruby ... html).each do |c| within(:proposal_with_content => c) do click favorite end endend
  61. 61. act_as(:user) do refresh_page %w(...).each_with_index do |c, r| within(:proposal_with_content => c) do click "Rate #{r+1} out of 5" end endend
  62. 62. act_as(:user) do %w(ruby coffescript).each do |c| within(:proposal_with_content => c) do click Comment fill_in "sample text #{c}" => body click Create comment end endend
  63. 63. Timecop.travel(2012, 1, 20, 11, 10, 10) do act_as(:admin) do refresh_page click Load more %w(html python).each do |c| within(:proposal_with_content => c) do click choose end end end
  64. 64. act_as(:user) do refresh_page click Gallery within(:ordered_list) do see *(%w(html python)) not_see *(%w(ruby ... coffescript)) endend
  65. 65. act_as(:admin) do click Gallery, Add new production picture fill_in Sample title for picture => Title, :attach => {pict.jpg => Image} click Create Gallery imageend
  66. 66. act_as(:user) do click Gallery fill_in :select => {S vs C => contest_id} within(:gallery_list) do see :image => Thumb_pict endend
  67. 67. act_as(:admin) do click Add new contest sticker fill_in Sample title for picture => Title, :attach => {pict2.jpg => Image} click Create Gallery imageend
  68. 68. act_as(:user) do click Gallery fill_in :select => {S vs C => contest_id} within(:gallery_list) do see :image => Thumb_pict2 endend
  69. 69. http://2.bp.blogspot.com/_bVtGlUaW-tA/TMOUvmYXzHI/AAAAAAAAP90/SR5yHHWydN4/s1600/Mech_chameleon_by_tommaso_sanguigni.jpg
  70. 70. # gemfilegem kameleon, >= 0.2.0.alpha.2gem headless# spec_helper.rbrequire kameleonrequire kameleon/ext/rspec/all
  71. 71. # orrequire kameleon/ext/rspec/dsl# optional# .../rspec/garbage_collector# .../rspec/headless
  72. 72. SHARED DB CONNECTIONexample: lib/kameleon/ext/active_record/● shared_single_connection.rb● shared_single_connection_with_spork.rb
  73. 73. HEADLESSRSpec.configure do |config| config.before(:suite) do @headless = Headless.new(:display => 100) @headless.start end config.after(:suite) do @headless.stop if defined?(@headless) endendrequire kameleon/ext/rspec/headless
  74. 74. RIPL config.after(:each) do if exception = example.instance_variable_get(:@exception) Ripl.start :binding => binding end endexample: lib/kameleon/utils/debug_console.rb
  75. 75. LINKSRSPEC ● http://pragprog.com/book/achbd/the-rspec-book ● https://www.relishapp.com/rspecCAPYBARA ● https://github.com/jnicklas/capybaraXPATH ● http://www.w3.org/TR/xpath/ ● https://addons.mozilla.org/en-US/firefox/addon/firepath/SELENIUM ● http://seleniumhq.org/docs/WEBKIT ● https://github.com/thoughtbot/capybara-webkitKAMELEON● https://github.com/cs3b/kame leon
  76. 76. THANKS :-)questions ? http://selleo.com/people/michal-czyz http://cs3b.com

×