@datadog/browser-rum-core - npm Package Compare versions

Comparing version 4.45.0 to 4.46.0

cjs/boot/rumPublicApi.d.ts

@@ -1,2 +0,2 @@
-import type { Context, InitConfiguration, User } from '@datadog/browser-core';
+import type { Context, InitConfiguration, RelativeTime, User, Observable } from '@datadog/browser-core';
 import type { LifeCycle } from '../domain/lifeCycle';
@@ -18,2 +18,4 @@ import type { ViewContexts } from '../domain/contexts/viewContexts';
     getSessionReplayLink: (configuration: RumConfiguration, sessionManager: RumSessionManager, viewContexts: ViewContexts) => string | undefined;
+    getSerializedNodeId: (node: Node) => number | undefined;
+    recorderStartObservable: Observable<RelativeTime>;
 }
@@ -20,0 +22,0 @@ interface RumPublicApiOptions {

cjs/boot/startRum.js

@@ -27,2 +27,3 @@ "use strict";
 var commonContext_1 = require("../domain/contexts/commonContext");
+var startWebVitalTelemetryDebug_1 = require("../domain/rumEventsCollection/view/startWebVitalTelemetryDebug");
 function startRum(initConfiguration, configuration, recorderApi, globalContextManager, userContextManager, initialViewOptions) {
@@ -72,3 +73,4 @@ var lifeCycle = new lifeCycle_1.LifeCycle();
     (0, resourceCollection_1.startResourceCollection)(lifeCycle, configuration, session, pageStateHistory);
-    var _b = (0, viewCollection_1.startViewCollection)(lifeCycle, configuration, location, domMutationObservable, locationChangeObservable, featureFlagContexts, pageStateHistory, recorderApi, initialViewOptions), addTiming = _b.addTiming, startView = _b.startView;
+    var webVitalTelemetryDebug = (0, startWebVitalTelemetryDebug_1.startWebVitalTelemetryDebug)(configuration, telemetry, recorderApi, session);
+    var _b = (0, viewCollection_1.startViewCollection)(lifeCycle, configuration, location, domMutationObservable, locationChangeObservable, featureFlagContexts, pageStateHistory, recorderApi, webVitalTelemetryDebug, initialViewOptions), addTiming = _b.addTiming, startView = _b.startView;
     var addError = (0, errorCollection_1.startErrorCollection)(lifeCycle, pageStateHistory, featureFlagContexts).addError;
@@ -75,0 +77,0 @@ (0, requestCollection_1.startRequestCollection)(lifeCycle, configuration, session);

cjs/browser/performanceCollection.d.ts

@@ -48,2 +48,3 @@ import type { Duration, RelativeTime } from '@datadog/browser-core';
     size: number;
+    element?: Element;
 }
@@ -54,2 +55,3 @@ export interface RumFirstInputTiming {
     processingStart: RelativeTime;
+    target?: Node;
 }
@@ -61,2 +63,5 @@ export interface RumLayoutShiftTiming {
     hadRecentInput: boolean;
+    sources?: Array<{
+        node?: Node;
+    }>;
 }
@@ -63,0 +68,0 @@ export type RumPerformanceEntry = RumPerformanceResourceTiming | RumPerformanceLongTaskTiming | RumPerformancePaintTiming | RumPerformanceNavigationTiming | RumLargestContentfulPaintTiming | RumFirstInputTiming | RumLayoutShiftTiming;

cjs/domain/assembly.js

@@ -60,3 +60,3 @@ "use strict";
                     },
-                    browser_sdk_version: (0, browser_core_1.canUseEventBridge)() ? "4.45.0" : undefined,
+                    browser_sdk_version: (0, browser_core_1.canUseEventBridge)() ? "4.46.0" : undefined,
                 },
@@ -63,0 +63,0 @@ application: {

cjs/domain/rumEventsCollection/view/trackInitialViewTimings.d.ts

 import type { Duration, RelativeTime } from '@datadog/browser-core';
 import type { LifeCycle } from '../../lifeCycle';
+import type { WebVitalTelemetryDebug } from './startWebVitalTelemetryDebug';
 export declare const TIMING_MAXIMUM_DELAY: number;
@@ -22,3 +23,3 @@ /**
 }
-export declare function trackInitialViewTimings(lifeCycle: LifeCycle, setLoadEvent: (loadEnd: Duration) => void, scheduleViewUpdate: () => void): {
+export declare function trackInitialViewTimings(lifeCycle: LifeCycle, webVitalTelemetryDebug: WebVitalTelemetryDebug, setLoadEvent: (loadEnd: Duration) => void, scheduleViewUpdate: () => void): {
     stop: () => void;
@@ -47,3 +48,3 @@ timings: Timings;
  */
-export declare function trackLargestContentfulPaintTiming(lifeCycle: LifeCycle, eventTarget: Window, callback: (lcpTiming: RelativeTime) => void): {
+export declare function trackLargestContentfulPaintTiming(lifeCycle: LifeCycle, eventTarget: Window, callback: (lcpTiming: RelativeTime, lcpElement?: Element) => void): {
     stop: () => void;
@@ -59,5 +60,6 @@ };
  */
-export declare function trackFirstInputTimings(lifeCycle: LifeCycle, callback: ({ firstInputDelay, firstInputTime }: {
+export declare function trackFirstInputTimings(lifeCycle: LifeCycle, callback: ({ firstInputDelay, firstInputTime, firstInputTarget, }: {
     firstInputDelay: Duration;
-    firstInputTime: Duration;
+    firstInputTime: RelativeTime;
+    firstInputTarget: Node | undefined;
 }) => void): {
@@ -64,0 +66,0 @@ stop: () => void;

cjs/domain/rumEventsCollection/view/trackInitialViewTimings.js

@@ -16,3 +16,3 @@ "use strict";
 exports.KEEP_TRACKING_TIMINGS_AFTER_VIEW_DELAY = 5 * browser_core_1.ONE_MINUTE;
-function trackInitialViewTimings(lifeCycle, setLoadEvent, scheduleViewUpdate) {
+function trackInitialViewTimings(lifeCycle, webVitalTelemetryDebug, setLoadEvent, scheduleViewUpdate) {
     var timings = {};
@@ -30,3 +30,4 @@ function setTimings(newTimings) {
     }).stop;
-    var stopLCPTracking = trackLargestContentfulPaintTiming(lifeCycle, window, function (largestContentfulPaint) {
+    var stopLCPTracking = trackLargestContentfulPaintTiming(lifeCycle, window, function (largestContentfulPaint, lcpElement) {
+        webVitalTelemetryDebug.addWebVitalTelemetryDebug('LCP', lcpElement, largestContentfulPaint);
         setTimings({
@@ -37,3 +38,4 @@ largestContentfulPaint: largestContentfulPaint,
     var stopFIDTracking = trackFirstInputTimings(lifeCycle, function (_a) {
-        var firstInputDelay = _a.firstInputDelay, firstInputTime = _a.firstInputTime;
+        var firstInputDelay = _a.firstInputDelay, firstInputTime = _a.firstInputTime, firstInputTarget = _a.firstInputTarget;
+        webVitalTelemetryDebug.addWebVitalTelemetryDebug('FID', firstInputTarget, firstInputTime);
         setTimings({
@@ -120,3 +122,3 @@ firstInputDelay: firstInputDelay,
         if (lcpEntry) {
-            callback(lcpEntry.startTime);
+            callback(lcpEntry.startTime, lcpEntry.element);
         }
@@ -153,2 +155,3 @@ }).unsubscribe;
                 firstInputTime: firstInputEntry.startTime,
+                firstInputTarget: firstInputEntry.target,
             });
@@ -155,0 +158,0 @@ }

cjs/domain/rumEventsCollection/view/trackViewMetrics.d.ts

@@ -6,2 +6,3 @@ import type { ClocksState, Duration, Observable } from '@datadog/browser-core';
 import type { LifeCycle } from '../../lifeCycle';
+import type { WebVitalTelemetryDebug } from './startWebVitalTelemetryDebug';
 export interface ScrollMetrics {
@@ -19,3 +20,3 @@ maxDepth: number;
 }
-export declare function trackViewMetrics(lifeCycle: LifeCycle, domMutationObservable: Observable<void>, configuration: RumConfiguration, scheduleViewUpdate: () => void, loadingType: ViewLoadingType, viewStart: ClocksState): {
+export declare function trackViewMetrics(lifeCycle: LifeCycle, domMutationObservable: Observable<void>, configuration: RumConfiguration, scheduleViewUpdate: () => void, loadingType: ViewLoadingType, viewStart: ClocksState, webVitalTelemetryDebug: WebVitalTelemetryDebug): {
     stop: () => void;
@@ -22,0 +23,0 @@ setLoadEvent: (loadEvent: Duration) => void;

cjs/domain/rumEventsCollection/view/trackViewMetrics.js

@@ -11,3 +11,3 @@ "use strict";
 exports.THROTTLE_SCROLL_DURATION = browser_core_1.ONE_SECOND;
-function trackViewMetrics(lifeCycle, domMutationObservable, configuration, scheduleViewUpdate, loadingType, viewStart) {
+function trackViewMetrics(lifeCycle, domMutationObservable, configuration, scheduleViewUpdate, loadingType, viewStart, webVitalTelemetryDebug) {
     var viewMetrics = {};
@@ -34,6 +34,11 @@ var scrollMetrics;
     var stopCLSTracking;
+    var clsAttributionCollected = false;
     if (isLayoutShiftSupported()) {
         viewMetrics.cumulativeLayoutShift = 0;
-        (stopCLSTracking = trackCumulativeLayoutShift(lifeCycle, function (cumulativeLayoutShift) {
+        (stopCLSTracking = trackCumulativeLayoutShift(lifeCycle, function (cumulativeLayoutShift, largestLayoutShiftNode, largestLayoutShiftTime) {
             viewMetrics.cumulativeLayoutShift = cumulativeLayoutShift;
+            if (!clsAttributionCollected) {
+                clsAttributionCollected = true;
+                webVitalTelemetryDebug.addWebVitalTelemetryDebug('CLS', largestLayoutShiftNode, largestLayoutShiftTime);
+            }
             scheduleViewUpdate();
@@ -153,3 +158,3 @@ }).stop);
                     maxClsValue = window.value();
-                    callback((0, browser_core_1.round)(maxClsValue, 4));
+                    callback((0, browser_core_1.round)(maxClsValue, 4), window.largestLayoutShiftNode(), window.largestLayoutShiftTime());
                 }
@@ -167,4 +172,8 @@ }
     var endTime;
+    var largestLayoutShift = 0;
+    var largestLayoutShiftNode;
+    var largestLayoutShiftTime;
     return {
         update: function (entry) {
+            var _a;
             var shouldCreateNewWindow = startTime === undefined ||
@@ -176,2 +185,4 @@ entry.startTime - endTime >= browser_core_1.ONE_SECOND ||
                 value = entry.value;
+                largestLayoutShift = 0;
+                largestLayoutShiftNode = undefined;
             }
@@ -182,4 +193,17 @@ else {
             }
+            if (entry.value > largestLayoutShift) {
+                largestLayoutShift = entry.value;
+                largestLayoutShiftTime = entry.startTime;
+                if ((_a = entry.sources) === null || _a === void 0 ? void 0 : _a.length) {
+                    var largestLayoutShiftSource = (0, browser_core_1.find)(entry.sources, function (s) { var _a; return ((_a = s.node) === null || _a === void 0 ? void 0 : _a.nodeType) === 1; }) || entry.sources[0];
+                    largestLayoutShiftNode = largestLayoutShiftSource.node;
+                }
+                else {
+                    largestLayoutShiftNode = undefined;
+                }
+            }
         },
         value: function () { return value; },
+        largestLayoutShiftNode: function () { return largestLayoutShiftNode; },
+        largestLayoutShiftTime: function () { return largestLayoutShiftTime; },
     };
@@ -186,0 +210,0 @@ }

cjs/domain/rumEventsCollection/view/trackViews.d.ts

@@ -10,2 +10,3 @@ import type { Duration, ClocksState, TimeStamp, Observable, RelativeTime } from '@datadog/browser-core';
 import type { ScrollMetrics } from './trackViewMetrics';
+import type { WebVitalTelemetryDebug } from './startWebVitalTelemetryDebug';
 export interface ViewEvent {
@@ -47,3 +48,3 @@ id: string;
 }
-export declare function trackViews(location: Location, lifeCycle: LifeCycle, domMutationObservable: Observable<void>, configuration: RumConfiguration, locationChangeObservable: Observable<LocationChange>, areViewsTrackedAutomatically: boolean, initialViewOptions?: ViewOptions): {
+export declare function trackViews(location: Location, lifeCycle: LifeCycle, domMutationObservable: Observable<void>, configuration: RumConfiguration, locationChangeObservable: Observable<LocationChange>, areViewsTrackedAutomatically: boolean, webVitalTelemetryDebug: WebVitalTelemetryDebug, initialViewOptions?: ViewOptions): {
     addTiming: (name: string, time?: RelativeTime | TimeStamp) => void;
@@ -50,0 +51,0 @@ startView: (options?: ViewOptions, startClocks?: ClocksState) => void;

cjs/domain/rumEventsCollection/view/trackViews.js

@@ -10,3 +10,3 @@ "use strict";
 exports.SESSION_KEEP_ALIVE_INTERVAL = 5 * browser_core_1.ONE_MINUTE;
-function trackViews(location, lifeCycle, domMutationObservable, configuration, locationChangeObservable, areViewsTrackedAutomatically, initialViewOptions) {
+function trackViews(location, lifeCycle, domMutationObservable, configuration, locationChangeObservable, areViewsTrackedAutomatically, webVitalTelemetryDebug, initialViewOptions) {
     var currentView = startNewView("initial_load" /* ViewLoadingType.INITIAL_LOAD */, (0, browser_core_1.clocksOrigin)(), initialViewOptions);
@@ -19,3 +19,3 @@ startViewLifeCycle();
     function startNewView(loadingType, startClocks, viewOptions) {
-        return newView(lifeCycle, domMutationObservable, configuration, location, loadingType, startClocks, viewOptions);
+        return newView(lifeCycle, domMutationObservable, configuration, location, loadingType, webVitalTelemetryDebug, startClocks, viewOptions);
     }
@@ -66,3 +66,3 @@ function startViewLifeCycle() {
 exports.trackViews = trackViews;
-function newView(lifeCycle, domMutationObservable, configuration, initialLocation, loadingType, startClocks, viewOptions) {
+function newView(lifeCycle, domMutationObservable, configuration, initialLocation, loadingType, webVitalTelemetryDebug, startClocks, viewOptions) {
     if (startClocks === void 0) { startClocks = (0, browser_core_1.clocksNow)(); }
@@ -95,5 +95,5 @@ // Setup initial values
     }), scheduleViewUpdate = _a.throttled, cancelScheduleViewUpdate = _a.cancel;
-    var _b = (0, trackViewMetrics_1.trackViewMetrics)(lifeCycle, domMutationObservable, configuration, scheduleViewUpdate, loadingType, startClocks), setLoadEvent = _b.setLoadEvent, stopViewMetricsTracking = _b.stop, viewMetrics = _b.viewMetrics, getScrollMetrics = _b.getScrollMetrics;
+    var _b = (0, trackViewMetrics_1.trackViewMetrics)(lifeCycle, domMutationObservable, configuration, scheduleViewUpdate, loadingType, startClocks, webVitalTelemetryDebug), setLoadEvent = _b.setLoadEvent, stopViewMetricsTracking = _b.stop, viewMetrics = _b.viewMetrics, getScrollMetrics = _b.getScrollMetrics;
     var _c = loadingType === "initial_load" /* ViewLoadingType.INITIAL_LOAD */
-        ? (0, trackInitialViewTimings_1.trackInitialViewTimings)(lifeCycle, setLoadEvent, scheduleViewUpdate)
+        ? (0, trackInitialViewTimings_1.trackInitialViewTimings)(lifeCycle, webVitalTelemetryDebug, setLoadEvent, scheduleViewUpdate)
         : { scheduleStop: browser_core_1.noop, timings: {} }, scheduleStopInitialViewTimingsTracking = _c.scheduleStop, timings = _c.timings;
@@ -100,0 +100,0 @@ var _d = (0, trackViewEventCounts_1.trackViewEventCounts)(lifeCycle, id, scheduleViewUpdate), scheduleStopEventCountsTracking = _d.scheduleStop, eventCounts = _d.eventCounts;

cjs/domain/rumEventsCollection/view/viewCollection.d.ts

@@ -9,3 +9,4 @@ import type { Observable } from '@datadog/browser-core';
 import type { ViewOptions } from './trackViews';
-export declare function startViewCollection(lifeCycle: LifeCycle, configuration: RumConfiguration, location: Location, domMutationObservable: Observable<void>, locationChangeObservable: Observable<LocationChange>, featureFlagContexts: FeatureFlagContexts, pageStateHistory: PageStateHistory, recorderApi: RecorderApi, initialViewOptions?: ViewOptions): {
+import type { WebVitalTelemetryDebug } from './startWebVitalTelemetryDebug';
+export declare function startViewCollection(lifeCycle: LifeCycle, configuration: RumConfiguration, location: Location, domMutationObservable: Observable<void>, locationChangeObservable: Observable<LocationChange>, featureFlagContexts: FeatureFlagContexts, pageStateHistory: PageStateHistory, recorderApi: RecorderApi, webVitalTelemetryDebug: WebVitalTelemetryDebug, initialViewOptions?: ViewOptions): {
     addTiming: (name: string, time?: import("@datadog/browser-core").TimeStamp | import("@datadog/browser-core").RelativeTime) => void;
@@ -12,0 +13,0 @@ startView: (options?: ViewOptions | undefined, startClocks?: import("@datadog/browser-core").ClocksState | undefined) => void;

cjs/domain/rumEventsCollection/view/viewCollection.js

@@ -7,7 +7,7 @@ "use strict";
 var trackViews_1 = require("./trackViews");
-function startViewCollection(lifeCycle, configuration, location, domMutationObservable, locationChangeObservable, featureFlagContexts, pageStateHistory, recorderApi, initialViewOptions) {
+function startViewCollection(lifeCycle, configuration, location, domMutationObservable, locationChangeObservable, featureFlagContexts, pageStateHistory, recorderApi, webVitalTelemetryDebug, initialViewOptions) {
     lifeCycle.subscribe(3 /* LifeCycleEventType.VIEW_UPDATED */, function (view) {
         return lifeCycle.notify(10 /* LifeCycleEventType.RAW_RUM_EVENT_COLLECTED */, processViewUpdate(view, configuration, featureFlagContexts, recorderApi, pageStateHistory));
     });
-    var trackViewResult = (0, trackViews_1.trackViews)(location, lifeCycle, domMutationObservable, configuration, locationChangeObservable, !configuration.trackViewsManually, initialViewOptions);
+    var trackViewResult = (0, trackViews_1.trackViews)(location, lifeCycle, domMutationObservable, configuration, locationChangeObservable, !configuration.trackViewsManually, webVitalTelemetryDebug, initialViewOptions);
     return trackViewResult;
@@ -14,0 +14,0 @@ }

esm/boot/rumPublicApi.d.ts

@@ -1,2 +0,2 @@
-import type { Context, InitConfiguration, User } from '@datadog/browser-core';
+import type { Context, InitConfiguration, RelativeTime, User, Observable } from '@datadog/browser-core';
 import type { LifeCycle } from '../domain/lifeCycle';
@@ -18,2 +18,4 @@ import type { ViewContexts } from '../domain/contexts/viewContexts';
     getSessionReplayLink: (configuration: RumConfiguration, sessionManager: RumSessionManager, viewContexts: ViewContexts) => string | undefined;
+    getSerializedNodeId: (node: Node) => number | undefined;
+    recorderStartObservable: Observable<RelativeTime>;
 }
@@ -20,0 +22,0 @@ interface RumPublicApiOptions {

esm/boot/startRum.js

@@ -24,2 +24,3 @@ import { sendToExtension, createPageExitObservable, addTelemetryConfiguration, startTelemetry, canUseEventBridge, getEventBridge, addTelemetryDebug, } from '@datadog/browser-core';
 import { buildCommonContext } from '../domain/contexts/commonContext';
+import { startWebVitalTelemetryDebug } from '../domain/rumEventsCollection/view/startWebVitalTelemetryDebug';
 export function startRum(initConfiguration, configuration, recorderApi, globalContextManager, userContextManager, initialViewOptions) {
@@ -69,3 +70,4 @@ var lifeCycle = new LifeCycle();
     startResourceCollection(lifeCycle, configuration, session, pageStateHistory);
-    var _b = startViewCollection(lifeCycle, configuration, location, domMutationObservable, locationChangeObservable, featureFlagContexts, pageStateHistory, recorderApi, initialViewOptions), addTiming = _b.addTiming, startView = _b.startView;
+    var webVitalTelemetryDebug = startWebVitalTelemetryDebug(configuration, telemetry, recorderApi, session);
+    var _b = startViewCollection(lifeCycle, configuration, location, domMutationObservable, locationChangeObservable, featureFlagContexts, pageStateHistory, recorderApi, webVitalTelemetryDebug, initialViewOptions), addTiming = _b.addTiming, startView = _b.startView;
     var addError = startErrorCollection(lifeCycle, pageStateHistory, featureFlagContexts).addError;
@@ -72,0 +74,0 @@ startRequestCollection(lifeCycle, configuration, session);

esm/browser/performanceCollection.d.ts

@@ -48,2 +48,3 @@ import type { Duration, RelativeTime } from '@datadog/browser-core';
     size: number;
+    element?: Element;
 }
@@ -54,2 +55,3 @@ export interface RumFirstInputTiming {
     processingStart: RelativeTime;
+    target?: Node;
 }
@@ -61,2 +63,5 @@ export interface RumLayoutShiftTiming {
     hadRecentInput: boolean;
+    sources?: Array<{
+        node?: Node;
+    }>;
 }
@@ -63,0 +68,0 @@ export type RumPerformanceEntry = RumPerformanceResourceTiming | RumPerformanceLongTaskTiming | RumPerformancePaintTiming | RumPerformanceNavigationTiming | RumLargestContentfulPaintTiming | RumFirstInputTiming | RumLayoutShiftTiming;

esm/domain/assembly.js

@@ -57,3 +57,3 @@ import { combine, isEmptyObject, timeStampNow, currentDrift, display, createEventRateLimiter, canUseEventBridge, assign, round, } from '@datadog/browser-core';
                     },
-                    browser_sdk_version: canUseEventBridge() ? "4.45.0" : undefined,
+                    browser_sdk_version: canUseEventBridge() ? "4.46.0" : undefined,
                 },
@@ -60,0 +60,0 @@ application: {

esm/domain/rumEventsCollection/view/trackInitialViewTimings.d.ts

 import type { Duration, RelativeTime } from '@datadog/browser-core';
 import type { LifeCycle } from '../../lifeCycle';
+import type { WebVitalTelemetryDebug } from './startWebVitalTelemetryDebug';
 export declare const TIMING_MAXIMUM_DELAY: number;
@@ -22,3 +23,3 @@ /**
 }
-export declare function trackInitialViewTimings(lifeCycle: LifeCycle, setLoadEvent: (loadEnd: Duration) => void, scheduleViewUpdate: () => void): {
+export declare function trackInitialViewTimings(lifeCycle: LifeCycle, webVitalTelemetryDebug: WebVitalTelemetryDebug, setLoadEvent: (loadEnd: Duration) => void, scheduleViewUpdate: () => void): {
     stop: () => void;
@@ -47,3 +48,3 @@ timings: Timings;
  */
-export declare function trackLargestContentfulPaintTiming(lifeCycle: LifeCycle, eventTarget: Window, callback: (lcpTiming: RelativeTime) => void): {
+export declare function trackLargestContentfulPaintTiming(lifeCycle: LifeCycle, eventTarget: Window, callback: (lcpTiming: RelativeTime, lcpElement?: Element) => void): {
     stop: () => void;
@@ -59,5 +60,6 @@ };
  */
-export declare function trackFirstInputTimings(lifeCycle: LifeCycle, callback: ({ firstInputDelay, firstInputTime }: {
+export declare function trackFirstInputTimings(lifeCycle: LifeCycle, callback: ({ firstInputDelay, firstInputTime, firstInputTarget, }: {
     firstInputDelay: Duration;
-    firstInputTime: Duration;
+    firstInputTime: RelativeTime;
+    firstInputTarget: Node | undefined;
 }) => void): {
@@ -64,0 +66,0 @@ stop: () => void;

esm/domain/rumEventsCollection/view/trackInitialViewTimings.js

@@ -13,3 +13,3 @@ import { setTimeout, assign, addEventListeners, elapsed, ONE_MINUTE, find, findLast, relativeNow, } from '@datadog/browser-core';
 export var KEEP_TRACKING_TIMINGS_AFTER_VIEW_DELAY = 5 * ONE_MINUTE;
-export function trackInitialViewTimings(lifeCycle, setLoadEvent, scheduleViewUpdate) {
+export function trackInitialViewTimings(lifeCycle, webVitalTelemetryDebug, setLoadEvent, scheduleViewUpdate) {
     var timings = {};
@@ -27,3 +27,4 @@ function setTimings(newTimings) {
     }).stop;
-    var stopLCPTracking = trackLargestContentfulPaintTiming(lifeCycle, window, function (largestContentfulPaint) {
+    var stopLCPTracking = trackLargestContentfulPaintTiming(lifeCycle, window, function (largestContentfulPaint, lcpElement) {
+        webVitalTelemetryDebug.addWebVitalTelemetryDebug('LCP', lcpElement, largestContentfulPaint);
         setTimings({
@@ -34,3 +35,4 @@ largestContentfulPaint: largestContentfulPaint,
     var stopFIDTracking = trackFirstInputTimings(lifeCycle, function (_a) {
-        var firstInputDelay = _a.firstInputDelay, firstInputTime = _a.firstInputTime;
+        var firstInputDelay = _a.firstInputDelay, firstInputTime = _a.firstInputTime, firstInputTarget = _a.firstInputTarget;
+        webVitalTelemetryDebug.addWebVitalTelemetryDebug('FID', firstInputTarget, firstInputTime);
         setTimings({
@@ -114,3 +116,3 @@ firstInputDelay: firstInputDelay,
         if (lcpEntry) {
-            callback(lcpEntry.startTime);
+            callback(lcpEntry.startTime, lcpEntry.element);
         }
@@ -146,2 +148,3 @@ }).unsubscribe;
                 firstInputTime: firstInputEntry.startTime,
+                firstInputTarget: firstInputEntry.target,
             });
@@ -148,0 +151,0 @@ }

esm/domain/rumEventsCollection/view/trackViewMetrics.d.ts

@@ -6,2 +6,3 @@ import type { ClocksState, Duration, Observable } from '@datadog/browser-core';
 import type { LifeCycle } from '../../lifeCycle';
+import type { WebVitalTelemetryDebug } from './startWebVitalTelemetryDebug';
 export interface ScrollMetrics {
@@ -19,3 +20,3 @@ maxDepth: number;
 }
-export declare function trackViewMetrics(lifeCycle: LifeCycle, domMutationObservable: Observable<void>, configuration: RumConfiguration, scheduleViewUpdate: () => void, loadingType: ViewLoadingType, viewStart: ClocksState): {
+export declare function trackViewMetrics(lifeCycle: LifeCycle, domMutationObservable: Observable<void>, configuration: RumConfiguration, scheduleViewUpdate: () => void, loadingType: ViewLoadingType, viewStart: ClocksState, webVitalTelemetryDebug: WebVitalTelemetryDebug): {
     stop: () => void;
@@ -22,0 +23,0 @@ setLoadEvent: (loadEvent: Duration) => void;

esm/domain/rumEventsCollection/view/trackViewMetrics.js

@@ -1,2 +0,2 @@
-import { ExperimentalFeature, isExperimentalFeatureEnabled, ONE_SECOND, addEventListener, elapsed, noop, relativeNow, round, throttle, } from '@datadog/browser-core';
+import { ExperimentalFeature, isExperimentalFeatureEnabled, ONE_SECOND, addEventListener, elapsed, noop, relativeNow, round, throttle, find, } from '@datadog/browser-core';
 import { supportPerformanceTimingEvent } from '../../../browser/performanceCollection';
@@ -8,3 +8,3 @@ import { waitPageActivityEnd } from '../../waitPageActivityEnd';
 export var THROTTLE_SCROLL_DURATION = ONE_SECOND;
-export function trackViewMetrics(lifeCycle, domMutationObservable, configuration, scheduleViewUpdate, loadingType, viewStart) {
+export function trackViewMetrics(lifeCycle, domMutationObservable, configuration, scheduleViewUpdate, loadingType, viewStart, webVitalTelemetryDebug) {
     var viewMetrics = {};
@@ -31,6 +31,11 @@ var scrollMetrics;
     var stopCLSTracking;
+    var clsAttributionCollected = false;
     if (isLayoutShiftSupported()) {
         viewMetrics.cumulativeLayoutShift = 0;
-        (stopCLSTracking = trackCumulativeLayoutShift(lifeCycle, function (cumulativeLayoutShift) {
+        (stopCLSTracking = trackCumulativeLayoutShift(lifeCycle, function (cumulativeLayoutShift, largestLayoutShiftNode, largestLayoutShiftTime) {
             viewMetrics.cumulativeLayoutShift = cumulativeLayoutShift;
+            if (!clsAttributionCollected) {
+                clsAttributionCollected = true;
+                webVitalTelemetryDebug.addWebVitalTelemetryDebug('CLS', largestLayoutShiftNode, largestLayoutShiftTime);
+            }
             scheduleViewUpdate();
@@ -148,3 +153,3 @@ }).stop);
                     maxClsValue = window.value();
-                    callback(round(maxClsValue, 4));
+                    callback(round(maxClsValue, 4), window.largestLayoutShiftNode(), window.largestLayoutShiftTime());
                 }
@@ -162,4 +167,8 @@ }
     var endTime;
+    var largestLayoutShift = 0;
+    var largestLayoutShiftNode;
+    var largestLayoutShiftTime;
     return {
         update: function (entry) {
+            var _a;
             var shouldCreateNewWindow = startTime === undefined ||
@@ -171,2 +180,4 @@ entry.startTime - endTime >= ONE_SECOND ||
                 value = entry.value;
+                largestLayoutShift = 0;
+                largestLayoutShiftNode = undefined;
             }
@@ -177,4 +188,17 @@ else {
             }
+            if (entry.value > largestLayoutShift) {
+                largestLayoutShift = entry.value;
+                largestLayoutShiftTime = entry.startTime;
+                if ((_a = entry.sources) === null || _a === void 0 ? void 0 : _a.length) {
+                    var largestLayoutShiftSource = find(entry.sources, function (s) { var _a; return ((_a = s.node) === null || _a === void 0 ? void 0 : _a.nodeType) === 1; }) || entry.sources[0];
+                    largestLayoutShiftNode = largestLayoutShiftSource.node;
+                }
+                else {
+                    largestLayoutShiftNode = undefined;
+                }
+            }
         },
         value: function () { return value; },
+        largestLayoutShiftNode: function () { return largestLayoutShiftNode; },
+        largestLayoutShiftTime: function () { return largestLayoutShiftTime; },
     };
@@ -181,0 +205,0 @@ }

esm/domain/rumEventsCollection/view/trackViews.d.ts

@@ -10,2 +10,3 @@ import type { Duration, ClocksState, TimeStamp, Observable, RelativeTime } from '@datadog/browser-core';
 import type { ScrollMetrics } from './trackViewMetrics';
+import type { WebVitalTelemetryDebug } from './startWebVitalTelemetryDebug';
 export interface ViewEvent {
@@ -47,3 +48,3 @@ id: string;
 }
-export declare function trackViews(location: Location, lifeCycle: LifeCycle, domMutationObservable: Observable<void>, configuration: RumConfiguration, locationChangeObservable: Observable<LocationChange>, areViewsTrackedAutomatically: boolean, initialViewOptions?: ViewOptions): {
+export declare function trackViews(location: Location, lifeCycle: LifeCycle, domMutationObservable: Observable<void>, configuration: RumConfiguration, locationChangeObservable: Observable<LocationChange>, areViewsTrackedAutomatically: boolean, webVitalTelemetryDebug: WebVitalTelemetryDebug, initialViewOptions?: ViewOptions): {
     addTiming: (name: string, time?: RelativeTime | TimeStamp) => void;
@@ -50,0 +51,0 @@ startView: (options?: ViewOptions, startClocks?: ClocksState) => void;

esm/domain/rumEventsCollection/view/trackViews.js

@@ -7,3 +7,3 @@ import { noop, PageExitReason, shallowClone, assign, elapsed, generateUUID, ONE_MINUTE, throttle, clocksNow, clocksOrigin, timeStampNow, display, looksLikeRelativeTime, setInterval, clearInterval, } from '@datadog/browser-core';
 export var SESSION_KEEP_ALIVE_INTERVAL = 5 * ONE_MINUTE;
-export function trackViews(location, lifeCycle, domMutationObservable, configuration, locationChangeObservable, areViewsTrackedAutomatically, initialViewOptions) {
+export function trackViews(location, lifeCycle, domMutationObservable, configuration, locationChangeObservable, areViewsTrackedAutomatically, webVitalTelemetryDebug, initialViewOptions) {
     var currentView = startNewView("initial_load" /* ViewLoadingType.INITIAL_LOAD */, clocksOrigin(), initialViewOptions);
@@ -16,3 +16,3 @@ startViewLifeCycle();
     function startNewView(loadingType, startClocks, viewOptions) {
-        return newView(lifeCycle, domMutationObservable, configuration, location, loadingType, startClocks, viewOptions);
+        return newView(lifeCycle, domMutationObservable, configuration, location, loadingType, webVitalTelemetryDebug, startClocks, viewOptions);
     }
@@ -62,3 +62,3 @@ function startViewLifeCycle() {
 }
-function newView(lifeCycle, domMutationObservable, configuration, initialLocation, loadingType, startClocks, viewOptions) {
+function newView(lifeCycle, domMutationObservable, configuration, initialLocation, loadingType, webVitalTelemetryDebug, startClocks, viewOptions) {
     if (startClocks === void 0) { startClocks = clocksNow(); }
@@ -91,5 +91,5 @@ // Setup initial values
     }), scheduleViewUpdate = _a.throttled, cancelScheduleViewUpdate = _a.cancel;
-    var _b = trackViewMetrics(lifeCycle, domMutationObservable, configuration, scheduleViewUpdate, loadingType, startClocks), setLoadEvent = _b.setLoadEvent, stopViewMetricsTracking = _b.stop, viewMetrics = _b.viewMetrics, getScrollMetrics = _b.getScrollMetrics;
+    var _b = trackViewMetrics(lifeCycle, domMutationObservable, configuration, scheduleViewUpdate, loadingType, startClocks, webVitalTelemetryDebug), setLoadEvent = _b.setLoadEvent, stopViewMetricsTracking = _b.stop, viewMetrics = _b.viewMetrics, getScrollMetrics = _b.getScrollMetrics;
     var _c = loadingType === "initial_load" /* ViewLoadingType.INITIAL_LOAD */
-        ? trackInitialViewTimings(lifeCycle, setLoadEvent, scheduleViewUpdate)
+        ? trackInitialViewTimings(lifeCycle, webVitalTelemetryDebug, setLoadEvent, scheduleViewUpdate)
         : { scheduleStop: noop, timings: {} }, scheduleStopInitialViewTimingsTracking = _c.scheduleStop, timings = _c.timings;
@@ -96,0 +96,0 @@ var _d = trackViewEventCounts(lifeCycle, id, scheduleViewUpdate), scheduleStopEventCountsTracking = _d.scheduleStop, eventCounts = _d.eventCounts;

esm/domain/rumEventsCollection/view/viewCollection.d.ts

@@ -9,3 +9,4 @@ import type { Observable } from '@datadog/browser-core';
 import type { ViewOptions } from './trackViews';
-export declare function startViewCollection(lifeCycle: LifeCycle, configuration: RumConfiguration, location: Location, domMutationObservable: Observable<void>, locationChangeObservable: Observable<LocationChange>, featureFlagContexts: FeatureFlagContexts, pageStateHistory: PageStateHistory, recorderApi: RecorderApi, initialViewOptions?: ViewOptions): {
+import type { WebVitalTelemetryDebug } from './startWebVitalTelemetryDebug';
+export declare function startViewCollection(lifeCycle: LifeCycle, configuration: RumConfiguration, location: Location, domMutationObservable: Observable<void>, locationChangeObservable: Observable<LocationChange>, featureFlagContexts: FeatureFlagContexts, pageStateHistory: PageStateHistory, recorderApi: RecorderApi, webVitalTelemetryDebug: WebVitalTelemetryDebug, initialViewOptions?: ViewOptions): {
     addTiming: (name: string, time?: import("@datadog/browser-core").TimeStamp | import("@datadog/browser-core").RelativeTime) => void;
@@ -12,0 +13,0 @@ startView: (options?: ViewOptions | undefined, startClocks?: import("@datadog/browser-core").ClocksState | undefined) => void;

esm/domain/rumEventsCollection/view/viewCollection.js

 import { isExperimentalFeatureEnabled, ExperimentalFeature, isEmptyObject, mapValues, toServerDuration, isNumber, } from '@datadog/browser-core';
 import { mapToForegroundPeriods } from '../../contexts/foregroundContexts';
 import { trackViews } from './trackViews';
-export function startViewCollection(lifeCycle, configuration, location, domMutationObservable, locationChangeObservable, featureFlagContexts, pageStateHistory, recorderApi, initialViewOptions) {
+export function startViewCollection(lifeCycle, configuration, location, domMutationObservable, locationChangeObservable, featureFlagContexts, pageStateHistory, recorderApi, webVitalTelemetryDebug, initialViewOptions) {
     lifeCycle.subscribe(3 /* LifeCycleEventType.VIEW_UPDATED */, function (view) {
         return lifeCycle.notify(10 /* LifeCycleEventType.RAW_RUM_EVENT_COLLECTED */, processViewUpdate(view, configuration, featureFlagContexts, recorderApi, pageStateHistory));
     });
-    var trackViewResult = trackViews(location, lifeCycle, domMutationObservable, configuration, locationChangeObservable, !configuration.trackViewsManually, initialViewOptions);
+    var trackViewResult = trackViews(location, lifeCycle, domMutationObservable, configuration, locationChangeObservable, !configuration.trackViewsManually, webVitalTelemetryDebug, initialViewOptions);
     return trackViewResult;
@@ -10,0 +10,0 @@ }

package.json

 {
   "name": "@datadog/browser-rum-core",
-  "version": "4.45.0",
+  "version": "4.46.0",
   "license": "Apache-2.0",
@@ -15,3 +15,3 @@ "main": "cjs/index.js",
   "dependencies": {
-    "@datadog/browser-core": "4.45.0"
+    "@datadog/browser-core": "4.46.0"
   },
@@ -32,3 +32,3 @@ "devDependencies": {
   },
-  "gitHead": "4b06c56c78f438cb4d11e9075b107839196e60dd"
+  "gitHead": "fdd9a6034d8e1460cbb3dfdac188f102de10347f"
 }

src/boot/rumPublicApi.ts

@@ -1,2 +0,2 @@
-import type { Context, InitConfiguration, TimeStamp, RelativeTime, User } from '@datadog/browser-core'
+import type { Context, InitConfiguration, TimeStamp, RelativeTime, User, Observable } from '@datadog/browser-core'
 import {
@@ -55,2 +55,4 @@ noop,
   ) => string | undefined
+  getSerializedNodeId: (node: Node) => number | undefined
+  recorderStartObservable: Observable<RelativeTime>
 }
@@ -57,0 +59,0 @@ interface RumPublicApiOptions {

src/boot/startRum.ts

@@ -39,2 +39,3 @@ import type { Observable, TelemetryEvent, RawError, ContextManager } from '@datadog/browser-core'
 import { buildCommonContext } from '../domain/contexts/commonContext'
+import { startWebVitalTelemetryDebug } from '../domain/rumEventsCollection/view/startWebVitalTelemetryDebug'
 import type { RecorderApi } from './rumPublicApi'
@@ -122,2 +123,4 @@
   startResourceCollection(lifeCycle, configuration, session, pageStateHistory)
+
+  const webVitalTelemetryDebug = startWebVitalTelemetryDebug(configuration, telemetry, recorderApi, session)
   const { addTiming, startView } = startViewCollection(
@@ -132,2 +135,3 @@ lifeCycle,
     recorderApi,
+    webVitalTelemetryDebug,
     initialViewOptions
@@ -134,0 +138,0 @@ )

src/browser/performanceCollection.ts

@@ -71,2 +71,3 @@ import type { Duration, RelativeTime, TimeStamp } from '@datadog/browser-core'
   size: number
+  element?: Element
 }
@@ -78,2 +79,3 @@
   processingStart: RelativeTime
+  target?: Node
 }
@@ -86,2 +88,5 @@
   hadRecentInput: boolean
+  sources?: Array<{
+    node?: Node
+  }>
 }
@@ -88,0 +93,0 @@

src/domain/rumEventsCollection/view/trackInitialViewTimings.ts

@@ -22,2 +22,3 @@ import type { Duration, RelativeTime } from '@datadog/browser-core'
 import { trackFirstHidden } from './trackFirstHidden'
+import type { WebVitalTelemetryDebug } from './startWebVitalTelemetryDebug'
 
@@ -50,2 +51,3 @@ // Discard LCP and FCP timings above a certain delay to avoid incorrect data
   lifeCycle: LifeCycle,
+  webVitalTelemetryDebug: WebVitalTelemetryDebug,
   setLoadEvent: (loadEnd: Duration) => void,
@@ -68,14 +70,26 @@ scheduleViewUpdate: () => void
   )
-  const { stop: stopLCPTracking } = trackLargestContentfulPaintTiming(lifeCycle, window, (largestContentfulPaint) => {
-    setTimings({
-      largestContentfulPaint,
-    })
-  })
-  const { stop: stopFIDTracking } = trackFirstInputTimings(lifeCycle, ({ firstInputDelay, firstInputTime }) => {
-    setTimings({
-      firstInputDelay,
-      firstInputTime,
-    })
-  })
+  const { stop: stopLCPTracking } = trackLargestContentfulPaintTiming(
+    lifeCycle,
+    window,
+    (largestContentfulPaint, lcpElement) => {
+      webVitalTelemetryDebug.addWebVitalTelemetryDebug('LCP', lcpElement, largestContentfulPaint)
 
+      setTimings({
+        largestContentfulPaint,
+      })
+    }
+  )
+
+  const { stop: stopFIDTracking } = trackFirstInputTimings(
+    lifeCycle,
+    ({ firstInputDelay, firstInputTime, firstInputTarget }) => {
+      webVitalTelemetryDebug.addWebVitalTelemetryDebug('FID', firstInputTarget, firstInputTime)
+
+      setTimings({
+        firstInputDelay,
+        firstInputTime,
+      })
+    }
+  )
+
   function stop() {
@@ -154,3 +168,3 @@ stopNavigationTracking()
   eventTarget: Window,
-  callback: (lcpTiming: RelativeTime) => void
+  callback: (lcpTiming: RelativeTime, lcpElement?: Element) => void
 ) {
@@ -184,3 +198,3 @@ const firstHidden = trackFirstHidden()
       if (lcpEntry) {
-        callback(lcpEntry.startTime)
+        callback(lcpEntry.startTime, lcpEntry.element)
       }
@@ -208,3 +222,11 @@ }
   lifeCycle: LifeCycle,
-  callback: ({ firstInputDelay, firstInputTime }: { firstInputDelay: Duration; firstInputTime: Duration }) => void
+  callback: ({
+    firstInputDelay,
+    firstInputTime,
+    firstInputTarget,
+  }: {
+    firstInputDelay: Duration
+    firstInputTime: RelativeTime
+    firstInputTarget: Node | undefined
+  }) => void
 ) {
@@ -225,3 +247,4 @@ const firstHidden = trackFirstHidden()
         firstInputDelay: firstInputDelay >= 0 ? firstInputDelay : (0 as Duration),
-        firstInputTime: firstInputEntry.startTime as Duration,
+        firstInputTime: firstInputEntry.startTime,
+        firstInputTarget: firstInputEntry.target,
       })
@@ -228,0 +251,0 @@ }

src/domain/rumEventsCollection/view/trackViewMetrics.ts

@@ -13,2 +13,3 @@ import type { ClocksState, Duration, Observable, RelativeTime } from '@datadog/browser-core'
   throttle,
+  find,
 } from '@datadog/browser-core'
@@ -25,2 +26,3 @@ import type { RumLayoutShiftTiming } from '../../../browser/performanceCollection'
 import { getViewportDimension } from '../../../browser/viewportObservable'
+import type { WebVitalTelemetryDebug } from './startWebVitalTelemetryDebug'
 
@@ -48,3 +50,4 @@ export interface ScrollMetrics {
   loadingType: ViewLoadingType,
-  viewStart: ClocksState
+  viewStart: ClocksState,
+  webVitalTelemetryDebug: WebVitalTelemetryDebug
 ) {
@@ -89,8 +92,17 @@ const viewMetrics: ViewMetrics = {}
   let stopCLSTracking: () => void
+  let clsAttributionCollected = false
   if (isLayoutShiftSupported()) {
     viewMetrics.cumulativeLayoutShift = 0
-    ;({ stop: stopCLSTracking } = trackCumulativeLayoutShift(lifeCycle, (cumulativeLayoutShift) => {
-      viewMetrics.cumulativeLayoutShift = cumulativeLayoutShift
-      scheduleViewUpdate()
-    }))
+    ;({ stop: stopCLSTracking } = trackCumulativeLayoutShift(
+      lifeCycle,
+      (cumulativeLayoutShift, largestLayoutShiftNode, largestLayoutShiftTime) => {
+        viewMetrics.cumulativeLayoutShift = cumulativeLayoutShift
+
+        if (!clsAttributionCollected) {
+          clsAttributionCollected = true
+          webVitalTelemetryDebug.addWebVitalTelemetryDebug('CLS', largestLayoutShiftNode, largestLayoutShiftTime)
+        }
+        scheduleViewUpdate()
+      }
+    ))
   } else {
@@ -223,4 +235,8 @@ stopCLSTracking = noop
  */
-function trackCumulativeLayoutShift(lifeCycle: LifeCycle, callback: (layoutShift: number) => void) {
+function trackCumulativeLayoutShift(
+  lifeCycle: LifeCycle,
+  callback: (layoutShift: number, largestShiftNode: Node | undefined, largestShiftTime: RelativeTime) => void
+) {
   let maxClsValue = 0
+
   const window = slidingSessionWindow()
@@ -231,5 +247,6 @@ const { unsubscribe: stop } = lifeCycle.subscribe(LifeCycleEventType.PERFORMANCE_ENTRIES_COLLECTED, (entries) => {
         window.update(entry)
+
         if (window.value() > maxClsValue) {
           maxClsValue = window.value()
-          callback(round(maxClsValue, 4))
+          callback(round(maxClsValue, 4), window.largestLayoutShiftNode(), window.largestLayoutShiftTime())
         }
@@ -249,2 +266,7 @@ }
   let endTime: RelativeTime
+
+  let largestLayoutShift = 0
+  let largestLayoutShiftNode: Node | undefined
+  let largestLayoutShiftTime: RelativeTime
+
   return {
@@ -259,2 +281,4 @@ update: (entry: RumLayoutShiftTiming) => {
         value = entry.value
+        largestLayoutShift = 0
+        largestLayoutShiftNode = undefined
       } else {
@@ -264,4 +288,18 @@ value += entry.value
       }
+
+      if (entry.value > largestLayoutShift) {
+        largestLayoutShift = entry.value
+        largestLayoutShiftTime = entry.startTime
+
+        if (entry.sources?.length) {
+          const largestLayoutShiftSource = find(entry.sources, (s) => s.node?.nodeType === 1) || entry.sources[0]
+          largestLayoutShiftNode = largestLayoutShiftSource.node
+        } else {
+          largestLayoutShiftNode = undefined
+        }
+      }
     },
     value: () => value,
+    largestLayoutShiftNode: () => largestLayoutShiftNode,
+    largestLayoutShiftTime: () => largestLayoutShiftTime,
   }
@@ -268,0 +306,0 @@ }

src/domain/rumEventsCollection/view/trackViews.ts

@@ -33,2 +33,3 @@ import type { Duration, ClocksState, TimeStamp, Observable, Subscription, RelativeTime } from '@datadog/browser-core'
 import { trackViewEventCounts } from './trackViewEventCounts'
+import type { WebVitalTelemetryDebug } from './startWebVitalTelemetryDebug'
 
@@ -83,2 +84,3 @@ export interface ViewEvent {
   areViewsTrackedAutomatically: boolean,
+  webVitalTelemetryDebug: WebVitalTelemetryDebug,
   initialViewOptions?: ViewOptions
@@ -96,3 +98,12 @@ ) {
   function startNewView(loadingType: ViewLoadingType, startClocks?: ClocksState, viewOptions?: ViewOptions) {
-    return newView(lifeCycle, domMutationObservable, configuration, location, loadingType, startClocks, viewOptions)
+    return newView(
+      lifeCycle,
+      domMutationObservable,
+      configuration,
+      location,
+      loadingType,
+      webVitalTelemetryDebug,
+      startClocks,
+      viewOptions
+    )
   }
@@ -152,2 +163,3 @@
   loadingType: ViewLoadingType,
+  webVitalTelemetryDebug: WebVitalTelemetryDebug,
   startClocks: ClocksState = clocksNow(),
@@ -195,7 +207,15 @@ viewOptions?: ViewOptions
     getScrollMetrics,
-  } = trackViewMetrics(lifeCycle, domMutationObservable, configuration, scheduleViewUpdate, loadingType, startClocks)
+  } = trackViewMetrics(
+    lifeCycle,
+    domMutationObservable,
+    configuration,
+    scheduleViewUpdate,
+    loadingType,
+    startClocks,
+    webVitalTelemetryDebug
+  )
 
   const { scheduleStop: scheduleStopInitialViewTimingsTracking, timings } =
     loadingType === ViewLoadingType.INITIAL_LOAD
-      ? trackInitialViewTimings(lifeCycle, setLoadEvent, scheduleViewUpdate)
+      ? trackInitialViewTimings(lifeCycle, webVitalTelemetryDebug, setLoadEvent, scheduleViewUpdate)
       : { scheduleStop: noop, timings: {} as Timings }
@@ -202,0 +222,0 @@

src/domain/rumEventsCollection/view/viewCollection.ts

@@ -22,2 +22,3 @@ import type { Duration, ServerDuration, Observable } from '@datadog/browser-core'
 import { trackViews } from './trackViews'
+import type { WebVitalTelemetryDebug } from './startWebVitalTelemetryDebug'
 
@@ -33,2 +34,3 @@ export function startViewCollection(
   recorderApi: RecorderApi,
+  webVitalTelemetryDebug: WebVitalTelemetryDebug,
   initialViewOptions?: ViewOptions
@@ -49,2 +51,3 @@ ) {
     !configuration.trackViewsManually,
+    webVitalTelemetryDebug,
     initialViewOptions
@@ -51,0 +54,0 @@ )

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

1129410

increased by1.97%

Number of package files

409

increased by1.74%

Lines of code

20867

increased by1.42%

Published versions last months

5

increased by66.67%

Published versions last two months

6

increased by20%

Dependency changes

• + Added@datadog/browser-core@4.46.0(transitive)

• - Removed@datadog/browser-core@4.45.0(transitive)

• Updated@datadog/browser-core@4.46.0