Behaviour Driven Development para pruebas de la interfaz de usuario

1. BDDUI Testing

2. Qué veremos?
● BDD
● Cucumber
● Gherkin
● Mini Prueba

3. Y si pudieras escribir tus tests así:
Scenario: Accessing the home page
Given a user that wants to rent a car
And a list of cars to rent
When the user access the "/welcome" page
Then they can see the list of cars
And each car should display the following fields:
| a picture |
| a name |
| a description |
| an availability identifier |
| and a price |

4. BDD
Behaviour Driven Development

5. BDD
● Metodología de desarrollo de software, similar a TDD.
● Sirve de comunicación entre el cliente y los
desarrolladores.
● Se enfoca en el fondo, no en la forma.

6. Ventajas
● Buen comienzo para aprender a hacer pruebas.
● El mismo cliente puede escribir las pruebas, o al menos
verificarlas y entenderlas.
● Pueden servir como criterios de aceptación.

7. Por qué BDD UI Testing?
● Garantiza que los requerimientos del cliente se cumplan.
● Ayuda a detectar daños realizados tras haber hecho
cambios en la aplicación.
● Es más fácil definir casos de usos usando backgrounds.

8. Desventajas
● Pueden fallar por causas ajenas a ti o a tu aplicación.
● No le importa la calidad del código.
● Dependen del correcto funcionamiento de la aplicación
completa.

9. Componentes
Gherkin Cucumber Protractor Chai

10. Gherkin

11. Gherkin
● Lenguaje de dominio específico (solo sirve para una
cosa).
● Describe los componentes que conforman la aplicación.
● Solo describe como debe de funcionar la aplicación. No
corre las pruebas.

12. Gherkin
● Feature
● Scenario
● Steps
● Backgrounds

13. Gherkin - Step definitions
Given When Then
● And
● And
● But
● And
● And
● But
● And
● And
● But

14. Feature: Multiple site support
As a Mephisto site owner
I want to host blogs for different people
In order to make gigantic piles of money
Background:
Given a global administrator named "Greg"
And a blog named "Greg's anti-tax rants"
And a customer named "Dr. Bill"
And a blog named "Expensive Therapy" owned by "Dr. Bill"
Scenario: Dr. Bill posts to his own blog
Given I am logged in as Dr. Bill
When I try to post to "Expensive Therapy"
Then I should see "Your article was published."
Scenario: Dr. Bill tries to post to somebody else's blog, and fails
Given I am logged in as Dr. Bill
When I try to post to "Greg's anti-tax rants"
Then I should see "Hey! That's not your blog!"
Scenario: Greg posts to a client's blog
Given I am logged in as Greg
When I try to post to "Expensive Therapy"
Then I should see "Your article was published."

15. Cucumber

16. ● Feature files
● World
● Step definitions
● Hooks
Cucumber

17. Protractor

18. ● Hace la integración entre las pruebas y el
browser.
● Provee un WebDriver que permite controlar
cualquier interacción con el browser.
Protractor

19. Protractor - Ejemplo
browser.get('http://example.com');
element(by.css('form input[type=search]')).sendKeys('Hello');
element(by.css('form button')).click();
browser.sleep(1000);
expect(element.all(by.css('.result')).count()).toBe(5);

20. Preguntas?
Imágenes: http://princesscheeto.tumblr.com/