Show FCP as a vital and aggregate and send to Graphite/Influx (#3324)

lib/plugins/browsertime/aggregator.js

@@ -23,6 +23,15 @@ module.exports = {
       );
     }
 
+    if (browsertimeRunData.googleWebVitals) {
+      statsHelpers.pushGroupStats(
+        this.statsPerType,
+        this.groups[group],
+        ['googleWebVitals'],
+        browsertimeRunData.googleWebVitals
+      );
+    }
+
     if (browsertimeRunData.timings.largestContentfulPaint) {
       statsHelpers.pushGroupStats(
         this.statsPerType,

lib/plugins/browsertime/default/metricsPageSummary.js

@@ -33,6 +33,7 @@ module.exports = [
   'statistics.pageinfo.cumulativeLayoutShift',
   'statistics.pageinfo.domElements',
   'statistics.extras.*',
+  'statistics.googleWebVitals.*',
   'statistics.android.batteryTemperature.*',
   'markedAsFailure'
 ];

lib/plugins/html/templates/url/metrics/index.pug

@@ -132,6 +132,12 @@ if browsertime
         table
           tr
             th(colspan='2') Google Web Vitals
+          if (timings.paintTiming && timings.paintTiming['first-contentful-paint'])
+            tr
+              td
+                a(href=baseHelpURL + 'firstContentfulPaint') First Contentful Paint (LCP)
+              td.number #{h.time.ms(timings.paintTiming['first-contentful-paint'])}
+
           if (timings.largestContentfulPaint) 
             tr
               td