PWA install handler

Handling PWA installation prompt made easier. MDN docs

Installation

``sh
npm install pwa-install-handler
`

Usage

$3

`html
Install
`

$3

`javascript
import { pwaInstallHandler } from 'pwa-install-handler'

const $button = document.querySelector('#installButton')

pwaInstallHandler.addListener((canInstall) => {
$button.style.display = canInstall ? 'inline-block' : 'none'
})

$button.addEventListener('click', () => {
pwaInstallHandler.install()
})
`

$3

For more information see react-use-pwa-install.

$3

!UI example

$3

Check website or code.

Methods

`typescript
pwaInstallHandler.install: () => Promise
`

`typescript
pwaInstallHandler.addListener: (
callback: (canInstall: boolean, install?: () => Promise) => void,
) => void
`

`typescript
pwaInstallHandler.removeListener: (
callback: (canInstall: boolean, install?: () => Promise) => void,
) => void
`

`typescript
pwaInstallHandler.canInstall: () => boolean
`

`typescript
pwaInstallHandler.getEvent: () => BeforeInstallPromptEvent | null
`

Notes

You PWA must meet some requirements to be installable. Without that the canInstall will always be false. The requirements are browser specific. You can read more about it here (MDN) and here (web.dev).

Some browsers don't support custom install button. These will have canInstall always set to false` too. For more information check BeforeInstallPromptEvent support.