How to get stated with testing Progressive Web Apps

By Elizabeth Fiennes

Elevator Pitch

First proposed by Google in 2015, Progressive web apps (PWAs) are now in the infant stage of their development. As with any child, people are curious about which developmental direction the technology will take.

2 years ago, I was asked to figure out how to test a programme wide series of PWAs…

Description

At a simplistic level, a PWA is a layering of technology types, almost a miniature integrated system in itself. It has its own rules on how it will behave depending on how it is built, how it is accessed, the options the end user chooses and any hardware available. As testers, we don’t have the luxury of waiting until an app is all grown up before we start to test it. So how can we test PWAs whilst remaining faithful to shift-left principles?

The first thing we need to understand regarding a PWA is what they actually are. Are they a thick client/native app that runs in the browser or a web app with some thick client/native app functions? I will help with defining this in this talk and draw out how that definition impacts the testing that needs to be done as a result.

A couple of years ago, we entered a programme of work that intended to produce multiple PWAs for the financial industry. Never having worked with them before, we did a lot of research and asked industry colleagues for help in understanding the tech. However, there was little to no help forthcoming on how to test for this type of app as the tech was so new. This meant we had to come up with our own! Drawing on comparable experience, trial, error (lots of error) and some tools, we formulated a series of heuristics, automation, methods and processes for testing which we are here to share.


Takeaways

* An understanding of what a PWA is
* The differentiators between PWAs and native/hybrid/web apps
* A dissection of the possible tech layers and how to test them in isolation and together
* How to work out the risks in a PWA
* How to test for platform-specific issues
* Getting started - how to find the low hanging fruit type issues using Lighthouse
* More in-depth - testing a PWS with Selenium and Appium

For the demo, we will be using a lightweight PWA built by me available GitHubhub that anyone can download and develop tests against.
In a separate branch, I will have the app and test code for anyone to download and manipulate for themselves.