Responsive testing in Drupal - Drupal Developer Days
20
Responsive testing in Drupal Óscar Castaño Calle ♦ Alejandro Gómez Morón
-
Upload
la-drupalera -
Category
Technology
-
view
130 -
download
3
Transcript of Responsive testing in Drupal - Drupal Developer Days
Responsive testing in DrupalÓscar Castaño Calle ♦ Alejandro Gómez Morón
Who are we?
● QA lead at @LaDrupalera by @Emergya.● Devoted to processes of software quality:
improvement, delivery, deployment…● A lover of @LaDrupalera.
@drupaldevdays #drupaldevdays
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
Roadmap
● What is Responsive Testing?
● What is Galen Framework?
● GSpecs language
● Do you want to improve your tests?
● Hands on!
@drupaldevdays #drupaldevdays
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
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
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
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
Galen Spec Language
● Object definition: ○ @objects section.○ Represents an HTML element.○ Can be selected by id, css and xpath.
@drupaldevdays #drupaldevdays
Galen Spec Language
@drupaldevdays #drupaldevdays
Galen Spec Language
● Object specs: ○ Behaviour of the @objects.○ Possibility to customize it depending on the
screen type!
@drupaldevdays #drupaldevdays
Galen Spec Language
@drupaldevdays #drupaldevdays
Galen Spec Language
@drupaldevdays #drupaldevdays
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
Tell me and I’ll listen. Show me and I’ll watch.
Let me experience and I’ll learn.Lao Tzu
@drupaldevdays #drupaldevdays
Ready?
Hands on!
@drupaldevdays #drupaldevdays
1. Check you have Internet connection
2. Look for a partner!
3. Make sure you will learn having fun!
Hands on!
@drupaldevdays #drupaldevdays
https://github.com/agomezmoron/DrupalDevDays-Responsive-Testing-Workshop
Repository
THANKS!
@drupaldevdays #drupaldevdays
THANKS!
@drupaldevdays #drupaldevdays
Thanks!
@drupaldevdays #drupaldevdays
