@kubesense/kubesense-browser-core 1.7.0 → 2.0.0-beta.0

package/src/browser/cookie.ts

@@ -1,12 +1,12 @@
-import { display } from '../tools/display'
-import { ONE_MINUTE, ONE_SECOND } from '../tools/utils/timeUtils'
+import { ONE_SECOND } from '@kubesense/kubesense-js-core/time'
+import { buildUrl, globalObject } from '@kubesense/kubesense-js-core/util'
 import {
   findAllCommaSeparatedValues,
   findCommaSeparatedValue,
   findCommaSeparatedValues,
   generateUUID,
 } from '../tools/utils/stringUtils'
-import { buildUrl } from '../tools/utils/urlPolyfill'
+import type { Configuration } from '../domain/configuration'
 
 export interface CookieOptions {
   secure?: boolean
@@ -19,10 +19,10 @@ export function setCookie(name: string, value: string, expireDelay: number = 0,
   const date = new Date()
   date.setTime(date.getTime() + expireDelay)
   const expires = `expires=${date.toUTCString()}`
-  const sameSite = options && options.crossSite ? 'none' : 'strict'
-  const domain = options && options.domain ? `;domain=${options.domain}` : ''
-  const secure = options && options.secure ? ';secure' : ''
-  const partitioned = options && options.partitioned ? ';partitioned' : ''
+  const sameSite = options?.crossSite ? 'none' : 'strict'
+  const domain = options?.domain ? `;domain=${options.domain}` : ''
+  const secure = options?.secure ? ';secure' : ''
+  const partitioned = options?.partitioned ? ';partitioned' : ''
   document.cookie = `${name}=${value};${expires};path=/;samesite=${sameSite}${domain}${secure}${partitioned}`
 }
 
@@ -31,7 +31,13 @@ export function setCookie(name: string, value: string, expireDelay: number = 0,
  * If there are multiple cookies with the same name, returns the first one
  */
 export function getCookie(name: string) {
-  return findCommaSeparatedValue(document.cookie, name)
+  const value = findCommaSeparatedValue(document.cookie, name)
+
+  if (value === '') {
+    return
+  }
+
+  return value
 }
 
 /**
@@ -46,6 +52,8 @@ let initCookieParsed: Map<string, string> | undefined
 /**
  * Returns a cached value of the cookie. Use this during SDK initialization (and whenever possible)
  * to avoid accessing document.cookie multiple times.
+ *
+ * ⚠️ If there are multiple cookies with the same name, returns the LAST one (unlike `getCookie()`)
  */
 export function getInitCookie(name: string) {
   if (!initCookieParsed) {
@@ -62,38 +70,26 @@ export function deleteCookie(name: string, options?: CookieOptions) {
   setCookie(name, '', 0, options)
 }
 
-export function areCookiesAuthorized(options: CookieOptions): boolean {
-  if (document.cookie === undefined || document.cookie === null) {
-    return false
-  }
-  try {
-    // Use a unique cookie name to avoid issues when the SDK is initialized multiple times during
-    // the test cookie lifetime
-    const testCookieName = `kubesense_cookie_test_${generateUUID()}`
-    const testCookieValue = 'test'
-    setCookie(testCookieName, testCookieValue, ONE_MINUTE, options)
-    const isCookieCorrectlySet = getCookie(testCookieName) === testCookieValue
-    deleteCookie(testCookieName, options)
-    return isCookieCorrectlySet
-  } catch (error) {
-    display.error(error)
-    return false
-  }
-}
-
 /**
  * No API to retrieve it, number of levels for subdomain and suffix are unknown
  * strategy: find the minimal domain on which cookies are allowed to be set
  * https://web.dev/same-site-same-origin/#site
  */
 let getCurrentSiteCache: string | undefined
-export function getCurrentSite(hostname = location.hostname, referrer = document.referrer): string | undefined {
+export function getCurrentSite(
+  hostname = globalObject.location?.hostname ?? '',
+  referrer = typeof document !== 'undefined' ? document.referrer : ''
+): string | undefined {
+  // Cookie probing requires document.cookie, which is not available in Web Workers or Node.js
+  if (typeof document === 'undefined') {
+    return undefined
+  }
   if (getCurrentSiteCache === undefined) {
     const defaultHostName = getCookieDefaultHostName(hostname, referrer)
     if (defaultHostName) {
       // Use a unique cookie name to avoid issues when the SDK is initialized multiple times during
       // the test cookie lifetime
-      const testCookieName = `dd_site_test_${generateUUID()}`
+      const testCookieName = `kubesense_site_test_${generateUUID()}`
       const testCookieValue = 'test'
 
       const domainLevels = defaultHostName.split('.')
@@ -106,6 +102,7 @@ export function getCurrentSite(hostname = location.hostname, referrer = document
       getCurrentSiteCache = candidateDomain
     }
   }
+
   return getCurrentSiteCache
 }
 
@@ -119,4 +116,22 @@ function getCookieDefaultHostName(hostname: string, referrer: string) {
 
 export function resetGetCurrentSite() {
   getCurrentSiteCache = undefined
-}
+}
+
+export function buildCookieOptions(configuration: Configuration): CookieOptions | undefined {
+  const cookieOptions: CookieOptions = {}
+
+  cookieOptions.secure = configuration.useSecureSessionCookie || configuration.usePartitionedCrossSiteSessionCookie
+  cookieOptions.crossSite = configuration.usePartitionedCrossSiteSessionCookie
+  cookieOptions.partitioned = configuration.usePartitionedCrossSiteSessionCookie
+
+  if (configuration.trackSessionAcrossSubdomains) {
+    const currentSite = getCurrentSite()
+    if (!currentSite) {
+      return
+    }
+    cookieOptions.domain = currentSite
+  }
+
+  return cookieOptions
+}

package/src/browser/cookieAccess.ts

@@ -0,0 +1,172 @@
+import { ONE_MINUTE, ONE_SECOND, dateNow } from '@kubesense/kubesense-js-core/time'
+import { globalObject } from '@kubesense/kubesense-js-core/util'
+import { setInterval, clearInterval } from '../tools/timer'
+import { Observable } from '../tools/observable'
+import { mockable } from '../tools/mockable'
+import { display } from '../tools/display'
+import { generateUUID } from '../tools/utils/stringUtils'
+import { addTelemetryDebug } from '../domain/telemetry'
+import { addEventListener, DOM_EVENT, isEventSupported } from './addEventListener'
+import { deleteCookie, getCookies, setCookie } from './cookie'
+import type { CookieOptions } from './cookie'
+
+export interface CookieAccess {
+  getAll(): Promise<string[]>
+  getAllAndSet(cb: (value: string[]) => { value: string; expireDelay: number }): Promise<void>
+  delete(): Promise<void>
+  observable: Observable<void>
+}
+
+export type CookieAccessFactory = (cookieName: string, cookieOptions: CookieOptions) => CookieAccess
+
+// Used to identify capability-probe cookies so their write failures aren't reported as telemetry:
+// failing to write them is an expected outcome (it triggers the document.cookie fallback), not a bug.
+export const TEST_COOKIE_NAME_PREFIX = 'kubesense_cookie_test_'
+
+export async function areCookiesAuthorized(
+  createAccess: CookieAccessFactory,
+  cookieOptions: CookieOptions
+): Promise<boolean> {
+  // Use a unique cookie name to avoid issues when the SDK is initialized multiple times during
+  // the test cookie lifetime
+  const testCookieName = `${TEST_COOKIE_NAME_PREFIX}${generateUUID()}`
+  const testCookieValue = 'test'
+  const access = createAccess(testCookieName, cookieOptions)
+  try {
+    await access.getAllAndSet(() => ({ value: testCookieValue, expireDelay: ONE_MINUTE }))
+    const values = await access.getAll()
+    return values.includes(testCookieValue)
+  } catch (error) {
+    display.error(error)
+    return false
+  } finally {
+    try {
+      await access.delete()
+    } catch {
+      // Best-effort cleanup
+    }
+  }
+}
+
+export function createCookieStoreAccess(cookieName: string, cookieOptions: CookieOptions): CookieAccess {
+  const cookieStore = mockable(globalObject.cookieStore)!
+  const observable = new Observable<void>(() => {
+    const listener = addEventListener(cookieStore, DOM_EVENT.CHANGE, (event) => {
+      // Based on our experimentation, we're assuming that entries for the same cookie cannot be in both the 'changed' and 'deleted' arrays.
+      // However, due to ambiguity in the specification, we asked for clarification: https://github.com/WICG/cookie-store/issues/226
+      const changeEvent =
+        event.changed.some((event) => event.name === cookieName) ||
+        event.deleted.some((event) => event.name === cookieName)
+      if (changeEvent) {
+        observable.notify()
+      }
+    })
+    return listener.stop
+  })
+
+  return {
+    async getAll() {
+      const items = await cookieStore.getAll(cookieName)
+      return items.map((item) => item.value)
+    },
+
+    delete() {
+      return cookieStore.delete({
+        name: cookieName,
+        domain: cookieOptions.domain,
+        path: '/',
+        partitioned: cookieOptions.partitioned,
+      })
+    },
+
+    async getAllAndSet(cb: (value: string[]) => { value: string; expireDelay: number }) {
+      const items = await cookieStore.getAll(cookieName)
+
+      const currentValues = items.map((item) => item.value)
+      const { value, expireDelay } = cb(currentValues)
+
+      try {
+        await cookieStore.set({
+          name: cookieName,
+          value,
+          expires: dateNow() + expireDelay,
+          path: '/',
+          sameSite: cookieOptions.crossSite ? 'none' : 'strict',
+          domain: cookieOptions.domain,
+          secure: cookieOptions.secure,
+          partitioned: cookieOptions.partitioned,
+        })
+      } catch (error) {
+        if (!cookieName.startsWith(TEST_COOKIE_NAME_PREFIX)) {
+          const documentCookies = getCookies(cookieName)
+          // monitor-until: 2026-10-01
+          addTelemetryDebug('Failed to set cookie using Cookie Store API', {
+            'error.message': (error as Error).message,
+            newValue: value,
+            cookieOptions: {
+              ...cookieOptions,
+            },
+            cookies: items.map((item) => ({
+              ...item,
+            })),
+            cookieCount: items.length,
+            documentCookies,
+          })
+        }
+      }
+    },
+
+    observable,
+  }
+}
+
+export const WATCH_COOKIE_INTERVAL_DELAY = ONE_SECOND
+export function createDocumentCookieAccess(cookieName: string, cookieOptions: CookieOptions): CookieAccess {
+  let previousCookieValues = getCookies(cookieName)
+
+  const observable = new Observable<void>(() => {
+    const watchCookieIntervalId = setInterval(() => {
+      const cookieValues = getCookies(cookieName)
+      notifyCookieValueIfChanged(cookieValues)
+    }, WATCH_COOKIE_INTERVAL_DELAY)
+
+    return () => {
+      clearInterval(watchCookieIntervalId)
+    }
+  })
+
+  function notifyCookieValueIfChanged(cookieValues: string[]) {
+    if (String(cookieValues) !== String(previousCookieValues)) {
+      previousCookieValues = cookieValues
+      observable.notify()
+    }
+  }
+
+  return {
+    getAll() {
+      return Promise.resolve(getCookies(cookieName))
+    },
+
+    async getAllAndSet(cb: (value: string[]) => { value: string; expireDelay: number }) {
+      const currentValue = getCookies(cookieName)
+      const { value, expireDelay } = cb(currentValue)
+      setCookie(cookieName, value, expireDelay, cookieOptions)
+      await Promise.resolve()
+      notifyCookieValueIfChanged([value])
+    },
+
+    async delete() {
+      deleteCookie(cookieName, cookieOptions)
+      await Promise.resolve()
+      notifyCookieValueIfChanged([])
+    },
+
+    observable,
+  }
+}
+
+// Salesforce LWS does not support the change event of CookieStore objects. https://developer.salesforce.com/tools/lws-distortion-viewer
+export function isCookieStoreSupported(): boolean {
+  const cookieStore = mockable(globalObject.cookieStore)
+  return Boolean(cookieStore && isEventSupported(cookieStore, DOM_EVENT.CHANGE))
+}

package/src/browser/fetch.ts

@@ -0,0 +1,14 @@
+import { globalObject } from '@kubesense/kubesense-js-core/util'
+import { getZoneJsOriginalValue } from '../tools/getZoneJsOriginalValue'
+
+/**
+ * Make a fetch request using the native implementation, bypassing Zone.js patching.
+ * This prevents unnecessary Angular change detection cycles.
+ *
+ * @param input - The resource to fetch (URL or Request object)
+ * @param init - Optional fetch options
+ * @returns A Promise that resolves to the Response
+ */
+export function fetch(input: RequestInfo | URL, init?: RequestInit): Promise<Response> {
+  return getZoneJsOriginalValue(globalObject, 'fetch')(input, init)
+}

package/src/browser/fetchObservable.ts

@@ -1,12 +1,11 @@
+import type { ClocksState } from '@kubesense/kubesense-js-core/time'
+import { clocksNow } from '@kubesense/kubesense-js-core/time'
+import { normalizeUrl, globalObject } from '@kubesense/kubesense-js-core/util'
+import type { GlobalObject } from '@kubesense/kubesense-js-core/util'
+import { monitorError } from '@kubesense/kubesense-js-core/monitor'
 import type { InstrumentedMethodCall } from '../tools/instrumentMethod'
 import { instrumentMethod } from '../tools/instrumentMethod'
-import { monitorError } from '../tools/monitor'
 import { Observable } from '../tools/observable'
-import type { ClocksState } from '../tools/utils/timeUtils'
-import { clocksNow } from '../tools/utils/timeUtils'
-import { normalizeUrl } from '../tools/utils/urlPolyfill'
-import type { GlobalObject } from '../tools/globalObject'
-import { globalObject } from '../tools/globalObject'
 import { readBytesFromStream } from '../tools/readBytesFromStream'
 import { tryToClone } from '../tools/utils/responseUtils'
 
@@ -17,6 +16,7 @@ interface FetchContextBase {
   init?: RequestInit
   url: string
   handlingStack?: string
+  isAbortedOnStart: boolean
 }
 
 export interface FetchStartContext extends FetchContextBase {
@@ -43,10 +43,7 @@ type ResponseBodyActionGetter = (context: FetchResolveContext) => ResponseBodyAc
  */
 export const enum ResponseBodyAction {
   IGNORE = 0,
-  // TODO(next-major): Remove the "WAIT" action when `trackEarlyRequests` is removed, as the
-  // duration of fetch requests will always come from PerformanceResourceTiming
-  WAIT = 1,
-  COLLECT = 2,
+  COLLECT = 1,
 }
 
 let fetchObservable: Observable<FetchContext> | undefined
@@ -69,6 +66,7 @@ export function resetFetchObservable() {
 
 function createFetchObservable() {
   return new Observable<FetchContext>((observable) => {
+    // eslint-disable-next-line local-rules/disallow-zone-js-patched-values
     if (!globalObject.fetch) {
       return
     }
@@ -86,7 +84,7 @@ function beforeSend(
   observable: Observable<FetchContext>
 ) {
   const [input, init] = parameters
-  let methodFromParams = init && init.method
+  let methodFromParams = init?.method
 
   if (methodFromParams === undefined && input instanceof Request) {
     methodFromParams = input.method
@@ -104,6 +102,7 @@ function beforeSend(
     startClocks,
     url,
     handlingStack,
+    isAbortedOnStart: (input instanceof Request && input.signal?.aborted) || init?.signal?.aborted || false,
   }
 
   observable.notify(context)
@@ -123,18 +122,20 @@ async function afterSend(
   startContext: FetchStartContext
 ) {
   const context = startContext as unknown as FetchResolveContext
-  context.state = 'resolve'
 
   let response: Response
 
   try {
     response = await responsePromise
   } catch (error) {
-    context.status = 0
-    context.isAborted =
-      context.init?.signal?.aborted || (error instanceof DOMException && error.code === DOMException.ABORT_ERR)
-    context.error = error as Error
-    observable.notify(context)
+    observable.notify({
+      ...context,
+      state: 'resolve',
+      status: 0,
+      isAborted:
+        context.init?.signal?.aborted || (error instanceof DOMException && error.code === DOMException.ABORT_ERR),
+      error: error as Error,
+    })
     return
   }
 
@@ -143,19 +144,17 @@ async function afterSend(
   context.responseType = response.type
   context.isAborted = false
 
-  const responseBodyCondition = responseBodyActionGetters.reduce(
+  const responseBodyCondition: ResponseBodyAction = responseBodyActionGetters.reduce<number>(
     (action, getter) => Math.max(action, getter(context)),
     ResponseBodyAction.IGNORE
-  ) as ResponseBodyAction
+  )
 
-  if (responseBodyCondition !== ResponseBodyAction.IGNORE) {
+  if (responseBodyCondition === ResponseBodyAction.COLLECT) {
     const clonedResponse = tryToClone(response)
-    if (clonedResponse && clonedResponse.body) {
+    if (clonedResponse?.body) {
       try {
-        const bytes = await readBytesFromStream(clonedResponse.body, {
-          collectStreamBody: responseBodyCondition === ResponseBodyAction.COLLECT,
-        })
-        context.responseBody = bytes && new TextDecoder().decode(bytes)
+        const bytes = await readBytesFromStream(clonedResponse.body)
+        context.responseBody = new TextDecoder().decode(bytes)
       } catch {
         // Ignore errors when reading the response body (e.g., stream aborted, network errors)
         // This is not critical and should not be reported as an SDK error
@@ -163,5 +162,5 @@ async function afterSend(
     }
   }
 
-  observable.notify(context)
+  observable.notify({ ...context, state: 'resolve' })
 }

package/src/browser/pageMayExitObservable.ts

@@ -1,6 +1,6 @@
+import { globalObject } from '@kubesense/kubesense-js-core/util'
 import { Observable } from '../tools/observable'
 import { objectValues } from '../tools/utils/polyfills'
-import type { Configuration } from '../domain/configuration'
 import { addEventListeners, addEventListener, DOM_EVENT } from './addEventListener'
 
 export const PageExitReason = {
@@ -16,10 +16,14 @@ export interface PageMayExitEvent {
   reason: PageExitReason
 }
 
-export function createPageMayExitObservable(configuration: Configuration): Observable<PageMayExitEvent> {
+export function createPageMayExitObservable(): Observable<PageMayExitEvent> {
   return new Observable<PageMayExitEvent>((observable) => {
+    const window = globalObject.window
+    if (!window) {
+      // Page exit is not observable in non-browser environments
+      return
+    }
     const { stop: stopListeners } = addEventListeners(
-      configuration,
       window,
       [DOM_EVENT.VISIBILITY_CHANGE, DOM_EVENT.FREEZE],
       (event) => {
@@ -40,7 +44,7 @@ export function createPageMayExitObservable(configuration: Configuration): Obser
       { capture: true }
     )
 
-    const stopBeforeUnloadListener = addEventListener(configuration, window, DOM_EVENT.BEFORE_UNLOAD, () => {
+    const stopBeforeUnloadListener = addEventListener(window, DOM_EVENT.BEFORE_UNLOAD, () => {
       observable.notify({ reason: PageExitReason.UNLOADING })
     }).stop
 
@@ -51,7 +55,7 @@ export function createPageMayExitObservable(configuration: Configuration): Obser
      * tab switch, so it says "this page is done" in a way visibilitychange
      * cannot.
      */
-    const stopPageHideListener = addEventListener(configuration, window, DOM_EVENT.PAGE_HIDE, () => {
+    const stopPageHideListener = addEventListener(window, DOM_EVENT.PAGE_HIDE, () => {
       observable.notify({ reason: PageExitReason.PAGEHIDE })
     }).stop
 

package/src/browser/runOnReadyState.ts

@@ -1,9 +1,7 @@
-import type { Configuration } from '../domain/configuration'
 import { noop } from '../tools/utils/functionUtils'
 import { DOM_EVENT, addEventListener } from './addEventListener'
 
 export function runOnReadyState(
-  configuration: Configuration,
   expectedReadyState: 'complete' | 'interactive',
   callback: () => void
 ): { stop: () => void } {
@@ -12,14 +10,11 @@ export function runOnReadyState(
     return { stop: noop }
   }
   const eventName = expectedReadyState === 'complete' ? DOM_EVENT.LOAD : DOM_EVENT.DOM_CONTENT_LOADED
-  return addEventListener(configuration, window, eventName, callback, { once: true })
+  return addEventListener(window, eventName, callback, { once: true })
 }
 
-export function asyncRunOnReadyState(
-  configuration: Configuration,
-  expectedReadyState: 'complete' | 'interactive'
-): Promise<void> {
+export function asyncRunOnReadyState(expectedReadyState: 'complete' | 'interactive'): Promise<void> {
   return new Promise((resolve) => {
-    runOnReadyState(configuration, expectedReadyState, resolve)
+    runOnReadyState(expectedReadyState, resolve)
   })
 }

package/src/browser/webSocketObservable.ts

@@ -0,0 +1,181 @@
+import type { ClocksState } from '@kubesense/kubesense-js-core/time'
+import { clocksNow } from '@kubesense/kubesense-js-core/time'
+import type { GlobalObject } from '@kubesense/kubesense-js-core/util'
+import { globalObject } from '@kubesense/kubesense-js-core/util'
+import { instrumentConstructor, instrumentMethod } from '../tools/instrumentMethod'
+import { Observable } from '../tools/observable'
+import { computeBytesCount } from '../tools/utils/byteUtils'
+import { addEventListener } from './addEventListener'
+
+type GlobalWithWebSocket = GlobalObject & { WebSocket: typeof WebSocket }
+
+function isGlobalWithWebSocket(global: GlobalObject): global is GlobalWithWebSocket {
+  return typeof (global as { WebSocket?: unknown }).WebSocket === 'function'
+}
+
+export interface WebSocketConnectingContext {
+  state: 'connecting'
+  instance: WebSocket
+  url: string
+  protocols?: string | string[]
+  startClocks: ClocksState
+}
+
+export interface WebSocketOpenContext {
+  state: 'open'
+  instance: WebSocket
+  openClocks: ClocksState
+  protocol: string
+}
+
+export interface WebSocketMessageInContext {
+  state: 'message-in'
+  instance: WebSocket
+  size: number
+  at: ClocksState
+}
+
+export interface WebSocketMessageOutContext {
+  state: 'message-out'
+  instance: WebSocket
+  size: number
+  bufferedAmountPreSend: number
+  at: ClocksState
+}
+
+export interface WebSocketClosedContext {
+  state: 'closed'
+  instance: WebSocket
+  code: number
+  reason: string
+  wasClean: boolean
+  at: ClocksState
+}
+
+export type WebSocketContext =
+  | WebSocketConnectingContext
+  | WebSocketOpenContext
+  | WebSocketMessageInContext
+  | WebSocketMessageOutContext
+  | WebSocketClosedContext
+
+let webSocketObservable: Observable<WebSocketContext> | undefined
+
+export function initWebSocketObservable(): Observable<WebSocketContext> {
+  if (!webSocketObservable) {
+    webSocketObservable = createWebSocketObservable()
+  }
+
+  return webSocketObservable
+}
+
+function createWebSocketObservable() {
+  return new Observable<WebSocketContext>((observable) => {
+    if (!isGlobalWithWebSocket(globalObject)) {
+      return undefined
+    }
+
+    const { stop: stopInstrumentingConstructor } = instrumentConstructor(
+      globalObject,
+      'WebSocket',
+      ({ parameters, onPostCall }) => {
+        const protocols = Array.isArray(parameters[1]) ? ([] as string[]).concat(parameters[1]) : parameters[1]
+        const startClocks = clocksNow()
+
+        onPostCall((instance) => {
+          observable.notify({
+            state: 'connecting',
+            instance,
+            url: instance.url,
+            protocols,
+            startClocks,
+          })
+
+          attachInstanceListeners(instance, observable)
+        })
+      }
+    )
+
+    const { stop: stopInstrumentingSend } = instrumentMethod(
+      globalObject.WebSocket.prototype,
+      'send',
+      ({ target: instance, parameters: [data], onPostCall }) => {
+        const size = computePayloadSize(data)
+        const bufferedAmountPreSend = instance.bufferedAmount
+
+        onPostCall(() => {
+          observable.notify({
+            state: 'message-out',
+            instance,
+            size,
+            bufferedAmountPreSend,
+            at: clocksNow(),
+          })
+        })
+      }
+    )
+
+    return () => {
+      stopInstrumentingConstructor()
+      stopInstrumentingSend()
+    }
+  })
+}
+
+function attachInstanceListeners(instance: WebSocket, observable: Observable<WebSocketContext>) {
+  const { stop: stopOpen } = addEventListener(instance, 'open', () => {
+    observable.notify({
+      state: 'open',
+      instance,
+      openClocks: clocksNow(),
+      protocol: instance.protocol || '',
+    })
+
+    stopOpen()
+  })
+
+  const { stop: stopMessage } = addEventListener(instance, 'message', (event) => {
+    observable.notify({
+      state: 'message-in',
+      instance,
+      size: computePayloadSize(event.data),
+      at: clocksNow(),
+    })
+  })
+
+  const { stop: stopClose } = addEventListener(instance, 'close', (event) => {
+    observable.notify({
+      state: 'closed',
+      instance,
+      code: event.code,
+      reason: event.reason,
+      wasClean: event.wasClean,
+      at: clocksNow(),
+    })
+
+    stopMessage()
+    stopClose()
+  })
+}
+
+function computePayloadSize(data: unknown): number {
+  if (typeof data === 'string') {
+    return computeBytesCount(data)
+  }
+  if (data instanceof ArrayBuffer || ArrayBuffer.isView(data)) {
+    return data.byteLength
+  }
+  if (typeof Blob !== 'undefined' && data instanceof Blob) {
+    return data.size
+  }
+  return 0
+}
+
+/**
+ * Reset the WebSocket observable global state. Test-only.
+ *
+ * @internal
+ */
+export function resetWebSocketObservable() {
+  webSocketObservable = undefined
+}