Testing the responsive web design of your application is an important part of validating that users have a consistently great experience across mobile devices. You can use mabl to easily train a test that runs across multiple devices and screen orientations emulated in the Chrome browser.
Selecting mobile devices to emulate when running tests in Chrome.
When devising a mobile web testing strategy, it is best to start by analyzing data from actual usage patterns. For example, Google Analytics provides such data with their Audience reports. Once there, you can go to the Mobile > Overview report to get a breakdown by user device such as desktop, mobile and tablet. The Devices report can also provide you with a break down of specific devices and you can even set the Primary Dimension of the report to Screen Resolution to get the most common mobile resolutions.
Reviewing traffic from mobile devices in Google Analytics.
You can also find a report about the top browsers and operating systems that your users use under Audience > Technology > Browser & OS. To see the top overall screen resolutions, set the Primary Dimension for the report to Screen Resolution.
Don’t have analytics data access?
You can contact your product management and marketing teams to request an export of usage data from mobile devices in a CSV or PDF file format. If you are starting a brand new project, you can search the web for the most popular mobile screen resolution that you should consider testing for.
To perform mobile web testing, you can choose from the following testing strategies:
- Run the same tests across desktop and mobile devices using conditional logic and reusable flows to account for changes in navigation and lack of hover actions on mobile devices.
- Maintain separate test copies for desktop and mobile devices while reusing flows between them to account for common steps and reduce future maintenance.
Each testing strategy has its pros and cons depending on how the responsive design of your application works. For example, if only the main navigation changes in your app, then it might be easier to maintain conditional logic within the same test to account for that change when running in a mobile device browser. Otherwise, you may prefer to have dedicated tests that are trained on the mobile browser experience and don’t require conditional logic which can reduce complexity but may increase future maintenance.