v148 · origin trial · html element
Web app HTML install element
A new <install> HTML element that lets a page declaratively offer PWA installation — for the current origin or a different one — without orchestrating the beforeinstallprompt ceremony in JavaScript. The button's label and appearance are browser-controlled, so the click carries a genuine user-intent signal.
<install> element is in origin trial from Chrome and Edge 148 through 153. You need an origin trial token to use it in production. The API surface is still being refined; check the Chrome for Developers blog before shipping. To test locally: about://flags/#web-app-install-element.
at a glance
| Origin trial | Chrome 148 – 153, Edge 148 – 153 (same token works in both) |
|---|---|
| Status | Origin trial (behind flag: #web-app-install-element) |
| Implemented by | Microsoft Edge team, in collaboration with the Chrome team |
| Spec / Explainer | WICG Install Element spec · WICG Explainer · Chrome for Developers announcement |
| ChromeStatus | 5152834368700416 — Web app HTML install element (API record) |
why it exists
The existing beforeinstallprompt pattern requires JavaScript to intercept and store an event, then replay it on a button click — around 20+ lines of boilerplate. Worse, it only works for the same origin. App stores and catalog pages that want to offer cross-origin installs had no standard mechanism at all. The <install> element provides a single declarative element: the browser renders it as an install button, trusts the click, and handles the installation flow natively. Cross-origin installs are supported via the installurl attribute, enabling catalog pages to offer many apps each with its own install button.
shape of the API
The <install> element is declared in HTML with optional installurl and manifestid attributes:
<install installurl="https://app.example/" manifestid="https://app.example/id"></install>Attributes
| Attribute | Required | Description |
|---|---|---|
installurl |
No (required for cross-origin) | URL of the web app to install. For same-origin apps whose manifest has an id field, you can omit this — the browser infers the target from the current page's manifest. |
manifestid |
No | Computed manifest ID string. Use this when the target app's manifest does not have an explicit id field, so the browser can uniquely identify the app to install. |
Events
| Event | Fires when |
|---|---|
promptaction | The user accepted the installation prompt — the app was installed (or is being installed). |
promptdismiss | The user dismissed the installation prompt without installing. |
validationstatuschanged | The element's validation status changed — e.g. the target URL resolved (or failed to resolve) to an installable manifest. |
recipes
Declarative install button syntax example:
<install installurl="https://awesome-app.example/"></install>Same-origin install button
If your page is served from the same origin as the PWA manifest and the manifest has an id field, a bare element is sufficient:
<install></install>Cross-origin install button (app catalog)
<!-- Catalog page at catalog.example.com offering another app -->
<install installurl="https://awesome-app.example/"></install>
<!-- App without a manifest id field — provide the computed id -->
<install
installurl="https://awesome-app.example/"
manifestid="https://awesome-app.example/?source=pwa"
></install>Reacting to install outcome
const installBtn = document.querySelector('install');
installBtn.addEventListener('promptaction', () => {
console.log('App installed!');
installBtn.hidden = true; // hide after successful install
});
installBtn.addEventListener('promptdismiss', () => {
console.log('User dismissed the install prompt.');
});
installBtn.addEventListener('validationstatuschanged', (e) => {
// e.g. target manifest failed to load
if (!installBtn.validity?.valid) {
console.warn('Install element validation error');
}
});Enabling the origin trial
<!-- Add your origin trial token in the <head> -->
<meta http-equiv="origin-trial" content="YOUR_TOKEN_HERE">Obtain a token at developer.chrome.com/origintrials — search for "Web app HTML install element".
Source: Chrome for Developers blog — Install web apps with the new HTML install element; developer.chrome.com/origintrials; chrome-platform-showcase — live demo.browser support
| Browser | Support |
|---|---|
| Chrome 148 – 153 | Origin trial (or flag: #web-app-install-element) |
| Microsoft Edge 148 – 153 | Origin trial (same token as Chrome) |
| Firefox | No position (standards-positions#1179) |
| Safari | Oppose (standards-positions#463) |