report: add timespan/snapshot mode labels to footer

core/test/fixtures/user-flows/reports/sample-flow-result.json

@@ -7004,6 +7004,8 @@
             "opportunitySavingsColumnLabel": "Estimated Savings",
             "passedAuditsGroupTitle": "Passed audits",
             "runtimeAnalysisWindow": "Initial page load",
+            "runtimeAnalysisWindowSnapshot": "Point-in-time snapshot",
+            "runtimeAnalysisWindowTimespan": "User interactions timespan",
             "runtimeCustom": "Custom throttling",
             "runtimeDesktopEmulation": "Emulated Desktop",
             "runtimeMobileEmulation": "Emulated Moto G Power",
@@ -7015,8 +7017,8 @@
             "runtimeSettingsNetworkThrottling": "Network throttling",
             "runtimeSettingsScreenEmulation": "Screen emulation",
             "runtimeSettingsUANetwork": "User agent (network)",
-            "runtimeSingleLoad": "Single page load",
-            "runtimeSingleLoadTooltip": "This data is taken from a single page load, as opposed to field data summarizing many sessions.",
+            "runtimeSingleLoad": "Single page session",
+            "runtimeSingleLoadTooltip": "This data is taken from a single page session, as opposed to field data summarizing many sessions.",
             "runtimeSlow4g": "Slow 4G throttling",
             "runtimeUnknown": "Unknown",
             "show": "Show",
@@ -11842,6 +11844,8 @@
             "opportunitySavingsColumnLabel": "Estimated Savings",
             "passedAuditsGroupTitle": "Passed audits",
             "runtimeAnalysisWindow": "Initial page load",
+            "runtimeAnalysisWindowSnapshot": "Point-in-time snapshot",
+            "runtimeAnalysisWindowTimespan": "User interactions timespan",
             "runtimeCustom": "Custom throttling",
             "runtimeDesktopEmulation": "Emulated Desktop",
             "runtimeMobileEmulation": "Emulated Moto G Power",
@@ -11853,8 +11857,8 @@
             "runtimeSettingsNetworkThrottling": "Network throttling",
             "runtimeSettingsScreenEmulation": "Screen emulation",
             "runtimeSettingsUANetwork": "User agent (network)",
-            "runtimeSingleLoad": "Single page load",
-            "runtimeSingleLoadTooltip": "This data is taken from a single page load, as opposed to field data summarizing many sessions.",
+            "runtimeSingleLoad": "Single page session",
+            "runtimeSingleLoadTooltip": "This data is taken from a single page session, as opposed to field data summarizing many sessions.",
             "runtimeSlow4g": "Slow 4G throttling",
             "runtimeUnknown": "Unknown",
             "show": "Show",
@@ -16836,6 +16840,8 @@
             "opportunitySavingsColumnLabel": "Estimated Savings",
             "passedAuditsGroupTitle": "Passed audits",
             "runtimeAnalysisWindow": "Initial page load",
+            "runtimeAnalysisWindowSnapshot": "Point-in-time snapshot",
+            "runtimeAnalysisWindowTimespan": "User interactions timespan",
             "runtimeCustom": "Custom throttling",
             "runtimeDesktopEmulation": "Emulated Desktop",
             "runtimeMobileEmulation": "Emulated Moto G Power",
@@ -16847,8 +16853,8 @@
             "runtimeSettingsNetworkThrottling": "Network throttling",
             "runtimeSettingsScreenEmulation": "Screen emulation",
             "runtimeSettingsUANetwork": "User agent (network)",
-            "runtimeSingleLoad": "Single page load",
-            "runtimeSingleLoadTooltip": "This data is taken from a single page load, as opposed to field data summarizing many sessions.",
+            "runtimeSingleLoad": "Single page session",
+            "runtimeSingleLoadTooltip": "This data is taken from a single page session, as opposed to field data summarizing many sessions.",
             "runtimeSlow4g": "Slow 4G throttling",
             "runtimeUnknown": "Unknown",
             "show": "Show",
@@ -24605,6 +24611,8 @@
             "opportunitySavingsColumnLabel": "Estimated Savings",
             "passedAuditsGroupTitle": "Passed audits",
             "runtimeAnalysisWindow": "Initial page load",
+            "runtimeAnalysisWindowSnapshot": "Point-in-time snapshot",
+            "runtimeAnalysisWindowTimespan": "User interactions timespan",
             "runtimeCustom": "Custom throttling",
             "runtimeDesktopEmulation": "Emulated Desktop",
             "runtimeMobileEmulation": "Emulated Moto G Power",
@@ -24616,8 +24624,8 @@
             "runtimeSettingsNetworkThrottling": "Network throttling",
             "runtimeSettingsScreenEmulation": "Screen emulation",
             "runtimeSettingsUANetwork": "User agent (network)",
-            "runtimeSingleLoad": "Single page load",
-            "runtimeSingleLoadTooltip": "This data is taken from a single page load, as opposed to field data summarizing many sessions.",
+            "runtimeSingleLoad": "Single page session",
+            "runtimeSingleLoadTooltip": "This data is taken from a single page session, as opposed to field data summarizing many sessions.",
             "runtimeSlow4g": "Slow 4G throttling",
             "runtimeUnknown": "Unknown",
             "show": "Show",

core/test/results/sample_v2.json

@@ -9286,6 +9286,8 @@
       "opportunitySavingsColumnLabel": "Estimated Savings",
       "passedAuditsGroupTitle": "Passed audits",
       "runtimeAnalysisWindow": "Initial page load",
+      "runtimeAnalysisWindowSnapshot": "Point-in-time snapshot",
+      "runtimeAnalysisWindowTimespan": "User interactions timespan",
       "runtimeCustom": "Custom throttling",
       "runtimeDesktopEmulation": "Emulated Desktop",
       "runtimeMobileEmulation": "Emulated Moto G Power",
@@ -9297,8 +9299,8 @@
       "runtimeSettingsNetworkThrottling": "Network throttling",
       "runtimeSettingsScreenEmulation": "Screen emulation",
       "runtimeSettingsUANetwork": "User agent (network)",
-      "runtimeSingleLoad": "Single page load",
-      "runtimeSingleLoadTooltip": "This data is taken from a single page load, as opposed to field data summarizing many sessions.",
+      "runtimeSingleLoad": "Single page session",
+      "runtimeSingleLoadTooltip": "This data is taken from a single page session, as opposed to field data summarizing many sessions.",
       "runtimeSlow4g": "Slow 4G throttling",
       "runtimeUnknown": "Unknown",
       "show": "Show",

proto/lighthouse-result.proto

@@ -663,6 +663,11 @@ message I18n {
     // This label is for a button that will show the user a trace of the page.
     string dropdown_view_unthrottled_trace = 64;
 
+    // Descriptive label that this analysis considers some arbitrary period of time containing user interactions
+    string runtime_analysis_window_timespan = 65;
+
+    // Descriptive label that this analysis considers a snapshot of the page at a single point in time
+    string runtime_analysis_window_snapshot = 66;
   }
 
   // The message holding all formatted strings used in the renderer.

report/renderer/report-renderer.js

@@ -128,6 +128,13 @@ export class ReportRenderer {
       devicesTooltipTextLines.push(`${Globals.strings.runtimeSettingsAxeVersion}: ${axeVersion}`);
     }
 
+    let stopwatchLabel = Globals.strings.runtimeAnalysisWindow;
+    if (report.gatherMode === 'timespan') {
+      stopwatchLabel = Globals.strings.runtimeAnalysisWindowTimespan;
+    } else if (report.gatherMode === 'snapshot') {
+      stopwatchLabel = Globals.strings.runtimeAnalysisWindowSnapshot;
+    }
+
     // [CSS icon class, textContent, tooltipText]
     const metaItems = [
       ['date',
@@ -139,7 +146,7 @@ export class ReportRenderer {
         Globals.strings.runtimeSingleLoad,
         Globals.strings.runtimeSingleLoadTooltip],
       ['stopwatch',
-        Globals.strings.runtimeAnalysisWindow],
+        stopwatchLabel],
       ['networkspeed',
         `${envValues.summary}`,
         `${Globals.strings.runtimeSettingsNetworkThrottling}: ${envValues.networkThrottling}`],

report/renderer/report-utils.js

@@ -444,12 +444,16 @@ const UIStrings = {
   runtimeDesktopEmulation: 'Emulated Desktop',
   /** Descriptive explanation for a runtime setting that is set to an unknown value. */
   runtimeUnknown: 'Unknown',
-  /** Descriptive label that this analysis run was from a single pageload of a browser (not a summary of hundreds of loads) */
-  runtimeSingleLoad: 'Single page load',
+  /** Descriptive label that this analysis run was from a single sample of a page session (not a summary of hundreds of loads) */
+  runtimeSingleLoad: 'Single page session',
   /** Descriptive label that this analysis only considers the initial load of the page, and no interaction beyond when the page had "fully loaded" */
   runtimeAnalysisWindow: 'Initial page load',
-  /** Descriptive explanation that this analysis run was from a single pageload of a browser, whereas field data often summarizes hundreds+ of page loads */
-  runtimeSingleLoadTooltip: 'This data is taken from a single page load, as opposed to field data summarizing many sessions.', // eslint-disable-line max-len
+  /** Descriptive label that this analysis considers some arbitrary period of time containing user interactions */
+  runtimeAnalysisWindowTimespan: 'User interactions timespan',
+  /** Descriptive label that this analysis considers a snapshot of the page at a single point in time */
+  runtimeAnalysisWindowSnapshot: 'Point-in-time snapshot',
+  /** Descriptive explanation that this analysis run was from a single sample of a page session, whereas field data often summarizes hundreds+ of page loads */
+  runtimeSingleLoadTooltip: 'This data is taken from a single page session, as opposed to field data summarizing many sessions.', // eslint-disable-line max-len
 
   /** Descriptive explanation for environment throttling that was provided by the runtime environment instead of provided by Lighthouse throttling. */
   throttlingProvided: 'Provided by environment',

report/test/renderer/report-renderer-test.js

@@ -41,6 +41,9 @@ describe('ReportRenderer', () => {
     const detailsRenderer = new DetailsRenderer(dom);
     const categoryRenderer = new CategoryRenderer(dom, detailsRenderer);
     renderer = new ReportRenderer(dom, categoryRenderer);
+  });
+
+  beforeEach(() => {
     sampleResults = ReportUtils.prepareReportResult(sampleResultsOrig);
   });
 
@@ -223,6 +226,47 @@ describe('ReportRenderer', () => {
       expect(itemsTxt).toMatch(/\dx/);
       expect(itemsTxt).toContain(sampleResults.environment.networkUserAgent);
       expect(itemsTxt).toMatch('412x823, DPR 1.75');
+      expect(itemsTxt).toContain('Initial page load');
+    });
+
+    it('renders a timespan footer', () => {
+      sampleResults.gatherMode = 'timespan';
+      const footer = renderer._renderReportFooter(sampleResults);
+      const footerContent = footer.querySelector('.lh-footer').textContent;
+      assert.ok(/Generated by Lighthouse \d/.test(footerContent), 'includes lh version');
+      assert.ok(footerContent.match(TIMESTAMP_REGEX), 'includes timestamp');
+
+      // Check env items were populated.
+      const items = Array.from(footer.querySelectorAll('.lh-meta__item'));
+      expect(items.length).toBeGreaterThanOrEqual(6);
+
+      const itemsTxt = items.map(el => `${el.textContent} ${el.title}`).join('\n');
+      expect(itemsTxt).toContain('Moto G Power');
+      expect(itemsTxt).toContain('RTT');
+      expect(itemsTxt).toMatch(/\dx/);
+      expect(itemsTxt).toContain(sampleResults.environment.networkUserAgent);
+      expect(itemsTxt).toMatch('412x823, DPR 1.75');
+      expect(itemsTxt).toContain('User interactions timespan');
+    });
+
+    it('renders a snapshot footer', () => {
+      sampleResults.gatherMode = 'snapshot';
+      const footer = renderer._renderReportFooter(sampleResults);
+      const footerContent = footer.querySelector('.lh-footer').textContent;
+      assert.ok(/Generated by Lighthouse \d/.test(footerContent), 'includes lh version');
+      assert.ok(footerContent.match(TIMESTAMP_REGEX), 'includes timestamp');
+
+      // Check env items were populated.
+      const items = Array.from(footer.querySelectorAll('.lh-meta__item'));
+      expect(items.length).toBeGreaterThanOrEqual(6);
+
+      const itemsTxt = items.map(el => `${el.textContent} ${el.title}`).join('\n');
+      expect(itemsTxt).toContain('Moto G Power');
+      expect(itemsTxt).toContain('RTT');
+      expect(itemsTxt).toMatch(/\dx/);
+      expect(itemsTxt).toContain(sampleResults.environment.networkUserAgent);
+      expect(itemsTxt).toMatch('412x823, DPR 1.75');
+      expect(itemsTxt).toContain('Point-in-time snapshot');
     });
   });