Add anonymousId and timestamp to web signalData (#1263)

Author: silesky

.changeset/late-bikes-notice.md

@@ -0,0 +1,6 @@
+---
+'@segment/analytics-signals': minor
+'@segment/analytics-signals-runtime': minor
+---
+
+Add anonymousID and timestamp to signals

jest.config.js

@@ -18,5 +18,6 @@ module.exports = () =>
       '<rootDir>/packages/consent/consent-wrapper-onetrust',
       '<rootDir>/scripts',
       '<rootDir>/packages/signals/signals',
+      '<rootDir>/packages/test-helpers',
     ],
   })

packages/signals/signals-integration-tests/src/tests/signals-vanilla/top-level-metadata.test.ts

@@ -0,0 +1,71 @@
+import { test, expect } from '@playwright/test'
+import { waitForCondition } from '../../helpers/playwright-utils'
+import { IndexPage } from './index-page'
+
+const basicEdgeFn = `
+    // this is a process signal function
+    const processSignal = (signal) => {
+      if (signal.type === 'interaction') {
+        analytics.track('hello', { myAnonId: signal.anonymousId, myTimestamp: signal.timestamp })
+      } 
+    }
+`
+
+let indexPage: IndexPage
+
+const isoDateRegEx = /^\d{4}-\d{2}-\d{2}T\d{2}:\d{2}:\d{2}\.\d{3}Z$/
+
+test.beforeEach(async ({ page }) => {
+  indexPage = await new IndexPage().loadAndWait(page, basicEdgeFn)
+})
+
+test('Signals should have anonymousId and timestamp at top level', async () => {
+  await indexPage.network.mockTestRoute()
+  await indexPage.network.makeFetchCall()
+  await Promise.all([
+    indexPage.clickButton(),
+    indexPage.makeAnalyticsPageCall(),
+    indexPage.waitForSignalsApiFlush(),
+    indexPage.waitForTrackingApiFlush(),
+  ])
+
+  const types = [
+    'network',
+    'interaction',
+    'instrumentation',
+    'navigation',
+  ] as const
+
+  const evs = types.map((type) => ({
+    type,
+    networkCalls: indexPage.signalsAPI.getEvents(type),
+  }))
+
+  evs.forEach((events) => {
+    if (!events.networkCalls.length) {
+      throw new Error(`No events found for type ${events.type}`)
+    }
+    events.networkCalls.forEach((event) => {
+      const expected = {
+        anonymousId: event.anonymousId,
+        timestamp: expect.stringMatching(isoDateRegEx),
+        type: event.properties!.type,
+      }
+      expect(event.properties).toMatchObject(expected)
+    })
+  })
+
+  const getCreatedEvent = () =>
+    indexPage.trackingAPI
+      .getEvents()
+      .find((el) => el.type === 'track' && el.event === 'hello')
+
+  await waitForCondition(() => !!getCreatedEvent(), {
+    errorMessage: 'No track events found, should have an event',
+  })
+  const event = getCreatedEvent()!
+  expect(event.properties).toEqual({
+    myAnonId: event.anonymousId,
+    myTimestamp: expect.stringMatching(isoDateRegEx),
+  })
+})

packages/signals/signals-runtime/package.json

@@ -26,7 +26,7 @@
     "build:cjs": "yarn tsc -p tsconfig.build.json --outDir ./dist/cjs --module commonjs",
     "build:global": "node build-signals-runtime-global.js",
     "assert-generated": "bash scripts/assert-generated.sh",
-    "watch": "rm -rf dist/esm && yarn build:esm --watch",
+    "watch": "rm -rf dist/esm && yarn build:esm && yarn build:esm --watch",
     "watch:test": "yarn test --watch",
     "tsc": "yarn run -T tsc",
     "eslint": "yarn run -T eslint",

packages/signals/signals-runtime/src/shared/shared-types.ts

@@ -1,5 +1,9 @@
+export type ID = string | null | undefined
+
 export interface BaseSignal {
   type: string
+  anonymousId: ID
+  timestamp: string
 }
 
 export type SignalOfType<

packages/signals/signals-runtime/src/test-helpers/mocks/mock-signal-types-web.ts

@@ -1,3 +1,4 @@
+import { BaseSignal } from '../../shared/shared-types'
 import {
   InteractionSignal,
   NavigationSignal,
@@ -8,6 +9,13 @@ import {
 } from '../../web/web-signals-types'
 // Mock data for testing
 
+type DefaultProps = Pick<BaseSignal, 'anonymousId' | 'timestamp'>
+
+const baseSignalProps: DefaultProps = {
+  anonymousId: '123',
+  timestamp: '2020-01-01T00:00:00.000Z',
+}
+
 export const mockPageData: PageData = {
   url: 'https://www.segment.com/docs/connections/sources/catalog/libraries/website/javascript/',
   path: '/docs/connections/sources/catalog/libraries/website/javascript/',
@@ -29,7 +37,7 @@ export const mockInteractionSignal: InteractionSignal = {
       attributes: { id: 'button1', class: 'btn-primary' },
     },
   },
-  metadata: { timestamp: Date.now() },
+  ...baseSignalProps,
 }
 
 export const mockNavigationSignal: NavigationSignal = {
@@ -41,7 +49,7 @@ export const mockNavigationSignal: NavigationSignal = {
     hash: '#section1',
     prevUrl: 'https://example.com/home',
   },
-  metadata: { timestamp: Date.now() },
+  ...baseSignalProps,
 }
 
 export const mockInstrumentationSignal: InstrumentationSignal = {
@@ -50,7 +58,7 @@ export const mockInstrumentationSignal: InstrumentationSignal = {
     page: mockPageData,
     rawEvent: { type: 'customEvent', detail: 'example' },
   },
-  metadata: { timestamp: Date.now() },
+  ...baseSignalProps,
 }
 
 export const mockNetworkSignal: NetworkSignal = {
@@ -63,7 +71,7 @@ export const mockNetworkSignal: NetworkSignal = {
     method: 'GET',
     data: { key: 'value' },
   },
-  metadata: { timestamp: Date.now() },
+  ...baseSignalProps,
 }
 
 export const mockUserDefinedSignal: UserDefinedSignal = {
@@ -72,5 +80,5 @@ export const mockUserDefinedSignal: UserDefinedSignal = {
     page: mockPageData,
     customField: 'customValue',
   },
-  metadata: { timestamp: Date.now() },
+  ...baseSignalProps,
 }

packages/signals/signals/jest.config.js

@@ -2,5 +2,5 @@ const { createJestTSConfig } = require('@internal/config')
 
 module.exports = createJestTSConfig(__dirname, {
   testEnvironment: 'jsdom',
-  setupFilesAfterEnv: ['./jest.setup.js'],
+  setupFilesAfterEnv: ['./jest.setup.ts'],
 })

packages/signals/signals/jest.setup.js

@@ -0,0 +1,6 @@
+/* eslint-disable no-undef */
+import './src/test-helpers/jest-extended'
+import { JestSerializers } from '@internal/test-helpers'
+import 'fake-indexeddb/auto'
+globalThis.structuredClone = (v: any) => JSON.parse(JSON.stringify(v))
+expect.addSnapshotSerializer(JestSerializers.jestSnapshotSerializerTimestamp)

packages/signals/signals/jest.setup.ts

@@ -25,6 +25,7 @@
   ],
   "scripts": {
     ".": "yarn run -T turbo run --filter=@segment/analytics-signals...",
+    "..": "yarn run -T turbo run --filter=...@segment/analytics-signals...",
     "test": "yarn jest",
     "lint": "yarn concurrently 'yarn:eslint .' 'yarn:tsc --noEmit'",
     "build": "rm -rf dist && yarn concurrently 'yarn:build:*'",