Install Flow Simulator

Chrome 143 ships the Web Install API, enabling cross-origin storefronts to trigger PWA installs. This simulator walks through every install state, shows the matching JavaScript, and previews per-platform UI.

Probing navigator.install…

Install State Machine

not-installed
→
prompted
→
installing
→
installed
→
uninstalled
dismissed
← alternate path from “prompted”
Current state: not-installed

Corresponding JavaScript

// Current state: not-installed // Waiting to call navigator.install() or listen for beforeinstallprompt window.addEventListener('beforeinstallprompt', (e) => { e.preventDefault(); // Capture the event deferredPrompt = e; // Store for later use });

Event Log

Platform Install Flow

Android Chrome
iOS Safari
Desktop Chrome

Android Chrome — Uses navigator.install() (Chrome 143 Web Install API). Shows a bottom-sheet install prompt. Supports cross-origin storefront installs.

📱 Android bottom-sheet: “Add [App] to Home Screen”
State: not-installed — no prompt shown yet

After install: app appears on home screen, can be opened as standalone.

iOS Safari — Does not support navigator.install(). Uses the manual “Share → Add to Home Screen” flow. beforeinstallprompt is not fired.

🍏 iOS: Share sheet → “Add to Home Screen”
No JavaScript API — user must initiate manually

Best practice: show an instructional banner with step-by-step screenshots.

Desktop Chrome — Uses beforeinstallprompt + deferredPrompt.prompt(). Shows an omnibox install button and a dialog. navigator.install() also supported in Chrome 143.

🖥 Desktop Chrome: omnibox install button ➕
State: not-installed — button appears in omnibox

After install: app opens in its own window, taskbar entry appears.

Multi-App Storefront

A cross-origin storefront can install any of these apps using navigator.install(url). Click an app’s button to cycle through its install states.