Responsive testing
Download as PPTX, PDF1 like685 views
This document discusses responsive web design testing challenges and introduces the Galen framework as a solution. It provides an overview of how Galen works by launching a browser, resizing it, and testing the layout. It also covers Galen installation, file structure, spec language, and basic commands. Benefits of Galen include early defect identification, developer test contribution, detailed reports, and reduced testing time. A demo is provided and questions are welcomed.
Responsive testing
- 1. Get responsive with Galen!!! Devi Sridharan Lalitha Rajanala
- 4. Testing Becomes a challenge
- 5. To list down… • Increased testing efforts • Lot of attention to details • Delay in the deliverables • Lot of dependency on manual testing • Error-prone
- 6. Responsive automation - Galen Galen Framework is a test framework which was introduced for layout-testing of web-application in real browser. 1. Launch 2. Resize 3. Test the layout How it works?
- 7. Galen Installation File structure Spec file Test file Galen spec/Language Basic commands Inside Near Width,height Right of Left of Horizontally aligned Visible Absent component
- 8. Demo
- 9. To summarize… ROI Identifies the defects early Devs can contribute to tests Detailed reports with screenshots Saves considerable amount of testing time Can be integrated with existing selenium tests & CI Word of caution Doesn’t replace the actual device testing, just minimizes the effort spent.
- 10. Questions ???
- 11. Thank you https://in.linkedin.com/in/devisridharan https://in.linkedin.com/in/lalitharajanala @DeviSridharan devisridharan.sd@gmail.com @LRajanala lalitha.rajanala@gmail.com DEMO – code : https://github.com/devishree90/Galen_demo
- 12. Image References http://wallpapers111.com/wp-content/uploads/2015/01/Question-Mark-HD-Wallpaper17.jpg http://coe.utep.edu/atcp/images/practiceTest.jpg https://cdn3.iconfinder.com/data/icons/othericons-3-0/50/browser_resize-512.png http://www.anyscreensize.com/slides/images/this-is-the-web.jpg http://sterndmb.com/wp-content/uploads/2013/04/responsive-website-design-agency.jpg https://sandycitro.files.wordpress.com/2014/01/busy.gif http://identitycreative.com/wp-content/uploads/2015/03/Responsive-Website-Graphic.jpg http://images.clipartpanda.com/question-yikA5pBiE.jpeg http://www.biospectrumasia.com/IMG/279/10279/australian-clinical-trials-website-launched-to- boost-patient-recruitment-262x174.jpg Google Images
Editor's Notes
- #4: Responsive web design (RWD) is an approach to web design aimed at crafting sites to provide an optimal viewing experience—easy reading and navigation with a minimum of resizing, panning, and scrolling—across a wide range of devices (from desktop computer monitors to mobile phones). Give google example where it adapts to screen size and how the gmail link etc disappaears into navigation menu with mobile screen size
- #5: Testing becomes a challenge with lot of devices to certify
- #8: Galen Specs is the language with which you define how the page should look like for different devices. The language is quite advanced and allows you to express complete layout of your website with minimal text.