Our QA Drupal experts Alejandro Gómez -QA team leader in Emergya- and Óscar Castaño -Drupal, Angular and Symfony Team Leader- show everything you need to know about the testing process and the importance of responsive developments.

1. Responsive testing in Drupal
Óscar Castaño Calle ♦ Alejandro Gómez Morón

2. Who are we?
● QA lead at @LaDrupalera by @Emergya.
● Devoted to processes of software quality:
improvement, delivery, deployment…
● A lover of @LaDrupalera.
@drupaldevdays #drupaldevdays

3. Who are we?
● QA & Tech lover (Selenium, Java, TypeScript,
Drupal, Ionic, AngularJS, Gulp…).
● QA leader at @LaDrupalera by @Emergya.
● QA Lecturer at @EPSUPO.
● @SevillaQA organizer.
● I am passionate about challenges and I hate
repeating processes!
@drupaldevdays #drupaldevdays

4. Roadmap
● What is Responsive Testing?
● What is Galen Framework?
● GSpecs language
● Do you want to improve your tests?
● Hands on!
@drupaldevdays #drupaldevdays

5. What is Responsive Testing?
● Responsive Web Design (RWD) is an approach to web design
aimed at crafting sites to provide an optimal viewing experience.
● So, Responsive Testing is ensuring everything looks and
works as it was designed.
@drupaldevdays #drupaldevdays

6. What is Galen Framework?
● It is a test framework which was originally introduced for testing
layout of web-applications in a real browser. Nowadays it
became a fully functional testing framework with rich reporting
and test management system.
@drupaldevdays #drupaldevdays

7. What is Galen Framework?
● It works in a following way:
a. Galen opens a page in browser (Selenium).
b. Resizes browser to specified size.
c. Tests the layout with Galen Specs.
@drupaldevdays #drupaldevdays

8. Galen Spec Language
● It is quite flexible and gives you the opportunity to express
exactly how you want your website to behave on different
devices. There are two main parts in page specs file: object
definitions and object specs.
@drupaldevdays #drupaldevdays

9. Galen Spec Language
● Object definition:
○ @objects section.
○ Represents an HTML element.
○ Can be selected by id, css and xpath.
@drupaldevdays #drupaldevdays

10. Galen Spec Language
@drupaldevdays #drupaldevdays

11. Galen Spec Language
● Object specs:
○ Behaviour of the @objects.
○ Possibility to customize it depending on the
screen type!
@drupaldevdays #drupaldevdays

12. Galen Spec Language
@drupaldevdays #drupaldevdays

13. Galen Spec Language
@drupaldevdays #drupaldevdays

14. Do you want to improve your tests?
● agomezmoron/galen-framework-handler
○ Some Galen Framework functionalities improved.
○ Set of devices defined (iPhone5, 6, Nexus, etc).
○ Configuration object (URLs, devices to test…)
@drupaldevdays #drupaldevdays

15. Tell me and I’ll listen.
Show me and I’ll watch.
Let me experience and I’ll learn.
Lao Tzu
@drupaldevdays #drupaldevdays
Ready?

16. Hands on!
@drupaldevdays #drupaldevdays
1. Check you have Internet connection
2. Look for a partner!
3. Make sure you will learn having fun!

17. Hands on!
@drupaldevdays #drupaldevdays
https://github.com/agomezmoron/DrupalDevDays-Responsive-Testing-Workshop
Repository

18. THANKS!
@drupaldevdays #drupaldevdays

19. THANKS!
@drupaldevdays #drupaldevdays

20. Thanks!
@drupaldevdays #drupaldevdays