Snowplow JavaScript Tracker 3.2 Released

Introducing Snowplow JavaScript trackers v3.2 with Video Tracking

This release brings the long-awaited video (and audio) tracking functionality to the JavaScript Tracker, along with several plugin/tracker enhancements.

HTML5 Media Tracking

The Media Tracking plugin allows the tracking of any <audio> or <video> element on a web page.

The following snippet, using the Browser Tracker, shows a minimal example of enabling tracking of a video element.

Install required packages:

npm i @snowplow/browser-tracker @snowplow/browser-plugin-media-tracking

index.html

<body>
  ...
  <video id="example-id" src="./example-video.mp4"></video>
  ...
</body>

main.js

import { newTracker } from "@snowplow/browser-tracker";
import { MediaTrackingPlugin, enableMediaTracking } from "@snowplow/browser-plugin-media-tracking"

newTracker("sp2", "{{collector_url}}", { 
  appId: "my-app-id", 
  plugins: [ MediaTrackingPlugin() ],
})

enableMediaTracking({
  id: "example-id"
})

Docs

Check out the following docs for more information on how Media tracking works, and the features available in the plugin.

YouTube Tracking

The YouTube Tracking plugin allows the tracking of embedded YouTube videos.

The following snippet, using the Browser Tracker, shows a minimal example of enabling tracking of an embedded YouTube video.

Install required packages:

npm i @snowplow/browser-tracker @snowplow/browser-plugin-youtube-tracking

index.html

<body>
  ...
  <iframe
    id="example-id"
    src="https://www.youtube.com/embed/zSM4ZyVe8xs"
  ></iframe>  
  ...
</body>

main.js

import { newTracker } from "@snowplow/browser-tracker";
import { YouTubeTrackingPlugin, enableYouTubeTracking } from "@snowplow/browser-plugin-youtube-tracking"

newTracker("sp2", "{{collector_url}}", { 
  appId: "my-app-id", 
  plugins: [ YouTubeTrackingPlugin() ],
})

enableYouTubeTracking({
  id: "example-id"
})

Docs

Check out the following docs for more information on how YouTube tracking works, and the features available in the plugin.

Changelog

Features

  • HTML5 video/audio tracking plugin (#805)
  • YouTube tracking plugin (#1014)

Updates

  • Add support for custom headers (#1010)
  • Allow enableFormTracking to capture dynamic form changes (#748)
  • Allow alternative Access-Control-Allow-Credentials values (#808)
  • Ensure Browser Data is added to Payload before plugin beforeTrack fires (#1025)

Upgrading

Version 3.2.3 is available as @snowplow/browser-tracker on npm, or as the tag based javascript tracker - available on GitHub Releases, jsDelivr or unpkg.

Media Tracking and Youtube Tracking plugins are also available npm, and on GitHub Releases, jsDelivr (Media / Youtube) or unpkg (Media / Youtube).

Edit: Update links to 3.2.3

7 Likes