i18n: pwa

lighthouse-core/audits/content-width.js

@@ -6,6 +6,18 @@
 'use strict';
 
 const Audit = require('./audit.js');
+const i18n = require('../lib/i18n/i18n.js');
+
+const UIStrings = {
+  title: 'Content is sized correctly for the viewport',
+  failureTitle: 'Content is not sized correctly for the viewport',
+  description: 'If the width of your app\'s content doesn\'t match the width ' +
+      'of the viewport, your app might not be optimized for mobile screens. ' +
+      '[Learn more](https://developers.google.com/web/tools/lighthouse/audits/content-sized-correctly-for-viewport).',
+  explanation: 'The viewport size is {innerWidth}px, whereas the window size is {outerWidth}px.',
+};
+
+const str_ = i18n.createMessageInstanceIdFn(__filename, UIStrings);
 
 class ContentWidth extends Audit {
   /**
@@ -14,11 +26,9 @@ class ContentWidth extends Audit {
   static get meta() {
     return {
       id: 'content-width',
-      title: 'Content is sized correctly for the viewport',
-      failureTitle: 'Content is not sized correctly for the viewport',
-      description: 'If the width of your app\'s content doesn\'t match the width ' +
-          'of the viewport, your app might not be optimized for mobile screens. ' +
-          '[Learn more](https://developers.google.com/web/tools/lighthouse/audits/content-sized-correctly-for-viewport).',
+      title: str_(UIStrings.title),
+      failureTitle: str_(UIStrings.failureTitle),
+      description: str_(UIStrings.description),
       requiredArtifacts: ['ViewportDimensions', 'TestedAsMobileDevice'],
     };
   }
@@ -33,32 +43,26 @@ class ContentWidth extends Audit {
     const windowWidth = artifacts.ViewportDimensions.outerWidth;
     const widthsMatch = viewportWidth === windowWidth;
 
-    if (IsMobile) {
-      return {
-        score: Number(widthsMatch),
-        explanation: this.createExplanation(widthsMatch, artifacts.ViewportDimensions),
-      };
-    } else {
+    if (!IsMobile) {
       return {
         score: 1,
         notApplicable: true,
       };
     }
-  }
 
-  /**
-   * @param {boolean} match
-   * @param {LH.Artifacts.ViewportDimensions} artifact
-   * @return {string}
-   */
-  static createExplanation(match, artifact) {
-    if (match) {
-      return '';
+    let explanation = '';
+    if (!widthsMatch) {
+      explanation = str_(UIStrings.explanation,
+        {innerWidth: artifacts.ViewportDimensions.innerWidth,
+          outerWidth: artifacts.ViewportDimensions.outerWidth});
     }
 
-    return 'The viewport size is ' + artifact.innerWidth + 'px, ' +
-        'whereas the window size is ' + artifact.outerWidth + 'px.';
+    return {
+      score: Number(widthsMatch),
+      explanation,
+    };
   }
 }
 
 module.exports = ContentWidth;
+module.exports.UIStrings = UIStrings;

lighthouse-core/audits/installable-manifest.js

@@ -7,6 +7,17 @@
 
 const MultiCheckAudit = require('./multi-check-audit.js');
 const ManifestValues = require('../computed/manifest-values.js');
+const i18n = require('../lib/i18n/i18n.js');
+
+const UIStrings = {
+  title: 'Web app manifest meets the installability requirements',
+  failureTitle: 'Web app manifest does not meet the installability requirements',
+  description: 'Browsers can proactively prompt users to add your app to their homescreen, ' +
+    'which can lead to higher engagement. ' +
+    '[Learn more](https://developers.google.com/web/tools/lighthouse/audits/install-prompt).',
+};
+
+const str_ = i18n.createMessageInstanceIdFn(__filename, UIStrings);
 
 /**
  * @fileoverview
@@ -29,11 +40,9 @@ class InstallableManifest extends MultiCheckAudit {
   static get meta() {
     return {
       id: 'installable-manifest',
-      title: 'Web app manifest meets the installability requirements',
-      failureTitle: 'Web app manifest does not meet the installability requirements',
-      description: 'Browsers can proactively prompt users to add your app to their homescreen, ' +
-          'which can lead to higher engagement. ' +
-          '[Learn more](https://developers.google.com/web/tools/lighthouse/audits/install-prompt).',
+      title: str_(UIStrings.title),
+      failureTitle: str_(UIStrings.failureTitle),
+      description: str_(UIStrings.description),
       requiredArtifacts: ['URL', 'WebAppManifest'],
     };
   }
@@ -92,3 +101,4 @@ class InstallableManifest extends MultiCheckAudit {
 }
 
 module.exports = InstallableManifest;
+module.exports.UIStrings = UIStrings;

lighthouse-core/audits/is-on-https.js

@@ -7,9 +7,25 @@
 
 const Audit = require('./audit.js');
 const URL = require('../lib/url-shim.js');
-const Util = require('../report/html/renderer/util.js');
 const NetworkRecords = require('../computed/network-records.js');
+const i18n = require('../lib/i18n/i18n.js');
 
+const UIStrings = {
+  title: 'Uses HTTPS',
+  failureTitle: 'Does not use HTTPS',
+  description: 'All sites should be protected with HTTPS, even ones that don\'t handle ' +
+    'sensitive data. HTTPS prevents intruders from tampering with or passively listening ' +
+    'in on the communications between your app and your users, and is a prerequisite for ' +
+    'HTTP/2 and many new web platform APIs. ' +
+    '[Learn more](https://developers.google.com/web/tools/lighthouse/audits/https).',
+  displayValue: `{itemCount, plural,
+    =1 {1 insecure request found}
+    other {# insecure requests found}
+    }`,
+  columnInsecure: 'Insecure URL',
+};
+
+const str_ = i18n.createMessageInstanceIdFn(__filename, UIStrings);
 const SECURE_SCHEMES = ['data', 'https', 'wss', 'blob', 'chrome', 'chrome-extension', 'about'];
 const SECURE_DOMAINS = ['localhost', '127.0.0.1'];
 
@@ -20,13 +36,9 @@ class HTTPS extends Audit {
   static get meta() {
     return {
       id: 'is-on-https',
-      title: 'Uses HTTPS',
-      failureTitle: 'Does not use HTTPS',
-      description: 'All sites should be protected with HTTPS, even ones that don\'t handle ' +
-          'sensitive data. HTTPS prevents intruders from tampering with or passively listening ' +
-          'in on the communications between your app and your users, and is a prerequisite for ' +
-          'HTTP/2 and many new web platform APIs. ' +
-          '[Learn more](https://developers.google.com/web/tools/lighthouse/audits/https).',
+      title: str_(UIStrings.title),
+      failureTitle: str_(UIStrings.failureTitle),
+      description: str_(UIStrings.description),
       requiredArtifacts: ['devtoolsLogs'],
     };
   }
@@ -54,17 +66,15 @@ class HTTPS extends Audit {
           .map(record => URL.elideDataURI(record.url));
 
       let displayValue = '';
-      if (insecureURLs.length > 1) {
-        displayValue = `${Util.formatNumber(insecureURLs.length)} insecure requests found`;
-      } else if (insecureURLs.length === 1) {
-        displayValue = `${insecureURLs.length} insecure request found`;
+      if (insecureURLs.length > 0) {
+        displayValue = str_(UIStrings.displayValue, {itemCount: insecureURLs.length});
       }
 
       const items = Array.from(new Set(insecureURLs)).map(url => ({url}));
 
       /** @type {LH.Audit.Details.Table['headings']} */
       const headings = [
-        {key: 'url', itemType: 'url', text: 'Insecure URL'},
+        {key: 'url', itemType: 'url', text: str_(UIStrings.columnInsecure)},
       ];
 
       return {
@@ -80,3 +90,4 @@ class HTTPS extends Audit {
 }
 
 module.exports = HTTPS;
+module.exports.UIStrings = UIStrings;

lighthouse-core/audits/manual/pwa-cross-browser.js

@@ -7,6 +7,15 @@
 'use strict';
 
 const ManualAudit = require('./manual-audit.js');
+const i18n = require('../../lib/i18n/i18n.js');
+
+const UIStrings = {
+  title: 'Site works cross-browser',
+  description: 'To reach the most number of users, sites should work across ' +
+  'every major browser. [Learn more](https://developers.google.com/web/progressive-web-apps/checklist#site-works-cross-browser).',
+};
+
+const str_ = i18n.createMessageInstanceIdFn(__filename, UIStrings);
 
 /**
  * @fileoverview Manual PWA audit for cross browser support.
@@ -19,11 +28,12 @@ class PWACrossBrowser extends ManualAudit {
   static get meta() {
     return Object.assign({
       id: 'pwa-cross-browser',
-      description: 'To reach the most number of users, sites should work across ' +
-      'every major browser. [Learn more](https://developers.google.com/web/progressive-web-apps/checklist#site-works-cross-browser).',
-      title: 'Site works cross-browser',
+      title: str_(UIStrings.title),
+      description: str_(UIStrings.description),
     }, super.partialMeta);
   }
 }
 
 module.exports = PWACrossBrowser;
+module.exports.UIStrings = UIStrings;
+

lighthouse-core/audits/manual/pwa-each-page-has-url.js

@@ -6,6 +6,15 @@
 'use strict';
 
 const ManualAudit = require('./manual-audit.js');
+const i18n = require('../../lib/i18n/i18n.js');
+
+const UIStrings = {
+  title: 'Each page has a URL',
+  description: 'Ensure individual pages are deep linkable via the URLs and that URLs are ' +
+      'unique for the purpose of shareability on social media. [Learn more](https://developers.google.com/web/progressive-web-apps/checklist#each-page-has-a-url).',
+};
+
+const str_ = i18n.createMessageInstanceIdFn(__filename, UIStrings);
 
 /**
  * @fileoverview Manual PWA audit to ensure every page has a deep link.
@@ -18,11 +27,11 @@ class PWAEachPageHasURL extends ManualAudit {
   static get meta() {
     return Object.assign({
       id: 'pwa-each-page-has-url',
-      description: 'Ensure individual pages are deep linkable via the URLs and that URLs are ' +
-          'unique for the purpose of shareability on social media. [Learn more](https://developers.google.com/web/progressive-web-apps/checklist#each-page-has-a-url).',
-      title: 'Each page has a URL',
+      title: str_(UIStrings.title),
+      description: str_(UIStrings.description),
     }, super.partialMeta);
   }
 }
 
 module.exports = PWAEachPageHasURL;
+module.exports.UIStrings = UIStrings;

lighthouse-core/audits/manual/pwa-page-transitions.js

@@ -6,6 +6,15 @@
 'use strict';
 
 const ManualAudit = require('./manual-audit.js');
+const i18n = require('../../lib/i18n/i18n.js');
+
+const UIStrings = {
+  title: 'Page transitions don\'t feel like they block on the network',
+  description: 'Transitions should feel snappy as you tap around, even on a slow network, a ' +
+      'key to perceived performance. [Learn more](https://developers.google.com/web/progressive-web-apps/checklist#page-transitions-dont-feel-like-they-block-on-the-network).',
+};
+
+const str_ = i18n.createMessageInstanceIdFn(__filename, UIStrings);
 
 /**
  * @fileoverview Manual PWA audit for janky-free page transitions.
@@ -18,11 +27,11 @@ class PWAPageTransitions extends ManualAudit {
   static get meta() {
     return Object.assign({
       id: 'pwa-page-transitions',
-      description: 'Transitions should feel snappy as you tap around, even on a slow network, a ' +
-          'key to perceived performance. [Learn more](https://developers.google.com/web/progressive-web-apps/checklist#page-transitions-dont-feel-like-they-block-on-the-network).',
-      title: 'Page transitions don\'t feel like they block on the network',
+      title: str_(UIStrings.title),
+      description: str_(UIStrings.description),
     }, super.partialMeta);
   }
 }
 
 module.exports = PWAPageTransitions;
+module.exports.UIStrings = UIStrings;

lighthouse-core/audits/multi-check-audit.js

@@ -53,6 +53,7 @@ class MultiCheckAudit extends Audit {
     if (result.failures.length > 0) {
       return {
         score: 0,
+        // TODO(exterkamp): make this i18n-able.
         explanation: `Failures: ${result.failures.join(',\n')}.`,
         details,
       };

lighthouse-core/audits/offline-start-url.js

@@ -6,6 +6,18 @@
 'use strict';
 
 const Audit = require('./audit.js');
+const i18n = require('../lib/i18n/i18n.js');
+
+const UIStrings = {
+  title: 'start_url responds with a 200 when offline',
+  failureTitle: 'start_url does not respond with a 200 when offline',
+  description: 'A service worker enables your web app to be reliable in unpredictable ' +
+    'network conditions. [Learn more](https://developers.google.com/web/tools/lighthouse/audits/http-200-when-offline).',
+  warningCantStart: 'We couldn\'t read the start_url from the manifest. As a result, the ' +
+    'start_url was assumed to be the document\'s URL. Error message: \'{manifestWarning}\'.',
+};
+
+const str_ = i18n.createMessageInstanceIdFn(__filename, UIStrings);
 
 class OfflineStartUrl extends Audit {
   /**
@@ -14,9 +26,9 @@ class OfflineStartUrl extends Audit {
   static get meta() {
     return {
       id: 'offline-start-url',
-      title: 'start_url responds with a 200 when offline',
-      failureTitle: 'start_url does not respond with a 200 when offline',
-      description: 'A service worker enables your web app to be reliable in unpredictable network conditions. [Learn more](https://developers.google.com/web/tools/lighthouse/audits/http-200-when-offline).',
+      title: str_(UIStrings.title),
+      failureTitle: str_(UIStrings.failureTitle),
+      description: str_(UIStrings.description),
       requiredArtifacts: ['WebAppManifest', 'StartUrl'],
     };
   }
@@ -32,8 +44,7 @@ class OfflineStartUrl extends Audit {
     const manifest = artifacts.WebAppManifest;
     if (manifest && manifest.value && manifest.value.start_url.warning) {
       const manifestWarning = manifest.value.start_url.warning;
-      warnings.push('We couldn\'t read the start_url from the manifest. As a result, the ' +
-          `start_url was assumed to be the document's URL. Error message: '${manifestWarning}'.`);
+      warnings.push(str_(UIStrings.warningCantStart, {manifestWarning}));
     }
 
     const hasOfflineStartUrl = artifacts.StartUrl.statusCode === 200;
@@ -47,3 +58,4 @@ class OfflineStartUrl extends Audit {
 }
 
 module.exports = OfflineStartUrl;
+module.exports.UIStrings = UIStrings;

lighthouse-core/audits/redirects-http.js

@@ -6,6 +6,16 @@
 'use strict';
 
 const Audit = require('./audit.js');
+const i18n = require('../lib/i18n/i18n.js');
+
+const UIStrings = {
+  title: 'Redirects HTTP traffic to HTTPS',
+  failureTitle: 'Does not redirect HTTP traffic to HTTPS',
+  description: 'If you\'ve already set up HTTPS, make sure that you redirect all HTTP ' +
+     'traffic to HTTPS. [Learn more](https://developers.google.com/web/tools/lighthouse/audits/http-redirects-to-https).',
+};
+
+const str_ = i18n.createMessageInstanceIdFn(__filename, UIStrings);
 
 class RedirectsHTTP extends Audit {
   /**
@@ -14,10 +24,9 @@ class RedirectsHTTP extends Audit {
   static get meta() {
     return {
       id: 'redirects-http',
-      title: 'Redirects HTTP traffic to HTTPS',
-      failureTitle: 'Does not redirect HTTP traffic to HTTPS',
-      description: 'If you\'ve already set up HTTPS, make sure that you redirect all HTTP ' +
-         'traffic to HTTPS. [Learn more](https://developers.google.com/web/tools/lighthouse/audits/http-redirects-to-https).',
+      title: str_(UIStrings.title),
+      failureTitle: str_(UIStrings.failureTitle),
+      description: str_(UIStrings.description),
       requiredArtifacts: ['HTTPRedirect'],
     };
   }
@@ -34,3 +43,4 @@ class RedirectsHTTP extends Audit {
 }
 
 module.exports = RedirectsHTTP;
+module.exports.UIStrings = UIStrings;