O slideshow foi denunciado.
Utilizamos seu perfil e dados de atividades no LinkedIn para personalizar e exibir anúncios mais relevantes. Altere suas preferências de anúncios quando desejar.

Responsive testing in Drupal - Drupal Developer Days

578 visualizações

Publicada em

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.

Publicada em: Tecnologia
  • Entre para ver os comentários

Responsive testing in Drupal - Drupal Developer Days

  1. 1. Responsive testing in Drupal Óscar Castaño Calle ♦ Alejandro Gómez Morón
  2. 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. 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. 4. Roadmap ● What is Responsive Testing? ● What is Galen Framework? ● GSpecs language ● Do you want to improve your tests? ● Hands on! @drupaldevdays #drupaldevdays
  5. 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. 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. 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. 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. 9. Galen Spec Language ● Object definition: ○ @objects section. ○ Represents an HTML element. ○ Can be selected by id, css and xpath. @drupaldevdays #drupaldevdays
  10. 10. Galen Spec Language @drupaldevdays #drupaldevdays
  11. 11. Galen Spec Language ● Object specs: ○ Behaviour of the @objects. ○ Possibility to customize it depending on the screen type! @drupaldevdays #drupaldevdays
  12. 12. Galen Spec Language @drupaldevdays #drupaldevdays
  13. 13. Galen Spec Language @drupaldevdays #drupaldevdays
  14. 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. 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. 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. 17. Hands on! @drupaldevdays #drupaldevdays https://github.com/agomezmoron/DrupalDevDays-Responsive-Testing-Workshop Repository
  18. 18. THANKS! @drupaldevdays #drupaldevdays
  19. 19. THANKS! @drupaldevdays #drupaldevdays
  20. 20. Thanks! @drupaldevdays #drupaldevdays