Tests Interfaces Web avec Rails

http://www.21croissants.com

Les Tests d'Interface Web
avec Rails
PARIS ON RAILS – 1er Décembre 2008

Paris On Rail 2008 – Copyright (c) Garnier Jean-Michel. Licence: Creative Commons.

Tests unitaires
Vues, Helpers, js

3

2 frameworks de test:

test/functional/
Test::Unit
assert_select
assert_select_RJS

OU

RSpec specs/helpers
spec/views

4

RSpec minimaliste des Vues
describe quot;/events/showquot; do

before(:each) do
@event = stub_event_in_barcelona
assigns[:event] = @event
render('/events/show')
end

it quot;should render correctly an eventquot; do
response.should include_text( @event.name )
end

end

5

TDD javascript avec ScrewUnit

/! Ne pas tester jQuery ou
Prototype /!

http://pivotallabs.com/users/nick/blog/articles/447-screw-unit-0-3

script/plugin install git://github.com/pivotal/screw-unit-server.git

6

// RAILS_ROOT/public/javascripts/application.js
require(quot;/implementations/applicationquot;);

Screw.Unit(function() {
describe('HelloWorldExampleClass', function() {
var hello;

describe('#helloWorld', function() {
describe('when running ...', function() {
before(function() {
hello = new HelloWorldExample({});
});

it(quot;should say 'Hello World!'quot;, function() {
expect(hello.sayHelloWorld()).to(equal,
quot;Hello World!quot;);
});
});

... 7

script/screw_unit_server
http://0.0.0.0:8080/specs

Onclick: lance le test
8

Tests Acceptance
Utilisateur avec cucumber
http://github.com/aslakhellesoy/cucumber/wikis/ruby-on-rails

9

Fonctionnalités utilisées

Source:
Aslak Hellesøy
CHAOS report
10

Origine des erreurs

Source:
Aslak Hellesøy
CHAOS report
11

Août 2008 : cucumber

Aslak Hellesøy

Fonctionnalité + cucumber
.txt = Spec exécutable

12

Le dernier joujou des alpha geeks?

13

/features/calculatrice.feature

Fonctionnalité: Addition

Afin de financer mon bonus Valeur
avec l'argent des pigeons

En tant que trader Rôle

Je souhaite pouvoir additionner 2 chiffres
Fonctionnalité
14

GIVEN: contexte, pré-conditions

Scénario:
Addition de produits dérivés
GIVEN
Étant donné que je tape 55000000000000

Et que je tape 2

Lorsque je tape additionner

Alors le résultat doit être 5500000000002
15

WHEN: événement, action

Scénario:

Et que je tape 2
WHEN

16

Boulot du développeur
 Aider le client à rédiger des critères
d'acceptance
 Ecrire le code ruby de chaque « step »
pour que les fonctionnalités soient
exécutées

17

THEN: résultat, post-conditions

Scénario:

Et que je tape 2

THEN

18

/features/step_definitions/calculatrice.rb
Be fo re do
@calc = Ca l cu la t r i ce.new
end

# Etant donné que je tape / Et que je tape
Given /que je tape (d+)/ do |n|
@calc.push n.to_i
end

# Lorsque je tape additionner
When 'je tape additionner' do
@result = @calc.additionner
end

# Alors le résultat doit être ...
Then /le résultat doit être (d*)/ do |expected|
@result.should == expected.to_i
end Paris On Rail 2008 – Copyright (c) Garnier Jean-Michel. Licence: Creative Commons. 19

Exécution: rake features

20

Documentation à jour + exécutable

21

Le format de Tables à la FIT

Etant donné que je tape 2
Et que je tape 1
Plus d'exemples:
| a | b | somme |
|2|2|4 |
|2|3|5 |
22

rake features

23

Tests Acceptance
Utilisateur
avec cucumber + webrat
http://github.com/brynary/webrat

24

Web Application Ruby Acceptance Testing

25

Cucumber /features/step_definitions/
common_webrat_steps .fr
Given /^que je suis dans la page de quot;(.*)quot;$/ do |url|
visits url
end

When /^je tape quot;(.*)quot; dans le champ quot;(.*)quot;$/ do |
value, field|
fills_in(field, :with => value)
end

When /^je clique sur le bouton quot;(.*)quot;$/ do |button|
clicks_button(button)
end

Then /^je devrais voir le texte quot;(.*)quot;$/ do |text|
response_body.should contain(text)
end 26

Limitation de Webrat::RailsSession

« simule » le butineur, pas de render de
la page
=> Rapide :-)
=> Pas de support de javascript :-(

27

Webrat::CeleritySession
 1.1.4 et 6 ou

 Basé sur la librarie java HtmlUnit
 jgem install celerity + toutes tes gems du
projet
 jruby -S rake features
Prototype Ajax.update ne fonctionne pas :-(

28

Webrat::SeleniumSession rocks!
 Vidéo Selenium User group (fev 2008)
http://www.youtube.com/watch?v=EDb8yOM3Vpw

 « Fermes » selenium de google:
50 équipes & 51 000 tests
 Phillipe Hanrigou:
 gem install selenium-client
 Voir les /examples/ruby de

29

Tester Ajax
avec cucumber + webrat +
selenium
http://github.com/ph7/selenium-client/

30

La newsletter de lecool

31

Fonctionnalité: Programmation d'une journée de la newsletter
Afin de gagner du temps dans la programmation de la
Newsletter
En tant qu'éditeur de lecool, je souhaite
pouvoir changer l'ordre des événements par glisser-déposer

Scénario:
Etant donné que je suis logged in en tant qu'administrateur
Lorsque j'édite la newsletter quot;Barcelona Selected * 256quot;
Et que je clique sur l'événement quot;Los buenos muñecos viven
para siemprequot; pour le déposer sur l'événement quot;La Leyenda de
Los Planetasquot;
Alors l'évenement quot;Los buenos muñecos viven para siemprequot;
devrait être en position 2

32

# Etant donné que je suis logged in en tant qu'administrateur
Given /que je suis logged in en tant qu'administrateur/ do
user = User.find_by_nickname(...)
visits quot;/admin/loginquot;
fills_in(quot;Emailquot;, :with => quot;jm@lecool.comquot;)
fills_in(quot;Passwordquot;, :with => quot;12345678quot;)
clicks_button(quot;Sign inquot;)
end

Log:

33

# Lorsque j'édite la newsletter quot;Barcelona Selected * 256quot;
When /^j'édite la newsletter quot;(.*)quot;$/ do |name|
@newsletter = News le t te .find_by_title(name)
r
visits
quot;/admin/newsletters/#{@newsletter.id}/edit_newsletterquot;
end

34

# Et que je clique sur l'évenement quot;Los buenos muñecos viven para
siemprequot; pour le déposer sur l'évenement quot;La Leyenda de Los Planetasquot;

When /^que je clique sur l'évenement quot;(.*)quot; pour le
déposer sur l'évenement quot;(.*)quot;/ do |from_event_name,
to_event_name|
drag_and_drop_to_object xpath_event(from_event_name),
xpath_event(to_event_name)
wait_for_ajax
end

35

#Alors l'évenement quot;Los buenos muñecos viven para siemprequot;
devrait être en position 2
Then /^l'évenement quot;(.*)quot; devrait être en position
(d+)/ do |event_name, position|
Event.find_by_name(event_name).position_in_newsletter.
should == position.to_i
end

36

Fonctionnalité: Google map

Afin de pouvoir trouver plus facilement le lieu de l'événement
En tant que lecteur de lecool, je souhaite
pouvoir visualiser une google map

Scénario: Voir la carte d'un événement

Etant donné que je suis dans la page de quot;/cities/barcelona/quot;
Lorsque je clique sur quot;VIEW MAPquot; de l'événement quot;Lube
Magazinequot;
Et que je clique sur l'icône de l'événement
Alors je devrais voir le texte quot;Barcelonaquot;

37

# Etant donné que je suis dans la page de quot;/cities/barcelonaquot;
Given /^que je suis dans la page de quot;(.*)quot;$/ do |url|
visits url
end

CENSURE!

38

Lorsque je clique sur quot;VIEW MAPquot; de l'événement quot;Lube
Magazinequot;

When /^je clique sur
quot;VIEW MAPquot; de l'évenementquot;(.*)quot;
|event_name|
event =
Event.find_by_name(event_name)
clicks
quot;//a[@id=view_map-#{event_id}']quot;
wait_for_ajax
end

39

# Et que je clique sur l'icône de l'événement
When /^que je clique sur l'icône de l'évenement$/ do
clicks quot;mtgt_unnamed_0quot; # google map icon
end

40

Selenium IDE à la rescousse

41

Ouvre l'éditeur / Debugging
42

Intégration Continue

http://cruisecontrolrb.thoughtworks.com

cruise add <name> -u <url>
cruise start

Hudson
http://blog.huikau.com/2008/01/09/jruby-ruby-continuous-integration-with-hudson/


Merci de votre attention!

Questions - Réponses

44

Tests Interfaces Web avec Rails

Recommended

Recommended

More Related Content

Similar to Tests Interfaces Web avec Rails

Similar to Tests Interfaces Web avec Rails (20)

More from Jean-Michel Garnier

More from Jean-Michel Garnier (11)

Tests Interfaces Web avec Rails