PWAizer (rhymes with 'wiser') is a browser extension that dynamically generates a PWA (Progressive Web Application) manifest and service worker for any website to use. This allows (nearly) any chosen website to meet the requirements to be installable as a PWA. Use this at your own risk, as it relies on many unintended interactions to do what it does. It may cause (possibly severe) issues. Read through the Usage section completely and familiarize yourself with the concepts before doing anything. The PWA logo was created by Love2Dev and was sourced from https://github.com/docluv/pwa-logo
In addition to the browser extension, you need to use a proxy server to enable installation of the service worker. An easy one to use is mitmproxy. If you decide to use mitmproxy, you will need to install the certificates. Once you have mitmproxy installed and set up, you can start the proxy with the command mitmproxy -p8080 --map-remote '|.*/pwaizerServiceWorker\.js.*|https://raw.githubusercontent.com/Wafffle77/PWAizer/master/pwaizerServiceWorker.js'. This will pass all requests through except ones for the PWAizer service worker, which will get redirected to the service worker in this repository hosted on Github. To redirect all requests to a local copy of the repo, use the command mitmproxy -p8080 --map-local '|.*/pwaizerServiceWorker\.js.*|./pwaizerServiceWorker.js' in the PWAizer directory.
Next, point your browser's proxy settings to 127.0.0.1:8080 to foce it to use the proxy. Firefox has built-in proxy settings, but (most) chromium-based browsers does not. Instead, they can be started with the --proxy-server="127.0.0.1:8080" commandline argument. This has the added benefit of reverting your proxy settings when the browser is closed. If you do use a method to change your proxy settings that doesn't revert when the browser is closed, remember to change them back once the PWA is installed and the proxy is shut off, otherwise you will not be able to access the internet.
Once the proxy server is running, you can tell if the browser is using it by checking the output. By default, mitmproxy gives output for every web request, so simply loading a page in the web browser and checking if mitmproxy sees it is a good indicator. Once the traffic is flowing through the proxy server, you can start installing PWAs. To do this, you can use the extension button to open a menu. This menu allows you to customize some of the manifest fields for the PWA.
- The name field sets the name for the PWA, which is what it will show on your desktop/homescreen.
- The display type sets the display mode for the PWA when opened. Details on each of the four options can be found here.
- The start URL is the initial page opened when you launch the PWA. It must have the same origin as the PWA itself. 'https://example.com/index.html' will match 'https://example.com/different.html', but 'https://example.com/' won't match 'https://example.net/')
- The caching checkbox will enable page caching when checked. This will store every resource the page loads for offline use. It may take up a lot of space, so be careful when using it.
- The icon list shows all icons autodetected by the extension. You can deselect an icon by clicking it. This will prevent it from being added to the manifest.
Once all the options have been set, pressing the 'Create PWA' button will register the service worker and manifest. The website should now be installable as a PWA, and a popup should appear prompting you to install.
As mentioned above, this extension relies on many unintended interactions to do what it does. Since it is creating manifest files and service workers for websites that weren't intended to have them, there may be problems with certain websites. If something goes wrong, a good first step is to reload the page. This will remove anything temporary that PWAizer left when generating the PWA. If that doesn't fix it, then reseting the site data may also work.
To package the extension, you can use the included python script to generate a zip file, which can then be installed in you browser of choice. The default options will create a package installable in Google Chrome, but other browsers will need different options. Firefox requires manifest v2 (As of June 2022). To see the available options and their defaults, run package.py --help. This requires Python 3 to run. Additionally, some browsers won't let you permanantly install sideloaded extensions.