Ruby pentru începători testarea aplicațiilor Web cu Capybara și Castraveți

Ruby este una dintre cele mai populare limbi folosite pe web. Desfășurăm o sesiune aici pe Nettuts +, care vă va prezenta Ruby, precum și marile cadre și instrumente care merg împreună cu dezvoltarea Ruby. În acest episod, veți afla despre testarea aplicațiilor dvs. Sinatra cu Cucumber, Capybara și Rspec.

În tutorialul precedent din această serie, ne-am uitat la Rspec și cum puteți face acest lucru cu ajutorul testării. Am menționat că, în următorul episod, ne-am uita la utilizarea Rspec pentru a testa aplicațiile web. Cu toate acestea, câțiva comentatori au menționat că ar fi interesați să vadă testarea cu Castraveți, de aceea vom folosi pentru a testa o aplicație web foarte simplă. De fapt, vom folosi o parte din Rspec pentru a obtine aceeasi sintaxa matcher asa cum ati vazut ultima data, dar setarea actuala a testului este in Cucumber.


Preferați un scenariu?


Pasul 1: Construirea aplicației

Vom crea o aplicație Sinatra incredibil de simplă pentru a testa. Pentru început, hai să creăm un dosar de proiect și să îl aruncăm într-un Gemfile:

Ce? Nu știți Gemfiles? Ieșiți de sub acea piatră și prindeți din nou episodul 8

 sursa: rubygems gem "sinatra" bijuterie "pusca" bijuterie "castravete" bijuterie "capybara" gem "rspec"

Acum fugi instalare pachet în acel director. Cu pietre instalate, suntem gata să mergem! (Opțional - dacă utilizați RVM - puteți instala aceste pietre pentru acest proiect numai dacă rulează rvm --rvmrc --create 1.9.2@cucumber_example; rulați acest lucru înainte instalare pachet)

Deci, deschideți un fișier numit myapp.rb; aici este aplicația noastră super simplă; simulează doar un site care vă permite să vă înscrieți pentru un buletin informativ.

 necesită clasa MyApp "sinatra / base" < Sinatra::Base get "/" do erb :index end post "/thankyou" do @name = params["name"] @email = params["email"] erb :thankyou end get "/form" do erb :form end end

Dacă nu sunteți familiarizat cu Sinatra, verificați sesiunile excelente ale lui Dan Harper Cântând cu Sinatra; care te va face să fugi în picioare cu elementele de bază în cel mai scurt timp.

Dacă sunteți familiarizat cu Sinatra, veți vedea că noi creați trei căi aici; pe pagina de pornire ('/'), redăm doar index.erb șablon (mai multe despre șabloane într-un minut). Dacă primim o solicitare de post la cale /mulțumesc, luăm valorile Nume și e-mail parametrii și să le atribuiți variabilelor de instanță. Variabilele de instanță vor fi disponibile în interiorul oricărui șablon pe care îl oferim, ceea ce se întâmplă să fie thankyou.erb. În cele din urmă, la /formă, noi facem form.erb șablon.

Acum, să construim aceste șabloane. Sinatra va arăta în interiorul unui dosar cu "vederi" pentru șabloane, așa că să le punem acolo. După cum ați văzut myapp.rb, folosim ERB pentru a reda șabloanele, așa că vor fi, bineînțeles, șabloane ERB. Dacă avem a layout.erb șablon, va înfășura toate celelalte șabloane. Deci, să facem acest lucru:

layout.erb

     APLICAȚIA   

APLICAȚIA

<%= yield %>

Apelarea Randament va fi locul unde sunt inserate celelalte șabloane. Și celelalte șabloane sunt destul de simple:

index.erb

 

Aceasta este pagina de pornire

Înscrieți-vă pentru newsletter-ul nostru!

form.erb

 

Completați acest formular pentru a primi newsletter-ul nostru.

thankyou.erb

 

bună, <%= @name %>. Veți primi acum e-mailul nostru la <%= @email %>

Deci, este aplicația noastră. Pentru a le testa manual, puteți pune acest lucru într-un config.ru fişier:

 cereți "./myapp" rulați MyApp

Și apoi fugi pusca în terminal. Acest lucru va porni un webserver, probabil pe portul 9393. Acum puteți încerca să încercați aplicația web. Dar vrem să automatizăm această testare, nu? S-o facem!


Pasul 2: Setarea mediului nostru de testare

Castravete facturile în sine ca? Comportament condus de dezvoltare cu eleganță și bucurie.? În timp ce bucuria mi se pare oarecum multumită, cred că amândoi suntem de acord cu eleganța, căci Cucumber o are.

Deoarece dezvoltarea comportamentului este parțial de a înțelege ce vrea clientul înainte de a începe codarea, Cucumber își propune să facă testele sale citibile de către clienți (AKA, non-programatori). Deci, veți vedea aici că toate testele dvs. sunt scrise în ceea ce pare a fi text simplu (de fapt, Gherkin).

Amintiți-vă cum, cu Rspec, avem fișiere de spec. Separate pentru a descrie funcționalități diferite? În Cucumber-vorbesc, acestea sunt caracteristici, și toate aparțin într-o? Caracteristici? pliant. În interiorul acelui dosar creați încă două dosare numite "suport"? și?.?

În interiorul suportului? dosar, deschideți un env.rb. Acest cod va configura mediul de testare. Iată ce avem nevoie:

 require_relative "? /? / myapp" necesită "Capybara" necesită "Capybara / castravete" necesită "rspec" World do Capybara.app = MyApp include Capybara :: DSL include RSpec :: Matchers end

Acest lucru necesită diferitele biblioteci de care avem nevoie și care le utilizează include să-și încarce metodele în mediul nostru. Ce este Capybara pe care îl folosim? Practic, este funcționalitatea care ne permite să folosim aplicația noastră web, astfel încât să o putem testa. Este important să setați Capybara.app la aplicația noastră. Ar trebui să menționez că, făcând asta cu o aplicație Rails, cea mai mare parte a acestei configurații se va face automat pentru noi.

(Notă: în ecran, I include RSpec :: Așteptări unneccessarily; lăsați-o afară.)

Bine, deci, să scriem câteva teste!


Pasul 3 Scrierea testelor

Să începem cu pagina noastră de pornire. Deschideți fișierul home_pages.feature (în dosarul "caracteristici?") și începeți cu aceasta:

 Caracteristică: Vizitatorul vizitează pagina de pornire Pentru a citi pagina Ca utilizator, vreau să văd pagina de pornire a aplicației mele

Aceasta este o modalitate obișnuită de a porni un fișier caracteristic; Nu prea arata codul, nu-i asa? Ei bine, este Gherkin, o limbă specifică domeniului (DSL) care vă permite să descrieți comportamentul software-ului fără a detalia modul în care este implementat acest comportament. Ceea ce am scris până acum nu merge în nici un fel, dar explică scopul acestei trăsături. Iată structura generală:

 În scopul de a [obiectiv] Ca un [rol] vreau [caracteristică]

Nu trebuie să urmați acel șablon: puteți pune orice doriți; scopul este acela de a descrie caracteristica. Cu toate acestea, acest lucru pare să fie un model comun.

Apare o listă de scenarii care descriu caracteristica. Iată primul:

 Scenariu: Vezi pagina inițială Având în vedere că sunt pe pagina de start, atunci ar trebui să văd "Aceasta este pagina de pornire".

Fiecare scenariu poate avea până la trei părți: Dats, Cands, și Atuncis:

  • Dat - Dat liniile descriu ce condiție prealabilă ar trebui să existe.
  • Cand - Cand linii descriu acțiunile pe care le luați.
  • Atunci - Atunci liniile descriu rezultatul.

Există, de asemenea Și linii, care fac tot ce face linia deasupra lor. De exemplu:

 Având în vedere că sunt pe pagina de pornire Și eu sunt semnat Atunci ar trebui să văd "Bine ați revenit!" Și ar trebui să văd "Setări"

În acest caz, primul Și line acționează ca a Dat line, iar al doilea acționează ca a Atunci linia.

Vom vedea câteva Cand linii în curând. Dar acum, să conducem testul. Pentru a face asta, fugi castravete în terminal. Probabil veți vedea ceva de genul:

Fișierele caracteristicilor de castraveți sunt scrise pentru a putea fi citite de către non-programatori, așa că trebuie să implementăm definițiile pașilor pentru pași nedefiniți. Din fericire, Cucumber ne dă niște fragmente pentru a începe.

Privind aceste fragmente, puteți vedea cum va funcționa acest lucru. Fiecare pas se potrivește cu o expresie regulată. Valorile cotate vor fi captate și transmise ca parametru bloc. În interiorul blocului, facem tot ce ne așteptăm să se întâmple ca urmare a acestui pas. Acesta ar putea fi setul de cod în Dat pași, unele calcule sau acțiuni în Cand etape și o comparație în Atunci pași.

Cucumber va încărca toate fișierele din folderul? Features / step_definitions? pentru pași, așa că hai să creăm? sinatra_steps.rb? fișier și adăugați acești doi pași:

 Având în vedere / ^ Sunt pe pagina de pornire $ / do vizitați "/" sfârșitul Apoi / ^ ar trebui să văd "([^"] *) "$ / do | text | page.should have_content text end

În acest fragment mic aici, folosim Castraveți, Rspec și Capybara. În primul rând, avem castraveții Dat și Atunci apeluri metodice. În al doilea rând, folosim metodele Capybara vizita (pentru a vizita o adresă URL) și has_content?. Dar tu nu vezi apelul has_content? deoarece am încărcat materialele RSpec, astfel încât să putem face ca testele noastre să fie citite așa cum ar face-o cu Rspec. Dacă vrem să părăsim RSpec, vom scrie doar page.has_content? text.

Dacă fugi castravete din nou, veți vedea că testele noastre trec:

Să adăugăm încă două scenarii pentru pagina noastră de pornire:

Scenariu: Găsiți poziția pe pagina de pornire Având în vedere că sunt pe pagina de start Apoi ar trebui să văd "APAREA MEA" în selectorul "h1" Scenariu: Găsiți linkul către formularul Având în vedere că sunt pe pagina de start, atunci ar trebui să văd "Înscrieți-vă pentru newsletter-ul nostru. " într-o legătură

Acestea necesită încă două Atunci pași, așa cum veți găsi dacă încercați să rulați acest lucru. Adăugați-le la sinatra_steps.rb:

 Apoi / ^ ar trebui să văd "([^"] *) "în selectorul" ([^ "] *)" $ / do | text, selector | page.should have_selector selector, content: text end Apoi / ^ ar trebui să văd "([^"] *) "într-un link $ / do | text | page.should have_link sfârșitul textului

Ar trebui să știți ce fac acestea: primul caută textul într-un anumit element al paginii. Al doilea caută o legătură cu textul dat (da, ai fi putut face Atunci ar trebui să văd "Înscrieți-vă?" În selectorul "a", dar am vrut să vă mai folosiți o altă metodă Capybara / Rspec)

Din nou, fugi castravete; veți vedea toate testele noastre trecând:

Să deschidem acum funcțiile / form_page.feature ?; aruncați acest lucru acolo:

 Caracteristică: Vizualizatorul se înscrie pentru buletinul informativ Pentru a primi newsetterul Ca utilizator al site-ului vreau să mă înscriu la buletinul informativ Scenariu: Afișați pagina formularului Având în vedere că sunt pe "/ form" Atunci ar trebui să văd "Umpleți din acest formular pentru a primi newsletter-ul nostru. " Scenariu: Completați formularul Având în vedere că sunt pe "/ form" Când completez "nume" cu "John Doe" Și completez "email" cu "[email protected]" Și fac clic pe "Înscrieți-vă! Apoi ar trebui să văd "Bună, John Doe, vei primi noul nostru newsletter la [email protected]"

Primul scenariu aici este destul de simplu, deși trebuie să scriem Dat pas pentru este. Probabil vă dați seama cum să faceți acest lucru până acum:

 Având în vedere / ^ Sunt pe "([^"] *) "$ / do | path |

Cel de-al doilea este puțin mai profund. Pentru prima dată, folosim Cand pași (amintiți-vă Și pașii care urmează Cand pas sunt, de asemenea Cand pași). E destul de clar ce anume Cand ar trebui să faceți pași, dar cum facem asta în codul Ruby? Din fericire, Capybara are câteva metode utile pentru a ajuta:

 Când / ^ am completat "([^"] *) "cu" ([^ "] *)" $ / do | element, text | elementul fill_in, cu: sfârșitul textului Când / ^ I dau clic pe "([^"] *) "$ / do | element | click_on element end

Folosim a umple , care ia numele sau atributul id al unui element pe pagină. De asemenea, folosim Click pe, care va face clic pe elementul cu textul, idul sau valoarea dată. Există și cele mai specifice click_link și click_button. Pentru a vedea mai multe, verificați Capybara Readme. Răsfoiți în jurul valorii de? DSL? pentru a vedea mai multe dintre metodele pe care Capybara le oferă.

Când alergi castravete acum, ar trebui să luați toate testele noastre, trecând:


Concluzie

Realizați că ceea ce testează aici este interfața justă, nu codul de bază. Dacă codul nostru te-a înscris într-adevăr pentru newsletter, ar trebui să testăm și codul care adaugă numele și adresa de e-mail în baza noastră de date etc. Doar pentru că vedem ce ar trebui să vedem, nu înseamnă că noi - De fapt, voi primi buletinul informativ, nu? Acest lucru ar trebui să fie testat separat.

Și asta testează aplicațiile web cu utilizatorii de Cucumber, Capybara și Rspec. După cum am menționat, verificați documentele Capybara pentru mai multe!

Cod