core(installable-manifest): check for fetchable icon

lighthouse-cli/test/smokehouse/test-definitions/offline-local/offline-expectations.js

@@ -101,6 +101,26 @@ module.exports = [
     },
   },
   {
+    artifacts: {
+      WebAppManifest: {
+        value: {
+          icons: {
+            value: [
+              {value: {src: {value: 'http://localhost:10503/launcher-icon-0-75x.png'}}},
+              {value: {src: {value: 'http://localhost:10503/launcher-icon-1x.png'}}},
+              {value: {src: {value: 'http://localhost:10503/launcher-icon-1-5x.png'}}},
+              {value: {src: {value: 'http://localhost:10503/launcher-icon-2x.png'}}},
+              {value: {src: {value: 'http://localhost:10503/launcher-icon-3x.png'}}},
+            ],
+          },
+        },
+      },
+      InstallabilityErrors: {
+        errors: [
+          'Downloaded icon was empty or corrupted',
+        ],
+      },
+    },
     lhr: {
       requestedUrl: 'http://localhost:10503/offline-ready.html',
       finalUrl: 'http://localhost:10503/offline-ready.html',
@@ -130,7 +150,8 @@ module.exports = [
           scoreDisplayMode: 'notApplicable',
         },
         'installable-manifest': {
-          score: 1,
+          score: 0,
+          explanation: 'Failures: Manifest icon failed to be fetched.',
         },
         'splash-screen': {
           score: 0,

lighthouse-core/audits/installable-manifest.js

@@ -46,7 +46,7 @@ class InstallableManifest extends MultiCheckAudit {
       title: str_(UIStrings.title),
       failureTitle: str_(UIStrings.failureTitle),
       description: str_(UIStrings.description),
-      requiredArtifacts: ['URL', 'WebAppManifest'],
+      requiredArtifacts: ['URL', 'WebAppManifest', 'InstallabilityErrors'],
     };
   }
 
@@ -73,6 +73,7 @@ class InstallableManifest extends MultiCheckAudit {
       'hasStartUrl',
       'hasPWADisplayValue',
       'hasIconsAtLeast144px',
+      'fetchesIcon',
     ];
     manifestValues.allChecks
       .filter(item => bannerCheckIds.includes(item.id))
@@ -91,7 +92,7 @@ class InstallableManifest extends MultiCheckAudit {
    * @return {Promise<{failures: Array<string>, manifestValues: LH.Artifacts.ManifestValues}>}
    */
   static async audit_(artifacts, context) {
-    const manifestValues = await ManifestValues.request(artifacts.WebAppManifest, context);
+    const manifestValues = await ManifestValues.request(artifacts, context);
     const manifestFailures = InstallableManifest.assessManifest(manifestValues);
 
     return {

lighthouse-core/audits/service-worker.js

@@ -95,19 +95,19 @@ class ServiceWorker extends Audit {
   /**
    * Returns a failure message if there is no start_url or if the start_url isn't
    * contolled by the scopeUrl.
-   * @param {LH.Artifacts['WebAppManifest']} manifest
+   * @param {LH.Artifacts['WebAppManifest']} WebAppManifest
    * @param {string} scopeUrl
    * @return {string|undefined}
    */
-  static checkStartUrl(manifest, scopeUrl) {
-    if (!manifest) {
+  static checkStartUrl(WebAppManifest, scopeUrl) {
+    if (!WebAppManifest) {
       return str_(UIStrings.explanationNoManifest);
     }
-    if (!manifest.value) {
+    if (!WebAppManifest.value) {
       return str_(UIStrings.explanationBadManifest);
     }
 
-    const startUrl = manifest.value.start_url.value;
+    const startUrl = WebAppManifest.value.start_url.value;
     if (!startUrl.startsWith(scopeUrl)) {
       return str_(UIStrings.explanationBadStartUrl, {startUrl, scopeUrl});
     }

lighthouse-core/audits/splash-screen.js

@@ -45,7 +45,7 @@ class SplashScreen extends MultiCheckAudit {
       title: str_(UIStrings.title),
       failureTitle: str_(UIStrings.failureTitle),
       description: str_(UIStrings.description),
-      requiredArtifacts: ['WebAppManifest'],
+      requiredArtifacts: ['WebAppManifest', 'InstallabilityErrors'],
     };
   }
 
@@ -84,7 +84,7 @@ class SplashScreen extends MultiCheckAudit {
     /** @type {Array<string>} */
     const failures = [];
 
-    const manifestValues = await ManifestValues.request(artifacts.WebAppManifest, context);
+    const manifestValues = await ManifestValues.request(artifacts, context);
     SplashScreen.assessManifest(manifestValues, failures);
 
     return {

lighthouse-core/audits/themed-omnibox.js

@@ -42,7 +42,7 @@ class ThemedOmnibox extends MultiCheckAudit {
       title: str_(UIStrings.title),
       failureTitle: str_(UIStrings.failureTitle),
       description: str_(UIStrings.description),
-      requiredArtifacts: ['WebAppManifest', 'MetaElements'],
+      requiredArtifacts: ['WebAppManifest', 'InstallabilityErrors', 'MetaElements'],
     };
   }
 
@@ -93,7 +93,7 @@ class ThemedOmnibox extends MultiCheckAudit {
     const failures = [];
 
     const themeColorMeta = artifacts.MetaElements.find(meta => meta.name === 'theme-color');
-    const manifestValues = await ManifestValues.request(artifacts.WebAppManifest, context);
+    const manifestValues = await ManifestValues.request(artifacts, context);
     ThemedOmnibox.assessManifest(manifestValues, failures);
     ThemedOmnibox.assessMetaThemecolor(themeColorMeta, failures);
 

lighthouse-core/computed/manifest-values.js

@@ -15,7 +15,7 @@ const PWA_DISPLAY_VALUES = ['minimal-ui', 'fullscreen', 'standalone'];
 const SUGGESTED_SHORTNAME_LENGTH = 12;
 
 class ManifestValues {
-  /** @typedef {(val: NonNullable<LH.Artifacts.Manifest['value']>) => boolean} Validator */
+  /** @typedef {(val: NonNullable<LH.Artifacts.Manifest['value']>, errors: string[]) => boolean} Validator */
 
   /**
    * @return {Array<{id: LH.Artifacts.ManifestValueCheckID, failureText: string, validate: Validator}>}
@@ -39,6 +39,20 @@ class ManifestValues {
         validate: manifestValue => icons.doExist(manifestValue) &&
             icons.pngSizedAtLeast(512, manifestValue).length > 0,
       },
+      {
+        id: 'fetchesIcon',
+        failureText: 'Manifest icon failed to be fetched',
+        validate: (manifestValue, errors) => {
+          const failedToFetchIconErrors = [
+            // kCannotDownloadIconMessage
+            'Could not download a required icon from the manifest',
+            // kNoIconAvailableMessage
+            'Downloaded icon was empty or corrupted',
+          ];
+          return icons.doExist(manifestValue) &&
+            !failedToFetchIconErrors.some(error => errors.includes(error));
+        },
+      },
       {
         id: 'hasPWADisplayValue',
         failureText: 'Manifest\'s `display` value is not one of: ' + PWA_DISPLAY_VALUES.join(' | '),
@@ -77,19 +91,19 @@ class ManifestValues {
 
   /**
    * Returns results of all manifest checks
-   * @param {LH.Artifacts['WebAppManifest']} manifest
+   * @param {Pick<LH.Artifacts, 'WebAppManifest'|'InstallabilityErrors'>} Manifest
    * @return {Promise<LH.Artifacts.ManifestValues>}
    */
-  static async compute_(manifest) {
+  static async compute_({WebAppManifest, InstallabilityErrors}) {
     // if the manifest isn't there or is invalid json, we report that and bail
-    if (manifest === null) {
+    if (WebAppManifest === null) {
       return {
         isParseFailure: true,
         parseFailureReason: 'No manifest was fetched',
         allChecks: [],
       };
     }
-    const manifestValue = manifest.value;
+    const manifestValue = WebAppManifest.value;
     if (manifestValue === undefined) {
       return {
         isParseFailure: true,
@@ -103,7 +117,7 @@ class ManifestValues {
       return {
         id: item.id,
         failureText: item.failureText,
-        passing: item.validate(manifestValue),
+        passing: item.validate(manifestValue, InstallabilityErrors.errors),
       };
     });
 

lighthouse-core/config/config.js

@@ -34,6 +34,7 @@ const BASE_ARTIFACT_BLANKS = {
   NetworkUserAgent: '',
   BenchmarkIndex: '',
   WebAppManifest: '',
+  InstallabilityErrors: '',
   Stacks: '',
   traces: '',
   devtoolsLogs: '',

lighthouse-core/gather/gather-runner.js

@@ -483,6 +483,7 @@ class GatherRunner {
       NetworkUserAgent: '', // updated later
       BenchmarkIndex: 0, // updated later
       WebAppManifest: null, // updated later
+      InstallabilityErrors: {errors: []}, // updated later
       Stacks: [], // updated later
       traces: {},
       devtoolsLogs: {},
@@ -515,6 +516,11 @@ class GatherRunner {
     // Fetch the manifest, if it exists.
     baseArtifacts.WebAppManifest = await GatherRunner.getWebAppManifest(passContext);
 
+    if (baseArtifacts.WebAppManifest) {
+      baseArtifacts.InstallabilityErrors =
+        await passContext.driver.sendCommand('Page.getInstallabilityErrors');
+    }
+
     baseArtifacts.Stacks = await stacksGatherer(passContext);
 
     // Find the NetworkUserAgent actually used in the devtoolsLogs.

lighthouse-core/gather/gatherers/start-url.js

@@ -31,8 +31,8 @@ class StartUrl extends Gatherer {
    * @return {Promise<LH.Artifacts['StartUrl']>}
    */
   async _determineStartUrlAvailability(passContext) {
-    const manifest = passContext.baseArtifacts.WebAppManifest;
-    const startUrlInfo = this._readManifestStartUrl(manifest);
+    const WebAppManifest = passContext.baseArtifacts.WebAppManifest;
+    const startUrlInfo = this._readManifestStartUrl(WebAppManifest);
     if (startUrlInfo.isReadFailure) {
       return {statusCode: -1, explanation: startUrlInfo.reason};
     }
@@ -52,12 +52,12 @@ class StartUrl extends Gatherer {
 
   /**
    * Read the parsed manifest and return failure reasons or the startUrl
-   * @param {LH.Artifacts.Manifest|null} manifest
+   * @param {LH.Artifacts.Manifest|null} WebAppManifest
    * @return {{isReadFailure: true, reason: string}|{isReadFailure: false, startUrl: string}}
    */
-  _readManifestStartUrl(manifest) {
-    if (!manifest || !manifest.value) {
-      const detailedMsg = manifest && manifest.warning;
+  _readManifestStartUrl(WebAppManifest) {
+    if (!WebAppManifest || !WebAppManifest.value) {
+      const detailedMsg = WebAppManifest && WebAppManifest.warning;
 
       if (detailedMsg) {
         return {isReadFailure: true, reason: `Error fetching web app manifest: ${detailedMsg}.`};
@@ -67,7 +67,7 @@ class StartUrl extends Gatherer {
     }
 
     // Even if the start URL had a parser warning, the browser will still supply a fallback URL.
-    return {isReadFailure: false, startUrl: manifest.value.start_url.value};
+    return {isReadFailure: false, startUrl: WebAppManifest.value.start_url.value};
   }
 
   /**

lighthouse-core/scripts/build-report-for-autodeployment.js

@@ -82,6 +82,7 @@ async function generateErrorLHR() {
     NetworkUserAgent: 'Mozilla/5.0 ErrorUserAgent Chrome/66',
     BenchmarkIndex: 1000,
     WebAppManifest: null,
+    InstallabilityErrors: {errors: []},
     Stacks: [],
     settings: defaultSettings,
     URL: {

lighthouse-core/test/audits/installable-manifest-test.js

@@ -19,6 +19,7 @@ function generateMockArtifacts(src = manifestSrc) {
 
   const clonedArtifacts = JSON.parse(JSON.stringify({
     WebAppManifest: exampleManifest,
+    InstallabilityErrors: {errors: []},
     URL: {finalUrl: 'https://example.com'},
   }));
   return clonedArtifacts;
@@ -44,8 +45,7 @@ describe('PWA: webapp install banner audit', () => {
     });
 
     it('fails with a non-parsable manifest', () => {
-      const artifacts = generateMockArtifacts();
-      artifacts.WebAppManifest = manifestParser('{,:}', EXAMPLE_MANIFEST_URL, EXAMPLE_DOC_URL);
+      const artifacts = generateMockArtifacts('{,:}');
       const context = generateMockAuditContext();
       return InstallableManifestAudit.audit(artifacts, context).then(result => {
         assert.strictEqual(result.score, 0);
@@ -54,13 +54,12 @@ describe('PWA: webapp install banner audit', () => {
     });
 
     it('fails when an empty manifest is present', () => {
-      const artifacts = generateMockArtifacts();
-      artifacts.WebAppManifest = manifestParser('{}', EXAMPLE_MANIFEST_URL, EXAMPLE_DOC_URL);
+      const artifacts = generateMockArtifacts('{}');
       const context = generateMockAuditContext();
       return InstallableManifestAudit.audit(artifacts, context).then(result => {
         assert.strictEqual(result.score, 0);
         assert.ok(result.explanation);
-        assert.strictEqual(result.details.items[0].failures.length, 4);
+        assert.strictEqual(result.details.items[0].failures.length, 5);
       });
     });
 
@@ -132,11 +131,27 @@ describe('PWA: webapp install banner audit', () => {
         assert.ok(result.explanation.includes('PNG icon'), result.explanation);
 
         const details = result.details.items[0];
-        assert.strictEqual(details.failures.length, 1, details.failures);
+        assert.strictEqual(details.failures.length, 2, details.failures);
         assert.strictEqual(details.hasStartUrl, true);
         assert.strictEqual(details.hasIconsAtLeast144px, false);
       });
     });
+
+    it('fails if page had no fetchable icons in the manifest', () => {
+      const artifacts = generateMockArtifacts();
+      artifacts.InstallabilityErrors.errors.push('Downloaded icon was empty or corrupted');
+      const context = generateMockAuditContext();
+
+      return InstallableManifestAudit.audit(artifacts, context).then(result => {
+        assert.strictEqual(result.score, 0);
+        assert.ok(result.explanation.includes('failed to be fetched'), result.explanation);
+
+        const details = result.details.items[0];
+        assert.strictEqual(details.failures.length, 1, details.failures);
+        assert.strictEqual(details.hasStartUrl, true);
+        assert.strictEqual(details.hasIconsAtLeast144px, true);
+      });
+    });
   });
 
   it('fails if icons were present, but no valid PNG present', () => {

lighthouse-core/test/audits/service-worker-test.js

@@ -47,17 +47,17 @@ function createSWArtifact(swOpts) {
  * Create a set of artifacts for the ServiceWorker audit.
  * @param {Array<{scriptURL: string, status: string, scopeURL?: string}>} swOpts
  * @param {string} finalUrl
- * @param {{}}} manifestJson WebAppManifest object or null if no manifest desired.
+ * @param {{}|string|null} manifestJsonOrObject WebAppManifest object or string or null if no manifest desired.
  */
-function createArtifacts(swOpts, finalUrl, manifestJson) {
+function createArtifacts(swOpts, finalUrl, manifestJsonOrObject) {
   const manifestUrl = getBaseDirectory(finalUrl) + 'manifest.json';
   let WebAppManifest;
-  if (manifestJson === null) {
+  if (manifestJsonOrObject === null) {
     WebAppManifest = null;
-  } else if (typeof manifestJson === 'object') {
-    WebAppManifest = manifestParser(JSON.stringify(manifestJson), manifestUrl, finalUrl);
   } else {
-    throw new Error('unsupported test manifest format');
+    const manifestJson = typeof manifestJsonOrObject === 'object' ?
+      JSON.stringify(manifestJsonOrObject) : manifestJsonOrObject;
+    WebAppManifest = manifestParser(manifestJson, manifestUrl, finalUrl);
   }
 
   return {
@@ -281,9 +281,7 @@ describe('Offline: service worker audit', () => {
       status: 'activated',
       scriptURL: 'https://example.com/sw.js',
     }];
-
-    const artifacts = createArtifacts(swOpts, finalUrl, {});
-    artifacts.WebAppManifest = manifestParser('{,;}', finalUrl, finalUrl);
+    const artifacts = createArtifacts(swOpts, finalUrl, '{,;}');
 
     const output = ServiceWorker.audit(artifacts);
     assert.strictEqual(output.score, 0);

lighthouse-core/test/audits/splash-screen-test.js

@@ -22,6 +22,7 @@ function generateMockArtifacts(src = manifestSrc) {
 
   return {
     WebAppManifest: exampleManifest,
+    InstallabilityErrors: {errors: []},
   };
 }
 function generateMockAuditContext() {
@@ -45,8 +46,7 @@ describe('PWA: splash screen audit', () => {
     });
 
     it('fails with a non-parsable manifest', () => {
-      const artifacts = generateMockArtifacts();
-      artifacts.WebAppManifest = manifestParser('{,:}', EXAMPLE_MANIFEST_URL, EXAMPLE_DOC_URL);
+      const artifacts = generateMockArtifacts('{,:}');
       const context = generateMockAuditContext();
       return SplashScreenAudit.audit(artifacts, context).then(result => {
         assert.strictEqual(result.score, 0);
@@ -55,8 +55,7 @@ describe('PWA: splash screen audit', () => {
     });
 
     it('fails when an empty manifest is present', () => {
-      const artifacts = generateMockArtifacts();
-      artifacts.WebAppManifest = manifestParser('{}', EXAMPLE_MANIFEST_URL, EXAMPLE_DOC_URL);
+      const artifacts = generateMockArtifacts('{}');
       const context = generateMockAuditContext();
       return SplashScreenAudit.audit(artifacts, context).then(result => {
         assert.strictEqual(result.score, 0);