@bufferapp/buffer-tracking-browser-ts

Buffer Tracker - Browser (Typescript)

A Strongly-typed segment tracking companion for use in Browser Typescript projects. Under the hood this uses the Buffer segment tracking plan, acting as a type-safe wrapper for clients. With this, there is no need to pull in or reference the tracking plan!

You will need to have configured segment as per these instructions before using this package.

You can install this by running:

npm install @bufferapp/buffer-tracking-browser-ts

Before using, you'll need to ensure that your project is configured to access to segment. You can follow this guide here.

Next you'll need to add the typewriter import to the desired file:

import {BufferTracker} from '@bufferapp/buffer-tracking-browser-ts'

With the dependency added, you can use the typewriter reference to call the desired tracking functions:

typewriter.draftSubmitted({
  product: 'publish',
  channel: 'instagram',
  channelType: 'business',
  postId: '58edaj782102dff',
  channelId: '12345679',
  channelServiceId: '987654567898'
})

When calling these functions, any violations or errors will be logged as warnings to your console. if you wish for these to throw errors (maybe during development), then you can configure options on the typewriter reference to enable this:

typewriter.setTypewriterOptions({
  onViolation: (msg, violations) => {
    const issues = violations.map(v => v.keyword === 'type' ? `${v.message}: '${v.dataPath}'` : `${v.message}`)
    throw new Error(
      `"${msg.event}" Fired with Tracking Plan Violation\n    ${issues.join('\n    ')}`
    )
  }
})

---

Product / Client Typings

If you need access to Product or Client typings, you can import them like so:

import {Product, Client} from '@bufferapp/buffer-tracking-node-ts' If there is a Product or Client that is not included, let us know in the #data-governance slack channel and it can be added :)

---

Gotchas

There is currently no Type support for the requirement of a userId or anonymous ID when triggering a tracking event. We are working on adding support for this in the near future, but for now it's important to note that either one of these must be added when tracking!

Latest plan changes not reflected in the library

If the library does not reflect the latest tracking changes then you can trigger a rebuild manually. Head over to this URL and select the Run Workflow option. After a few minutes, the latest release should be pushed to NPM.