Web Install Sample

Manifest-first installs!

A test app and debugging tool for the Web Install API, navigator.install(). See more info in the Explainer.

We'd love to hear your feedback! To share feedback, please create a GitHub issue.

*Requires --enable-features=WebAppInstallation (or about://flags/#web-app-installation-api)

Notes:

Current document installs = installing the current page.

Background document installs = installing anything else that's not the current page.

Looking for the element version? <install>

See this test page*

*Requires --enable-features=InstallElement (or about://flags/#web-app-install-element) OR an origin trial meta header for InstallElement*

Testing Permission Policy behavior?

See the Permission Policy test page

Intended use cases

Current doc, no args (manifest has `id`)

Executes:

      navigator.install();
    

Background doc, cross origin, manifest only (manifest has `id`)

Executes:

      navigator.install({
        manifest: "https://mustjab.github.io/manifest.json",
      });
    

Background doc, cross origin, manifest + manifestId (manifest has no `id`)

Executes:

      navigator.install({
        manifest: "https://diek.us/bubble/manifest.json",
        manifestId: "https://diek.us/bubble/",
      });
    

Background doc, cross origin, with screenshots

*Note - screenshots not yet supported

Executes:

      navigator.install({
        manifest: "https://squoosh.app/manifest.json",
        manifestId: "https://squoosh.app/?utm_medium=PWA&utm_source=launcher",
      });
    

Edge case - installing self with params

*Note - Although the end result is the same ('foo' site installs itself), passing parameters like this will launch the foo app in a new window, preserving the 'foo' tab in the main browser window.

Install self, manifest only

Executes:

      navigator.install({
        manifest: "https://kbhlee2121.github.io/pwa/web-install/manifest.webmanifest",
      });
    

Install self, manifest + manifestId

Executes:

      navigator.install({
        manifest: "https://kbhlee2121.github.io/pwa/web-install/manifest.webmanifest",
        manifestId: "https://kbhlee2121.github.io/WebInstallSample",
      });
    

DataError cases - manifest id validation

Background doc, NO id in manifest, manifestId omitted

Executes:

      navigator.install({
        manifest: "https://amandabaker.github.io/pwa/web-install/manifest.webmanifest",
      });
    

Background doc, YES id in manifest, mismatched manifestId

Executes:

      navigator.install({
        manifest: "https://mustjab.github.io/manifest.json",
        manifestId: "mismatched-manifest-id",
      });
    

Background doc, NO id in manifest, mismatched manifestId

Executes:

      navigator.install({
        manifest: "https://amandabaker.github.io/pwa/web-install/manifest.webmanifest",
        manifestId: "mismatched-manifest-id",
      });
    

V8 TypeError - bad JS input

Undefined manifest

Executes:

      navigator.install({
        manifest: undefined,
      });
    

Invalid manifest URL

Executes:

      navigator.install({
        manifest: "badurl",
      });
    

Undefined manifest, defined manifestId

Executes:

      navigator.install({
        manifest: undefined,
        manifestId: "https://diek.us/bubble/",
      });
    

Defined manifest, undefined manifestId

Executes:

      navigator.install({
        manifest: "https://kbhlee2121.github.io/pwa/web-install/manifest.webmanifest",
        manifestId: undefined,
      });
    

      navigator.install({
        manifest: "https://www.hulu.com/app/manifest.json",
        manifestId: "https://www.hulu.com/app/?utm_source=a2hs",
      });