PWA Testing: Essential Guidelines to Follow


Have you paid attention to how much the advent of the digital era changed our language? User interface, URL, plugin, software, outsourcing – these words have stopped being terms known to a narrow circle of high-fi experts and turned into bywords familiar to average gadget owners as well. Alongside ushering new vocabulary, technical progress in the IT industry has changed the meaning of many existing words. In the mind of most people of the second millennium, tool is not a hammer anymore, but rather Angular or React, platform has nothing to do with railroads but may be related to iOS, and cloud shouldn’t be looked for in the sky above our head.

Something similar is happening to conventional collocations. When a contemporary person hears the word native, there is a slim chance that s/he will combine it with language, Americans, or (most unlikely) heath. Native can be only an app. Smartphone users of today can’t do without these computer programs that serve as a master key that, given the stable web connection, opens a whole world of services and information accessible via a mobile device.

However flawless native apps might have seemed at the dawn of the mobile age, later developments served another proof to the statement that nothing is perfect.

PWA: A Viable Alternative to Native Apps

Some years ago, Recode detected a 20% drop in native app downloads reported by the top 15 app producers of the USA which was at odds with the 3% global increase. Experts offered several explanations to this phenomenon, the most logical of which seemed to be an oversaturated app market. Yet another trend may be held responsible for this dramatic decline – the advance of Progressive Web Apps (PWAs).

The growth of the variety of gadgets with different display sizes exposed the inadequacy of native apps that can function only on an iPhone or Android device with certain screen dimensions. By contrast, PWAs have no limitations as to this parameter, so when there is a choice of writing code for each platform vs code universal for all of them progressive apps have a definite edge in the developers’ eyes. Being a disguised website by nature, such apps weigh a little, have a high downloading speed, don’t require installation, can be operated offline, and are rated by Google being thus remarkably SEO-friendly. Besides, users who navigate in browser well will find it easy to operate a PWA since it provides a unified practice of utilizing the same interface for the browser and the app.

Another boon of this software comes from the fact that PWA creators managed to mitigate traditional shortcomings of accessing regular sites on phone that may incur unexpected glitches through compatibility issues either with the layout or the content. All of these were taken care of so that consumers get a satisfying user experience which encourages companies to launch PWA versions of their apps in order to engage more customers.

To ensure the smooth functioning of this software, you should learn how to test Progressive Web App.

Progressive Web Apps Testing: Highlights to Focus On

A PWA test isn’t a cakewalk procedure boiling down to the assessment of the functional ability of it as is the case with a native app. The complex nature of this software necessitates supplementing PWA automation testing with its manual testing. Due to the unique flexibility of this app type, QA engineers ought to know how to test PWA on mobile devices as well as be ready to test PWA on desktop. Besides, it is mandatory to test PWA online to gauge how smooth it is accessed through Chrome, Firefox, Opera, Safari, and other popular browsers.

There are several key points that must be included in the PWA testing checklist.

PWA Manifest

It is a JSON file that is obligatory for a PWA. It includes essential information about the app that conditions its functioning and allows the developer to control full-screen visibility without an address bar. A valid Manifest is to have such properties as name (short_name), start_url, and icon (including two basic icon sizes – 192px and 512px). It is also important to set display property on fullscreen, minimal-UI, and standalone.

Service Worker

This JavaScript file enables PWA operation under problem network connection. Running separately from the browser it performs background tasks by defining request logic and caching procedure. Typically, it is registered leveraging a fetch event handler. Some app-building tools (like Angular, for instance) may not work with service workers, so in case your app is created with it you must know how to test PWA locally. Typically, you will have to rely on a separate HTTP server, preferably on a dedicated port and with caching disabled. To enable service workers without any complications, it is recommended to access both the page and the service worker script via the localhost.

Push Notifications

It is one of the background tasks enabled by service workers consisting in sending notifications to the user on events related to the app. The principal advice with this function is to avoid making it annoying and over-aggressive. While testing it (conventionally via opt-in flow), make sure there are clear-cut instructions as to user permission availability and notification timeliness.

Page URL

Although a PWA may look and behave like an app, it is still a website and it must have a unique URL for each page of it that can be shared in social networks. It is also a guarantee that your website aka PWA is indexed by search engines. The tester should check whether the URL of every page is linkable and if it can be opened in new browsers directly.


Being served through HTTPS is a reliable sign of the PWA’s safety. To make sure your PWA complies with this requirement, testers employ special tools. The most popular of them are Jitbit, DigiCert, SSL shopper, and SeoSiteCheckup, with Lighthouse topping the list. 


This feature is responsible for the smooth running of your PWA on screens of various devices – both mobile and desktop ones. To see whether the app’s layout does well on all of them, manual testing is the best approach.

Cross-Browser Compatibility

There is a probability that your app may perform well on one app browser but encounter problems on another. This may happen with older browsers like 8.0 and earlier versions of Internet Explorer. Cross-browser testing will ensure that your PWA behaves identically across all browsers in terms of responsiveness, navigation, and loading speed.

Loading Speed aka Performance

This parameter to a large extent determines satisfying user experience and, consequently, the market success of your PWA. Nobody likes to wait indefinitely for the app to load. What slows it down? There may be issues with the device type or the platform it uses. But typically, the lag is caused by a flaw in the code that stores files in the cache. To identify such malfunctions, Lighthouse testing tool has six metrics. For instance, two first paint measurements (First Contentful Paint and First Meaningful Paint) gauge the time during which the first text/image is painted and the primary page content is visible, respectively.


This is the core of the testing process that can be performed both manually and via automation. By checking the functionality of the PWA, you make sure the app functions in accordance with the requirement protocol.

Offline Loading

It is naive to expect a website to work in offline mode. Yet, PWAs are expected to load at least some pages when the internet connection is off. Testing tools can help you with checking whether your PWA can do it. If the PWA on the device with no internet connection responds with a 200 it is ready to be presented to users.

Home Screen Metadata

Your app should be able to provide metadata for “Add to Homescreen” functionality which is checked through applying special testing software.

As you see, many of the abovementioned aspects can be validated by leveraging PWA testing tools.

Streamlining PWA Tests: How Do Tools Work?

Today, there is a whole gamut of testing tools on the market that make a tester’s life a lot easier. When selecting a tool to use for your PWA, you must bear in mind that none of them is comprehensive, i.e. you can’t test all features of a PWA utilizing some one-size-fits-all tool. Typically, a tool is honed to test certain aspects. For instance, Lighthouse can be employed to test cross-browser compatibility, page URL, offline loading, HTTPS, functionality, and performance, and Google Chrome excels at web app manifest and service workers validation. Since the latter tool is by far the most popular one, let’s take it as an example to see how testing tools work.

 Clear all browsing data from your desktop.

  • Find the site where the PWA eligible for testing is deposited.
  • When an “Add to Home screen” message appears at the bottom of the page, tap it and the icon of the PWA will appear where it was promised.
  • Load the PWA on your desktop by tapping the icon.
  • The splash screen with the icon and background color will appear after which you can navigate through some pages.
  • Disconnect the internet and close the PWA.
  • By tapping the icon again you can see whether the pages you have opened before can still be accessed in the offline mode. The pages that you haven’t visited are supposed to be displayed by the offline page which you set on the service worker.

Whether you opt for the manual or automated procedure (or use both in combination) testing a PWA is a no-nonsense job. If you want to obtain a high-quality result it is wise to entrust the testing to a seasoned team with expertise in the field.


Progressive web apps present a viable alternative to conventional native apps that can add flexibility and functionality to this software technology. By testing the PWA, you will ensure its seamless operation and satisfying user experience. 

August 9, 2020
Have a project in mind?
We are ready to do it!
Do you like this article?Please rate
For Clients
Print on demand and dropshipping – why do these notions often come together?
Print on demand and dropshipping are the two most frequent sales methods in the souvenir market. These two similar yet slightly different retail business models provide your potential customer with the unlimited choice of goods to their liking, while hiding organizational details from their sight. POD businesses sell t-shirts, mugs, phone cases, clothing, and exclusive items with their own or customer's design. This does not only make them unique but also allows maximizing profits though the recognizable brand name. On the other hand, dropshipping allows you to observe millions of products from overseas stores (like AliExpress). The following material will show why and how print on demand and dropshipping are connected and why many articles put them side by side or even describe them together as a same trading model.
For Clients
Which CRM is the Best Solution For Shopify Integration?
Sooner or later, any Shopify project faces the necessity to empower itself with advanced CRM capabilities. The contemporary software market offers numerous ways how to integrate Shopify with CRM. Your choice between the most popular CRM systems is a tough task since their features are various and specific. Lots of time spent scrolling through the official websites of CRM systems can result in an information mess in your head. We are going to facilitate your choice with a brief but coherent review of the most promising CRM software systems that integrate with Shopify. The present post reveals the essential functionalities of the four CRM platforms that we consider worth your attention [...]
For Clients
How to promote a t-shirt brand with digital marketing?
A t-shirt with a custom print is the most popular product on the print-on-demand market. Millions of people spend their money on being original through their clothes - in particular, by finding an unusual design for their t-shirts. They also like surprising their friends with t-shirt gifts which reflect their personality the best or are a good piece of humor. So, t-shirts are a rewarding and creative business, but their promotion might be a challenge because of the intense rivalry in the market niche. There are many examples of affordable promotion of a t-shirt brand from scratch. Cost-efficiency, the inclusion of social networks, A/B testing, and cross-selling are just several promotional methods you can use for your business development. The following material will let you know how to promote a t-shirt print-on-demand business in this competitive landscape [...]
This website uses cookies to improve your experience. We'll assume you're ok with this, but you can opt-out if you wish. Read More