improve LD client integration with highlight sdk

sdk/highlight-run/src/client/index.tsx

@@ -107,7 +107,13 @@
 import HighlightClientWorker from './workers/highlight-client-worker?worker&inline'
 import { MessageType, PropertyType } from './workers/types'
 import { parseError } from './utils/errors'
-import { Counter, Gauge, Histogram, UpDownCounter } from '@opentelemetry/api'
+import {
+	Attributes,
+	Counter,
+	Gauge,
+	Histogram,
+	UpDownCounter,
+} from '@opentelemetry/api'
 import { IntegrationClient } from '../integrations'
 import { LaunchDarklyIntegration } from '../integrations/launchdarkly'
 import { LDClientMin } from '../integrations/launchdarkly/types/LDClient'
@@ -476,6 +482,22 @@
 		}
 	}
 
+	log(message: any, level: string, metadata?: Attributes) {
+		//TODO(vkorolik)
+		this._firstLoadListeners.messages.push({
+			type: level,
+			trace: trace.slice(1),
+			value: message,
+			attributes: stringify(
+				data
+					.filter((d) => typeof d === 'object')
+					.reduce((a, b) => ({ ...a, ...b }), {}),
+				logOptions.stringifyOptions,
+			),
+			time: Date.now(),
+		})
+	}
+
 	pushCustomError(message: string, payload?: string) {
 		return this.consumeCustomError(new Error(message), undefined, payload)
 	}

sdk/highlight-run/src/client/listeners/console-listener.tsx

@@ -115,32 +115,38 @@ export function ConsoleListener(
 				// @ts-expect-error
 				original.apply(this, data)
 				try {
-					const trace = parseError(new Error())
-					const message = logOptions.serializeConsoleAttributes
-						? data.map((o) =>
-								typeof o === 'object'
-									? stringify(o, logOptions.stringifyOptions)
-									: o,
-							)
-						: data
-								.filter((o) => typeof o !== 'object')
-								.map((o) => `${o}`)
-					callback({
-						type: level,
-						trace: trace.slice(1),
-						value: message,
-						attributes: stringify(
-							data
-								.filter((d) => typeof d === 'object')
-								.reduce((a, b) => ({ ...a, ...b }), {}),
-							logOptions.stringifyOptions,
-						),
-						time: Date.now(),
-					})
+					callback(createLog(level, logOptions, data))
 				} catch (error) {
 					original('highlight logger error:', error, ...data)
 				}
 			}
 		})
 	}
 }
+
+export function createLog(
+	level: string,
+	logOptions: LogRecordOptions,
+	...data: Array<any>
+) {
+	const trace = parseError(new Error())
+	const message = logOptions.serializeConsoleAttributes
+		? data.map((o) =>
+				typeof o === 'object'
+					? stringify(o, logOptions.stringifyOptions)
+					: o,
+			)
+		: data.filter((o) => typeof o !== 'object').map((o) => `${o}`)
+	return {
+		type: level,
+		trace: trace.slice(1),
+		value: message,
+		attributes: stringify(
+			data
+				.filter((d) => typeof d === 'object')
+				.reduce((a, b) => ({ ...a, ...b }), {}),
+			logOptions.stringifyOptions,
+		),
+		time: Date.now(),
+	}
+}

sdk/highlight-run/src/client/otel/index.ts

@@ -150,6 +150,7 @@
 		]
 	if (documentLoadConfig !== false) {
 		instrumentations.push(
+			// TODO(vkorolik) hooks for this to LD integration
 			new DocumentLoadInstrumentation({
 				applyCustomAttributesOnSpan: {
 					documentLoad: assignDocumentDurations,

sdk/highlight-run/src/client/types/types.ts

@@ -1,4 +1,4 @@
-import type { Context, Span, SpanOptions } from '@opentelemetry/api'
+import { Attributes, Context, Span, SpanOptions } from '@opentelemetry/api'
 import {
 	ConsoleMethods,
 	DebugOptions,
@@ -288,6 +288,7 @@
 	 * @param metadata Additional details you want to associate to the event.
 	 */
 	track: (event: string, metadata?: Metadata) => void
+	log: (message: any, level: string, metadata?: Attributes) => void
 	/**
 	 * @deprecated with replacement by `consumeError` for an in-app stacktrace.
 	 */
@@ -379,6 +380,8 @@
 			fn: F,
 		): ReturnType<F>
 	}
+	// TODO(vkorolik) log fn, H.track should log,
+	// TODO(vkorolik) secure session id propagatiion on logs
 	/**
 	 * Starts a new span for tracing in Highlight. The span will be ended when the
 	 * `end()` is called on the span. It returns whatever is returned from the

sdk/highlight-run/src/index.tsx

@@ -28,7 +28,13 @@ import {
 	loadCookieSessionData,
 } from './client/utils/sessionStorage/highlightSession.js'
 import { setCookieWriteEnabled } from './client/utils/storage'
-import { Context, Span, SpanOptions, Tracer } from '@opentelemetry/api'
+import {
+	Attributes,
+	Context,
+	Span,
+	SpanOptions,
+	Tracer,
+} from '@opentelemetry/api'
 import firstloadVersion from './__generated/version.js'
 import { listenToChromeExtensionMessage } from './browserExtension/extensionListener.js'
 import configureElectronHighlight from './environments/electron.js'
@@ -295,6 +301,15 @@ const H: HighlightPublicInterface = {
 			HighlightWarning('track', e)
 		}
 	},
+	log: (message: any, level: string, metadata?: Attributes) => {
+		try {
+			H.onHighlightReady(() =>
+				highlight_obj.log(message, level, metadata ?? {}),
+			)
+		} catch (e) {
+			HighlightWarning('log', e)
+		}
+	},
 	start: (options) => {
 		if (highlight_obj?.state === 'Recording' && !options?.forceNew) {
 			if (!options?.silent) {

sdk/highlight-run/src/integrations/launchdarkly/index.ts

@@ -6,7 +6,6 @@ import {
 	IdentifySeriesData,
 	IdentifySeriesResult,
 } from './types/Hooks'
-import { trace } from '@opentelemetry/api'
 import { type HighlightPublicInterface, MetricCategory } from '../../client'
 import type { ErrorMessage, Source } from '../../client/types/shared-types'
 import type { IntegrationClient } from '../index'
@@ -66,6 +65,7 @@ export function setupLaunchDarklyIntegration(
 			data: IdentifySeriesData,
 			_result: IdentifySeriesResult,
 		) => {
+			hClient.log()
 			hClient.identify(
 				getCanonicalKey(hookContext.context),
 				hookContext.context,
@@ -87,18 +87,11 @@ export function setupLaunchDarklyIntegration(
 					getCanonicalKey(hookContext.context)
 			}
 
-			let span = trace.getActiveSpan()
-			if (span) {
-				span.addEvent(FEATURE_FLAG_SCOPE, eventAttributes)
-			} else {
-				hClient.startSpan(FEATURE_FLAG_SPAN_NAME, (s) => {
-					if (s) {
-						s.addEvent(FEATURE_FLAG_SCOPE, eventAttributes)
-					}
-				})
-			}
-
-			hClient.track(FEATURE_FLAG_SPAN_NAME, eventAttributes)
+			hClient.startSpan(FEATURE_FLAG_SPAN_NAME, (s) => {
+				if (s) {
+					s.addEvent(FEATURE_FLAG_SCOPE, eventAttributes)
+				}
+			})
 
 			return data
 		},
@@ -154,10 +147,6 @@ export class LaunchDarklyIntegration implements IntegrationClient {
 
 	track(sessionSecureID: string, metadata: object) {
 		const event = (metadata as unknown as { event?: string }).event
-		// skip integration hClient.track() calls
-		if (event === FEATURE_FLAG_SPAN_NAME) {
-			return
-		}
 		this.client.track(
 			event ? `${LD_TRACK_EVENT}:${event}` : LD_TRACK_EVENT,
 			{