diff --git a/lib/webVitals.js b/lib/webVitals.js index c15ac0093..5567eef28 100644 --- a/lib/webVitals.js +++ b/lib/webVitals.js @@ -1,7 +1,7 @@ // @flow // $FlowFixMe Flow doesn't find the file. Let's ignore this for now. -import {onCLS} from 'web-vitals'; +import {onLCP} from 'web-vitals'; import type {PageLoadBeacon} from './types'; import {pageLoadStartTimestamp} from './timings'; import {reportCustomEvent} from './customEvents'; @@ -9,8 +9,6 @@ import vars from './vars'; interface Metric { name: 'CLS' | 'FID' | 'LCP'; - // name: 'CLS'; - value: number; id?: string; } @@ -32,26 +30,26 @@ function reportExtraMetrics(metric: Metric) { } export function addWebVitals(beacon: PageLoadBeacon) { - // if (onLCP) { - // onLCP(onMetric, true); - // } + if (onLCP) { + onLCP(onMetric, true); + } // if (onFID) { // onFID(onMetric, true); // } // if (onINP) { // onINP(onMetric, true); // } - if (onCLS) { - onCLS(onMetricWithoutRounding, true); - } - - // function onMetric(metric: Metric) { - // beacon['t_' + metric.name.toLocaleLowerCase()] = Math.round(metric.value); - // reportExtraMetrics(metric); + // if (onCLS) { + // onCLS(onMetricWithoutRounding, true); // } - function onMetricWithoutRounding(metric: Metric) { - beacon['t_' + metric.name.toLocaleLowerCase()] = metric.value; + function onMetric(metric: Metric) { + beacon['t_' + metric.name.toLocaleLowerCase()] = Math.round(metric.value); reportExtraMetrics(metric); } + + // function onMetricWithoutRounding(metric: Metric) { + // beacon['t_' + metric.name.toLocaleLowerCase()] = metric.value; + // reportExtraMetrics(metric); + // } } diff --git a/protractor.saucelabs.config.js b/protractor.saucelabs.config.js index 9b127c555..890343546 100644 --- a/protractor.saucelabs.config.js +++ b/protractor.saucelabs.config.js @@ -34,7 +34,7 @@ function newSaucelabsCapability(browserName, version, platform) { browserName, version, platform, - name: 'Testing for only CLS values', + name: 'Testing for only LCP values', 'tunnel-identifier': 'github-action-tunnel', build: process.env.GITHUB_RUN_NUMBER }; diff --git a/test/e2e/12_webvitalsAsCustomEvent/webvitalsAsCustomEvent.spec.js b/test/e2e/12_webvitalsAsCustomEvent/webvitalsAsCustomEvent.spec.js index 127fd3dd2..7fed8c2ce 100644 --- a/test/e2e/12_webvitalsAsCustomEvent/webvitalsAsCustomEvent.spec.js +++ b/test/e2e/12_webvitalsAsCustomEvent/webvitalsAsCustomEvent.spec.js @@ -38,11 +38,20 @@ describe('12_webvitalsAsCustomEvent', () => { cexpect(beacon.ty).to.equal('pl'); }); + expectOneMatching(beacons, beacon => { + cexpect(beacon.ty).to.equal('cus'); + cexpect(beacon.ts).to.be.a('string'); + cexpect(parseFloat(beacon.d)).to.be.above(3000); + cexpect(beacon.n).to.equal('instana-webvitals-LCP'); + cexpect(beacon.l).to.be.a('string'); + cexpect(beacon.pl).to.equal(pageLoadBeacon.t); + cexpect(beacon.m_id).to.match(/^v\d+(-\d+)+$/); + }); + // expectOneMatching(beacons, beacon => { // cexpect(beacon.ty).to.equal('cus'); // cexpect(beacon.ts).to.be.a('string'); - // cexpect(parseFloat(beacon.d)).to.be.above(3000); - // cexpect(beacon.n).to.equal('instana-webvitals-LCP'); + // cexpect(beacon.n).to.equal('instana-webvitals-FID'); // cexpect(beacon.l).to.be.a('string'); // cexpect(beacon.pl).to.equal(pageLoadBeacon.t); // cexpect(beacon.m_id).to.match(/^v\d+(-\d+)+$/); @@ -51,21 +60,12 @@ describe('12_webvitalsAsCustomEvent', () => { // expectOneMatching(beacons, beacon => { // cexpect(beacon.ty).to.equal('cus'); // cexpect(beacon.ts).to.be.a('string'); - // cexpect(beacon.n).to.equal('instana-webvitals-FID'); + // cexpect(beacon.n).to.equal('instana-webvitals-CLS'); // cexpect(beacon.l).to.be.a('string'); // cexpect(beacon.pl).to.equal(pageLoadBeacon.t); // cexpect(beacon.m_id).to.match(/^v\d+(-\d+)+$/); // }); - expectOneMatching(beacons, beacon => { - cexpect(beacon.ty).to.equal('cus'); - cexpect(beacon.ts).to.be.a('string'); - cexpect(beacon.n).to.equal('instana-webvitals-CLS'); - cexpect(beacon.l).to.be.a('string'); - cexpect(beacon.pl).to.equal(pageLoadBeacon.t); - cexpect(beacon.m_id).to.match(/^v\d+(-\d+)+$/); - }); - // expectOneMatching(beacons, beacon => { // cexpect(beacon.ty).to.equal('cus'); // cexpect(beacon.ts).to.be.a('string');