v148 · PWA · HTML
Cross-Origin Installer
The <install> element supports a manifesturl attribute for cross-origin installs — a marketplace at store.example can install an app hosted at app.example.com. This demo simulates the marketplace experience.
Checking <install> element support…
Marketplace view
HTML snippets
App Marketplace — powered by <install manifesturl="…">
Click Install on any app to see the simulated install flow…
The install element with manifesturl is how a marketplace page at one origin installs an app from another:
<!-- Marketplace page at store.example -->
<install
manifesturl="https://weather.app/manifest.json"
>
<button slot="install">Install Weather App</button>
<span slot="open">Open Weather App</span>
</install>
<!-- Same-origin install (no manifesturl needed) -->
<install>
<button slot="install">Install This App</button>
</install>
<!-- React to install events -->
<script>
document.querySelector('install').addEventListener('install', () => {
console.log('User confirmed install');
});
</script>
Cross-origin install flow
// Without <install> — the old beforeinstallprompt dance
let deferredPrompt;
window.addEventListener('beforeinstallprompt', e => {
e.preventDefault();
deferredPrompt = e;
});
btn.addEventListener('click', async () => {
deferredPrompt.prompt();
const { outcome } = await deferredPrompt.userChoice;
if (outcome === 'accepted') { /* installed */ }
});
// Chrome 148 — declarative, cross-origin capable
// <install manifesturl="https://app.example.com/manifest.json">
// <button slot="install">Install</button>
// </install>references
implementation reference
Need the exact API surface, compatibility boundaries, errors, lifecycle, and source links? Read the matching gendn reference ↗