Automated Testing of Responsive Design – Galen Framework
Aug 2, 2017
The rapid growth of mobile and tablet usage over the desktop machines have made us question whether or not our business is ready for mobilization. Are our business portals designed to work and look good on various mobile or tablet devices? In response, more companies are now implementing Responsive Web Designs for developing their web applications and sites.
According to Wikipedia, “Responsive Web Design (RWD) is an approach to web design aimed at allowing desktop web pages to be viewed in response to the size of the screen or web browser one is viewing with. Also, it’s important to understand that Responsive Web Design tasks include offering the same support to a variety of devices for a single website.” A site designed with RWD adapts the layout to the viewing environment by using fluid, proportion-based grids, flexible images, and CSS3 media queries.
Testing Responsiveness for Web Applications and Sites and Its Challenges
One of the possible approaches for testing is using different physical devices with various screen sizes. However, it’s not feasible to test all available mobile or tablet devices of the market. Though we prioritize devices using web analytics, it’s very costly to buy a sufficient number of devices; even keeping the software version up-to-date is a troublesome task.
Another possible approach is to use device emulators. However, emulators have their limitations, but they show a close approximation of how a web application will look on a particular sized mobile device.
The best possible approach will be to use emulators initially in the development cycle and, after the design becomes stable, test the application on physical devices based on the analytics.
When designing a user interface, there is always a challenge – how do we automate testing for it? How do we make sure the website arrangement remains responsive and displays properly on all sorts of devices with various screen sizes?
Device Testing Challenges
- Hard to define and select set of devices for test
- Frequent Requirement changes
- Testing manually on all devices, a time intensive process
- Not all Emulators simulate all the devices in market
Automated Responsive Web Design Testing – Galen Framework
Any testing cycle requires us to test the application with multiple iterations, and testing a responsive design is quite an effort. However, it can easily be conquered by using Automation Framework. If we use open source framework, then it’s a “win-win” situation for everyone.
Galen Framework – Highlights
- Open Source Testing Framework
- Responsive Web Design as a primary focus
- Selenium used for web page interactions
- Layout Testing, Responsive Design Testing, and Cross Browser Testing
With Galen Framework, it’s easy to set up testing for different browser sizes. Galen uses Selenium to open a browser, resize it to a defined size, and then check the page according to specifications set in a test script.
Using Galen Specs Language, it’s easy to describe any complex layout including different screen sizes or browsers. It’s easy to read and write even if you aren’t an expert in the programming language. Once a proper page spec file is written, it can be used as a requirements user interface.
Capabilities of Galen
- Testing relative location of elements in web page
- Checking visible text
- Integration with Selenium Grid
- Color scheme testing
- Integration with Appium for real Mobile device automation
- Integrated with Browser Stack, Sauce labs
Explore Additional Resources
Learn more on how to select the Right CMS for your business and excel the Digital Experience.
Our web and mobile development services range from initial prototyping and wire-framing to full creation of responsive websites ready to serve tens of thousands of users every day.
Our Quality Assurance team helps our clients build a managed QA department.
GET HELP FROM OUR EXPERTS
Over the past 19 years, we have completed thousands of digital projects globally. We have one of the largest and deepest multi-solutions digital consulting teams in the world. Our proprietary processes and years of Digital Experience expertise have earned us a 97% customer satisfaction rating with our clients ranging from Global Fortune 1000 to Mid-Market Enterprises, leading educational institutions, and Non-Profits.
Contact us today if your organization needs assistance with your Quality Assurance projects.
About TA Digital
TA Digital is an innovative digital transformation agency, specializing in delivering the digital experience, commerce, and marketing solutions. For nearly two decades, we have been helping traditional businesses transform and create dynamic digital cultures through disruptive strategies and agile deployment of innovative solutions.