@segment/analytics-browser-actions-logrocket 1.0.0

package/package.json

@@ -0,0 +1,21 @@
+{
+  "name": "@segment/analytics-browser-actions-logrocket",
+  "version": "1.0.0",
+  "license": "MIT",
+  "main": "./dist/cjs",
+  "module": "./dist/esm",
+  "scripts": {
+    "build": "yarn build:esm && yarn build:cjs",
+    "build:cjs": "tsc --module commonjs --outDir ./dist/cjs",
+    "build:esm": "tsc --outDir ./dist/esm"
+  },
+  "typings": "./dist/esm",
+  "dependencies": {
+    "@segment/actions-core": "^3.71.0",
+    "@segment/browser-destination-runtime": "^1.0.0",
+    "logrocket": "^3.0.1"
+  },
+  "peerDependencies": {
+    "@segment/analytics-next": "*"
+  }
+}

package/src/__tests__/index.test.ts

@@ -0,0 +1,105 @@
+import { Analytics, Context } from '@segment/analytics-next'
+import plugins, { destination } from '../index'
+import { mockWorkerAndXMLHttpRequest, subscriptions } from '../test_utilities'
+import Logrocket from 'logrocket'
+
+jest.mock('logrocket')
+
+const appID = 'log/rocket'
+
+describe('Logrocket', () => {
+  beforeAll(mockWorkerAndXMLHttpRequest)
+  afterAll(jest.restoreAllMocks)
+
+  test('can load', async () => {
+    const [event] = await plugins({
+      appID,
+      networkSanitization: false,
+      inputSanitization: false,
+      subscriptions
+    })
+
+    jest.spyOn(destination, 'initialize')
+    jest.spyOn(Logrocket, 'init')
+
+    await event.load(Context.system(), {} as Analytics)
+    expect(destination.initialize).toHaveBeenCalled()
+    expect(Logrocket.init).toHaveBeenCalled()
+
+    expect(window._LRLogger).toBeDefined()
+  })
+
+  test('supplies the input sanitization parameter', async () => {
+    const [event] = await plugins({
+      appID,
+      networkSanitization: false,
+      inputSanitization: true,
+      subscriptions
+    })
+
+    jest.spyOn(Logrocket, 'init')
+
+    await event.load(Context.system(), {} as Analytics)
+    expect(Logrocket.init).toHaveBeenCalledWith(appID, expect.objectContaining({ dom: { inputSanitizer: true } }))
+  })
+
+  describe('network sanitizer', () => {
+    test('redacts requests when configured', async () => {
+      const [event] = await plugins({
+        appID,
+        networkSanitization: true,
+        inputSanitization: false,
+        subscriptions
+      })
+
+      const spy = jest.spyOn(Logrocket, 'init')
+
+      await event.load(Context.system(), {} as Analytics)
+      expect(Logrocket.init).toHaveBeenCalledWith(appID, expect.objectContaining({ dom: { inputSanitizer: false } }))
+      const requestSanitizer: RequestSanitizer = spy.mock.calls[0][1]?.network?.requestSanitizer
+
+      if (!requestSanitizer) fail('request sanitizer null')
+
+      const mockRequest = {
+        body: 'hello',
+        headers: { goodbye: 'moon' },
+        reqId: 'something',
+        url: 'neat',
+        method: 'get'
+      }
+
+      const sanitizedResult = requestSanitizer(mockRequest)
+
+      expect(sanitizedResult).toEqual(expect.objectContaining({ body: undefined, headers: {} }))
+    })
+
+    test('does not modify requests if disabled', async () => {
+      const [event] = await plugins({
+        appID,
+        networkSanitization: false,
+        inputSanitization: false,
+        subscriptions
+      })
+
+      const spy = jest.spyOn(Logrocket, 'init')
+
+      await event.load(Context.system(), {} as Analytics)
+      expect(Logrocket.init).toHaveBeenCalledWith(appID, expect.objectContaining({ dom: { inputSanitizer: false } }))
+      const requestSanitizer: RequestSanitizer = spy.mock.calls[0][1]?.network?.requestSanitizer
+
+      if (!requestSanitizer) fail('request sanitizer null')
+
+      const mockRequest = {
+        body: 'hello',
+        headers: { goodbye: 'moon' },
+        reqId: 'something',
+        url: 'neat',
+        method: 'get'
+      }
+
+      const sanitizedResult = requestSanitizer(mockRequest)
+
+      expect(sanitizedResult).toEqual(mockRequest)
+    })
+  })
+})

package/src/generated-types.ts

@@ -0,0 +1,16 @@
+// Generated file. DO NOT MODIFY IT BY HAND.
+
+export interface Settings {
+  /**
+   * The LogRocket app ID.
+   */
+  appID: string
+  /**
+   * Sanitize all network request and response bodies from session recordings.
+   */
+  networkSanitization: boolean
+  /**
+   * Obfuscate all user-input elements (like <input> and <select>) from session recordings.
+   */
+  inputSanitization: boolean
+}

package/src/identify/__tests__/index.test.ts

@@ -0,0 +1,50 @@
+import { Analytics, Context } from '@segment/analytics-next'
+import plugins from '../../index'
+import LogRocket from 'logrocket'
+import { identifySubscription, mockWorkerAndXMLHttpRequest } from '../../test_utilities'
+
+describe('Logrocket.identify', () => {
+  const settings = { appID: 'log/rocket' }
+
+  beforeAll(mockWorkerAndXMLHttpRequest)
+  afterAll(jest.restoreAllMocks)
+
+  const traits = {
+    goodbye: 'moon'
+  }
+
+  it('should send user ID and traits to logrocket', async () => {
+    const [identify] = await plugins({ ...settings, subscriptions: [identifySubscription] })
+
+    await identify.load(Context.system(), {} as Analytics)
+    const identifySpy = jest.spyOn(LogRocket, 'identify')
+
+    const userId = 'user1'
+
+    await identify.identify?.(
+      new Context({
+        type: 'identify',
+        traits,
+        userId
+      })
+    )
+
+    expect(identifySpy).toHaveBeenCalledWith(userId, traits)
+  })
+
+  it("shouldn't send an ID if the user is anonymous", async () => {
+    const [identify] = await plugins({ appID: 'log/rocket', subscriptions: [identifySubscription] })
+
+    await identify.load(Context.system(), {} as Analytics)
+    const identifySpy = jest.spyOn(LogRocket, 'identify')
+
+    await identify.identify?.(
+      new Context({
+        type: 'identify',
+        traits
+      })
+    )
+
+    expect(identifySpy).toHaveBeenCalledWith(traits)
+  })
+})

package/src/identify/generated-types.ts

@@ -0,0 +1,14 @@
+// Generated file. DO NOT MODIFY IT BY HAND.
+
+export interface Payload {
+  /**
+   * user id
+   */
+  userId?: string
+  /**
+   * A JSON object containing additional traits that will be associated with the user.
+   */
+  traits?: {
+    [k: string]: unknown
+  }
+}

package/src/identify/index.ts

@@ -0,0 +1,45 @@
+import type { BrowserActionDefinition } from '@segment/browser-destination-runtime/types'
+import type { Settings } from '../generated-types'
+import type { Payload } from './generated-types'
+import type { LR } from '../types'
+
+type Traits = {
+  [propName: string]: string | number | boolean
+}
+
+const action: BrowserActionDefinition<Settings, LR, Payload> = {
+  title: 'Identify',
+  description: 'Send identification information to logrocket.',
+  platform: 'web',
+  defaultSubscription: 'type = "identify"',
+  fields: {
+    userId: {
+      type: 'string',
+      required: false,
+      description: 'user id',
+      label: 'User ID',
+      default: {
+        '@path': '$.userId'
+      }
+    },
+    traits: {
+      type: 'object',
+      required: false,
+      description: 'A JSON object containing additional traits that will be associated with the user.',
+      label: 'Traits',
+      default: {
+        '@path': '$.traits'
+      }
+    }
+  },
+  perform: (LogRocket, event) => {
+    const { userId, traits } = event.payload
+    if (userId) {
+      LogRocket.identify(userId, traits as Traits)
+      return
+    }
+    LogRocket.identify(traits as Traits)
+  }
+}
+
+export default action

package/src/index.ts

@@ -0,0 +1,93 @@
+import { LR } from './types'
+import type { Settings } from './generated-types'
+import type { BrowserDestinationDefinition } from '@segment/browser-destination-runtime/types'
+import { browserDestination } from '@segment/browser-destination-runtime/shim'
+import LogRocket from 'logrocket'
+import track from './track'
+import identify from './identify'
+import { defaultValues } from '@segment/actions-core'
+
+declare global {
+  interface Window {
+    LogRocket: LR
+    logRocketSettings?: LogRocketSettings
+    _LRLogger: () => void
+  }
+
+  type LogRocketSettings = NonNullable<Parameters<LR['init']>[1]>
+  type RequestSanitizer = NonNullable<LogRocketSettings['network']>['requestSanitizer']
+}
+// Switch from unknown to the partner SDK client types
+export const destination: BrowserDestinationDefinition<Settings, LR> = {
+  name: 'Logrocket',
+  slug: 'actions-logrocket',
+  mode: 'device',
+
+  presets: [
+    {
+      name: 'Track',
+      subscribe: 'type = "track"',
+      partnerAction: 'track',
+      mapping: defaultValues(track.fields)
+    },
+    {
+      name: 'Identify',
+      subscribe: 'type = "identify"',
+      partnerAction: 'identify',
+      mapping: defaultValues(identify.fields)
+    }
+  ],
+
+  settings: {
+    appID: {
+      description: 'The LogRocket app ID.',
+      label: 'LogRocket App',
+      type: 'string',
+      required: true
+    },
+    networkSanitization: {
+      description: 'Sanitize all network request and response bodies from session recordings.',
+      label: 'Network Sanitization',
+      type: 'boolean',
+      required: true,
+      default: true
+    },
+    inputSanitization: {
+      description: 'Obfuscate all user-input elements (like <input> and <select>) from session recordings.',
+      label: 'Input Sanitization',
+      type: 'boolean',
+      required: true,
+      default: true
+    }
+  },
+
+  initialize: async ({ settings: { appID, inputSanitization: inputSanitizer, networkSanitization } }, deps) => {
+    const requestSanitizer: RequestSanitizer = (request) => {
+      if (networkSanitization) {
+        request.body = undefined
+        request.headers = {}
+      }
+
+      return request
+    }
+    const settings: LogRocketSettings = {
+      dom: {
+        inputSanitizer
+      },
+      network: {
+        requestSanitizer,
+        responseSanitizer: requestSanitizer
+      }
+    }
+    LogRocket.init(appID, window.logRocketSettings || settings)
+    await deps.resolveWhen(() => Object.prototype.hasOwnProperty.call(window, '_LRLogger'), 100)
+    return LogRocket
+  },
+
+  actions: {
+    track,
+    identify
+  }
+}
+
+export default browserDestination(destination)

package/src/test_utilities.ts

@@ -0,0 +1,55 @@
+import { Subscription } from '@segment/browser-destination-runtime/types'
+
+class WorkerStub {
+  url: string
+  onmessage: (_arg: string) => void
+  constructor(stringUrl: string) {
+    this.url = stringUrl
+    // eslint-disable-next-line @typescript-eslint/no-empty-function
+    this.onmessage = (_arg: string) => {}
+  }
+
+  postMessage(msg: string) {
+    this.onmessage(msg)
+  }
+
+  // eslint-disable-next-line @typescript-eslint/no-empty-function
+  addEventListener() {}
+}
+
+export function mockWorkerAndXMLHttpRequest(): void {
+  window.XMLHttpRequest = jest.fn() as any
+  window.Worker = WorkerStub as any
+}
+
+export const trackSubscription: Subscription = {
+  partnerAction: 'track',
+  name: 'Track',
+  enabled: true,
+  subscribe: 'type = "track"',
+  mapping: {
+    name: {
+      '@path': '$.name'
+    },
+    properties: {
+      '@path': '$.properties'
+    }
+  }
+}
+
+export const identifySubscription: Subscription = {
+  partnerAction: 'identify',
+  name: 'Identify',
+  enabled: true,
+  subscribe: 'type = "identify"',
+  mapping: {
+    userId: {
+      '@path': '$.userId'
+    },
+    traits: {
+      '@path': '$.traits'
+    }
+  }
+}
+
+export const subscriptions = [trackSubscription, identifySubscription]

package/src/track/__tests__/index.test.ts

@@ -0,0 +1,30 @@
+import { Analytics, Context } from '@segment/analytics-next'
+import plugins from '../../index'
+import LogRocket from 'logrocket'
+import { mockWorkerAndXMLHttpRequest, trackSubscription } from '../../test_utilities'
+
+describe('Logrocket.track', () => {
+  beforeAll(mockWorkerAndXMLHttpRequest)
+  afterAll(jest.restoreAllMocks)
+  it('sends track events to logrocket', async () => {
+    const [event] = await plugins({ appID: 'log/rocket', subscriptions: [trackSubscription] })
+
+    await event.load(Context.system(), {} as Analytics)
+    const trackSpy = jest.spyOn(LogRocket, 'track')
+
+    const name = 'testName'
+    const properties = {
+      goodbye: 'moon'
+    }
+
+    await event.track?.(
+      new Context({
+        type: 'track',
+        name,
+        properties
+      })
+    )
+
+    expect(trackSpy).toHaveBeenCalledWith(name, properties)
+  })
+})

package/src/track/generated-types.ts

@@ -0,0 +1,14 @@
+// Generated file. DO NOT MODIFY IT BY HAND.
+
+export interface Payload {
+  /**
+   * The name of the event.
+   */
+  name: string
+  /**
+   * A JSON object containing additional properties that will be associated with the event.
+   */
+  properties?: {
+    [k: string]: unknown
+  }
+}

package/src/track/index.ts

@@ -0,0 +1,40 @@
+import type { BrowserActionDefinition } from '@segment/browser-destination-runtime/types'
+import type { Settings } from '../generated-types'
+import type { Payload } from './generated-types'
+import type { LR } from '../types'
+
+type TrackEventProperties = {
+  [key: string]: string | number | boolean | string[] | number[] | boolean[] | undefined
+}
+
+const action: BrowserActionDefinition<Settings, LR, Payload> = {
+  title: 'Track',
+  description: 'Send track events to logrocket for filtering and tagging.',
+  platform: 'web',
+  defaultSubscription: 'type = "track"',
+  fields: {
+    name: {
+      description: 'The name of the event.',
+      label: 'Name',
+      required: true,
+      type: 'string',
+      default: {
+        '@path': '$.event'
+      }
+    },
+    properties: {
+      description: 'A JSON object containing additional properties that will be associated with the event.',
+      label: 'Properties',
+      required: false,
+      type: 'object',
+      default: {
+        '@path': '$.properties'
+      }
+    }
+  },
+  perform: (LogRocket, event) => {
+    LogRocket.track(event.payload.name, (event.payload.properties as TrackEventProperties) ?? {})
+  }
+}
+
+export default action

package/src/types.ts

@@ -0,0 +1,3 @@
+import * as LogRocket from 'logrocket'
+
+export type LR = typeof LogRocket

package/tsconfig.json

@@ -0,0 +1,9 @@
+{
+  "extends": "../../tsconfig.build.json",
+  "compilerOptions": {
+    "rootDir": "./src",
+    "baseUrl": "."
+  },
+  "include": ["src"],
+  "exclude": ["dist", "**/__tests__"]
+}