Device and emulation testing

Testing is a critical part of development and an ongoing process during any build. Try and identify every single test prior to the development which will in-turn make your planning and execution easier to follow. The following points are recommendations from a frontend perspective. Typically, frontend testing is far more involved compared to backend development.

This guideline is for the testing of websites, go to the guide testing for email builds for steps to take when developing marketing emails.

Day to day frontend testing

For layout and visual testing it's convenient to test using the integrated browser features found inside of the developer tools of your browser if using Chrome or Firefox. This includes viewport and resolution emulation of different devices like past and recent iPhones, iPads, Android phones and tablets.

In Chrome you can also throttle the speed of the connection to simulate using the device on cellular connection, slower LAN or even offline connection if you have implemented offline caching such as a ServiceWorker.

It's not possible nor realistic to test every single device on the market but try to also test on at least one real device for things like touch interactions, form elements and general usability.

Test in both Android and iOS devices. For iOS if you have XCode installed on your Mac then you can use the device simulator to test on iPhone and iPad.

Physical device testing

Device testing assures that your website will work smoothly in customer mobile and tablets. Device emulation is a reliable solution for testing - having the physical device to test with is important as it allows you to test whether:

• Touch points are sufficiently large
• Is it easy to use in different situations such as being on the move
• The website can be read in different brightnesses
• Device hardware can cope with rendering the page

These are only a few example use-cases for opting for the physical device but typically it is encouraged at key points of any build.