@pwabuilder/pwainstall - npm Package Compare versions

Comparing version 0.9.5 to 0.9.7

package.json

 {
   "name": "@pwabuilder/pwainstall",
-  "version": "0.9.5",
+  "version": "0.9.7",
   "description": "",
@@ -5,0 +5,0 @@ "main": "dist/pwa-install.js",

README.md

@@ -43,2 +43,4 @@ # pwa-install
 | `manifestpath` | `manifestpath` | path to your web manifest       | `string`  | `manifest.json` |
+| `featuresheader`     | `featuresheader`     | Controls the text of the features header | `string` | `Key Features`         |
+| `descriptionheader` | `descriptionheader` | Controls the text of the description header       | `string`  | `Description` |
 
@@ -45,0 +47,0 @@ ### Methods

src/pwa-install.ts

@@ -17,2 +17,4 @@ import {
   @property() explainer: string = "This app can be installed on your PC or mobile device.  This will allow this web app to look and behave like any other installed up.  You will find it in your app lists and be able to pin it to your home screen, start menus or task bars.  This installed web app will also be able to safely interact with other apps and your operating system. "
+  @property() featuresheader: string = "Key Features";
+  @property() descriptionheader: string = "Description";
 
@@ -408,3 +410,8 @@ static get styles() {
     if (this.manifestpath) {
-      await this.getManifestData();
+      try {
+        await this.getManifestData();
+      }
+      catch (err) {
+        console.error('Error getting manifest, check that you have a valid web manifest');
+      }
     }
@@ -426,2 +433,21 @@
 
+  // Check that the manifest has our 3 required properties
+  // If not console an error to the user and return
+  checkManifest(manifestData) {
+    if (!manifestData.icons || !manifestData.icons[0]) {
+      console.error('Your web manifest must have atleast one icon listed');
+      return;
+    }
+
+    if (!manifestData.name) {
+      console.error('Your web manifest must have a name listed');
+      return;
+    }
+
+    if (!manifestData.description) {
+      console.error('Your web manifest must have a description listed');
+      return;
+    }
+  }
+
   async getManifestData() {
@@ -435,2 +461,4 @@ const response = await fetch(this.manifestpath);
       this.updateButtonColor(this.manifestdata);
+
+      this.checkManifest(this.manifestdata);
     }
@@ -492,3 +520,3 @@ }
           <div id="logoContainer">
-            <img src="${this.iconpath ? this.iconpath : this.manifestdata.icons[0].src}"></img>
+            <img src="${this.iconpath ? this.iconpath : this.manifestdata.icons[0].src}" alt="App Logo"></img>
 
@@ -516,3 +544,3 @@ <div id="installTitle">
           ${this.manifestdata.features ? html`<div id="keyFeatures">
-            <h3>Key Features</h3>
+            <h3>${this.featuresheader}</h3>
             <ul>
@@ -537,3 +565,3 @@ ${
                 return html`
-                              <div slot="${index + 1}"><img src="${screen.src}"></div>
+                              <div slot="${index + 1}"><img alt="App Screenshot" src="${screen.src}"></div>
                             `
@@ -548,3 +576,3 @@ })}
           <div>
-            <h3>App Description</h3>
+            <h3>${this.descriptionheader}</h3>
             <p>${this.manifestdata.description}</p>
@@ -551,0 +579,0 @@ </div>

No alert changes

Improved metrics

Total package byte prevSize

521104

increased by1.57%

Number of package files

17

increased by13.33%

Lines of code

3720

increased by3.16%

Number of lines in readme file

60

increased by3.45%

No dependency changes