@newrelic/video-videojs 4.1.2 → 4.2.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +62 -1
- package/README.md +170 -40
- package/dist/cjs/index.js +1 -1
- package/dist/cjs/index.js.LICENSE.txt +1 -1
- package/dist/cjs/index.js.map +1 -1
- package/dist/esm/index.js +1 -1
- package/dist/esm/index.js.LICENSE.txt +1 -1
- package/dist/esm/index.js.map +1 -1
- package/dist/umd/newrelic-video-videojs.min.js +1 -1
- package/dist/umd/newrelic-video-videojs.min.js.LICENSE.txt +1 -1
- package/dist/umd/newrelic-video-videojs.min.js.map +1 -1
- package/package.json +1 -1
- package/src/ads/media-tailor.js +126 -91
- package/src/ads/utils/mt-constants.js +2 -1
- package/src/ads/utils/mt.js +44 -22
- package/src/register-plugin.js +2 -2
- package/src/tracker.js +150 -16
package/CHANGELOG.md
CHANGED
|
@@ -1,4 +1,65 @@
|
|
|
1
|
-
## [4.2.
|
|
1
|
+
## [4.2.1](https://github.com/newrelic/video-videojs-js/compare/v4.2.0...v4.2.1) (2026-06-18)
|
|
2
|
+
|
|
3
|
+
### Features
|
|
4
|
+
|
|
5
|
+
- **Quality/Rendition Change Tracking:** Added optional support for automatic rendition change detection and reporting
|
|
6
|
+
- Integrated optional `videojs-contrib-quality-levels` plugin for quality level monitoring
|
|
7
|
+
- Implemented automatic rendition change event tracking with bitrate information
|
|
8
|
+
- Added lazy initialization of quality levels plugin support
|
|
9
|
+
- Tracks old and new bitrate during quality transitions
|
|
10
|
+
- Graceful fallback when quality levels plugin is not loaded
|
|
11
|
+
|
|
12
|
+
### Documentation
|
|
13
|
+
|
|
14
|
+
- **Quality/Rendition Tracking Guide:** Comprehensive documentation for enabling optional quality tracking
|
|
15
|
+
- Installation instructions for `videojs-contrib-quality-levels` plugin
|
|
16
|
+
- Detailed explanation of how the feature works
|
|
17
|
+
- Console debugging information for troubleshooting
|
|
18
|
+
- NRQL query examples for analyzing quality changes
|
|
19
|
+
- Updated README with Quality/Rendition Tracking section
|
|
20
|
+
- Feature Highlights section now includes rendition change tracking
|
|
21
|
+
|
|
22
|
+
## [4.2.0](https://github.com/newrelic/video-videojs-js/compare/v4.1.2...v4.2.0) (2026-06-10)
|
|
23
|
+
|
|
24
|
+
### Features
|
|
25
|
+
|
|
26
|
+
- **MediaTailor Custom CDN Support:** Replaced URL-based auto-detection with explicit opt-in
|
|
27
|
+
- Customers now pass `mediatailor: true` (or `mediatailor: { trackingUrl, adSegmentPrefix }`) to enable the tracker — supports both default AWS hostnames and custom CDN domains
|
|
28
|
+
- Added `MT_DEFAULT_AD_SEGMENT_PATH` (`/tm/`) constant for AWS-recommended CDN ad-segment path; ad segments rewritten to a custom CDN domain under `/tm/` are detected automatically
|
|
29
|
+
- `isMediaTailorSegment()` now checks the default AWS segments hostname, the `/tm/` path, and an optional customer-supplied `adSegmentPrefix`
|
|
30
|
+
- Threaded `adSegmentPrefix` through HLS (VHS) and DASH manifest parsing
|
|
31
|
+
- Added explicit session initialisation via `mediatailor: { trackingUrl }` for POST `/v1/session/` flows
|
|
32
|
+
|
|
33
|
+
- **Ad Tracking Configuration:** Introduced `config.ad.type` to control ad tracker selection
|
|
34
|
+
- Exposed `AD_TRACKING` constant with CSAI (flat value covering IMA / Brightcove IMA / Freewheel / generic) and SSAI sub-types (`DAI`, `MT`)
|
|
35
|
+
- SSAI requires an explicit sub-type — each platform needs its own SDK and cannot be auto-detected
|
|
36
|
+
- `SSAI.MT` implies `mediatailor: true`
|
|
37
|
+
- When `config.ad.type` is unset, falls back to CSAI auto-detection with a warning (backward compatible for v4.1.2 users)
|
|
38
|
+
- Co-located `segmentPrefix` and `trackingUrl` under `config.ad`
|
|
39
|
+
- Added `DaiAdsTracker` to static exports
|
|
40
|
+
|
|
41
|
+
- **Logging Improvements:**
|
|
42
|
+
- Exposed `VideojsTracker.Log` as a static so UMD callers can set log level
|
|
43
|
+
- Logs active ad segment detection mode at tracker startup
|
|
44
|
+
- Logs the matched ad segment detection path on first ad break (once per session)
|
|
45
|
+
- Logs which CSAI framework was auto-detected (BrightcoveIma / IMA / Freewheel / generic)
|
|
46
|
+
- Replaced `console.log/warn/error` with `nrvideo.Log` across MediaTailor files
|
|
47
|
+
|
|
48
|
+
### Bug Fixes
|
|
49
|
+
|
|
50
|
+
- **Buffer End:** Fixed buffer end handling in tracker
|
|
51
|
+
- **Plugin Registration:** Fixed `register-plugin.js` silently dropping the options object and not forwarding it to the `TrackerJS` constructor
|
|
52
|
+
|
|
53
|
+
### Documentation
|
|
54
|
+
|
|
55
|
+
- **README & SSAI Docs:** Updated for custom CDN support, clarified when `trackingUrl` and `adSegmentPrefix` overrides are needed, cleaned up `sessionId` references
|
|
56
|
+
- **SSAI Troubleshooting:** Corrected `adSegmentPrefix` references to `config.ad.segmentPrefix`
|
|
57
|
+
|
|
58
|
+
### Samples
|
|
59
|
+
|
|
60
|
+
- **MediaTailor Lab:** Rewrote sample app with a clean minimal UI — license key / app ID / playback URL / format toggle, smart Load button (handles both session init and direct playback URLs), NR log level toggle, debug log showing detected mode, credentials persisted in localStorage
|
|
61
|
+
|
|
62
|
+
## [4.1.2](https://github.com/newrelic/video-videojs-js/compare/v4.1.1...v4.1.2) (2026-05-11)
|
|
2
63
|
|
|
3
64
|
### Features
|
|
4
65
|
|
package/README.md
CHANGED
|
@@ -15,6 +15,7 @@ The New Relic Video.js Tracker provides comprehensive video analytics for applic
|
|
|
15
15
|
- 🔧 **Multi-Tech Support** - Works with VHS, hls.js, and Shaka Player
|
|
16
16
|
- 📈 **QoE Metrics** - Quality of Experience aggregation for startup time, buffering, and playback quality
|
|
17
17
|
- 🎨 **Event Segregation** - Organized event types: `VideoAction`, `VideoAdAction`, `VideoErrorAction`, `VideoCustomAction`
|
|
18
|
+
- 🌐 **Rendition Change Tracking** - Monitor quality/rendition changes with automatic rendition change event reporting
|
|
18
19
|
- 🚀 **Easy Integration** - NPM package or direct script include
|
|
19
20
|
|
|
20
21
|
## Table of Contents
|
|
@@ -29,6 +30,7 @@ The New Relic Video.js Tracker provides comprehensive video analytics for applic
|
|
|
29
30
|
- [API Reference](#api-reference)
|
|
30
31
|
- [Bitrate Metrics](#bitrate-metrics)
|
|
31
32
|
- [Ad Tracking Support](#ad-tracking-support)
|
|
33
|
+
- [Quality/Rendition Tracking](#qualityrendition-tracking)
|
|
32
34
|
- [SSAI Guide](#ssai-guide)
|
|
33
35
|
- [Data Model](#data-model)
|
|
34
36
|
- [Support](#support)
|
|
@@ -105,6 +107,9 @@ Before using the tracker, ensure you have:
|
|
|
105
107
|
- **New Relic Account** - Active New Relic account with valid application credentials (`beacon`, `applicationId`, `licenseKey`)
|
|
106
108
|
- **Video.js Player** - Video.js player integrated in your application
|
|
107
109
|
|
|
110
|
+
**Optional:**
|
|
111
|
+
- **Quality Tracking Plugin** - To track rendition/quality changes, optionally install `videojs-contrib-quality-levels` (see [Quality/Rendition Tracking](#qualityrendition-tracking) section for details). This is not required — the tracker works perfectly without it.
|
|
112
|
+
|
|
108
113
|
## Usage
|
|
109
114
|
|
|
110
115
|
### Getting Your Configuration
|
|
@@ -306,6 +311,53 @@ if (shouldEnableTracking(currentUser.id)) {
|
|
|
306
311
|
|
|
307
312
|
## Configuration Options
|
|
308
313
|
|
|
314
|
+
### Ad Tracking
|
|
315
|
+
|
|
316
|
+
`config.ad.type` declares which ad category the tracker should wire up. **If not set, no ad tracking runs** — this is the safe default. Omitting it while passing other options triggers a console warning.
|
|
317
|
+
|
|
318
|
+
#### CSAI — Client-Side Ad Insertion
|
|
319
|
+
|
|
320
|
+
All CSAI frameworks (IMA, Brightcove IMA, Freewheel) share the `adsready` event path. The tracker auto-detects which one is present — no sub-type needed. Just declare `CSAI`.
|
|
321
|
+
|
|
322
|
+
| Value | Constant | Behaviour |
|
|
323
|
+
| -------- | ---------------- | -------------------------------------------------------------------------- |
|
|
324
|
+
| `'csai'` | `AD_TRACKING.CSAI` | Auto-detects: Brightcove IMA → IMA → Freewheel → generic fallback |
|
|
325
|
+
|
|
326
|
+
#### SSAI — Server-Side Ad Insertion
|
|
327
|
+
|
|
328
|
+
Each SSAI platform has its own SDK and a completely different activation path — they cannot be auto-detected. **A sub-type is always required.**
|
|
329
|
+
|
|
330
|
+
| Value | Constant | Behaviour |
|
|
331
|
+
| ------------ | ---------------------- | ----------------------------------------------------------------------- |
|
|
332
|
+
| `'ssai:dai'` | `AD_TRACKING.SSAI.DAI` | Google DAI (`google.ima.dai.api`) |
|
|
333
|
+
| `'ssai:mt'` | `AD_TRACKING.SSAI.MT` | AWS MediaTailor |
|
|
334
|
+
|
|
335
|
+
```javascript
|
|
336
|
+
import { AD_TRACKING } from '@newrelic/video-videojs';
|
|
337
|
+
|
|
338
|
+
// CSAI — one value covers all client-side frameworks
|
|
339
|
+
new VideojsTracker(player, { config: { ad: { type: AD_TRACKING.CSAI } } });
|
|
340
|
+
|
|
341
|
+
// SSAI — sub-type always required
|
|
342
|
+
new VideojsTracker(player, { config: { ad: { type: AD_TRACKING.SSAI.DAI } } });
|
|
343
|
+
new VideojsTracker(player, { config: { ad: { type: AD_TRACKING.SSAI.MT } } });
|
|
344
|
+
|
|
345
|
+
// SSAI.MT with custom CDN config
|
|
346
|
+
new VideojsTracker(player, {
|
|
347
|
+
config: {
|
|
348
|
+
ad: {
|
|
349
|
+
type: AD_TRACKING.SSAI.MT,
|
|
350
|
+
segmentPrefix: '/my-cdn-path/',
|
|
351
|
+
},
|
|
352
|
+
},
|
|
353
|
+
});
|
|
354
|
+
|
|
355
|
+
// Change at runtime before first loadstart / adsready
|
|
356
|
+
tracker.setAdTracking(AD_TRACKING.CSAI);
|
|
357
|
+
```
|
|
358
|
+
|
|
359
|
+
> **Extending later:** add a new key to `AD_TRACKING.SSAI` — validation derives from the object automatically. No other changes needed.
|
|
360
|
+
|
|
309
361
|
### QoE (Quality of Experience) Settings
|
|
310
362
|
|
|
311
363
|
| Option | Type | Default | Description |
|
|
@@ -378,6 +430,18 @@ tracker.setOptions({
|
|
|
378
430
|
});
|
|
379
431
|
```
|
|
380
432
|
|
|
433
|
+
#### `tracker.setAdTracking(type)`
|
|
434
|
+
|
|
435
|
+
Change the ad tracking mode after the tracker is created. Must be called before the first `loadstart` or `adsready` event to take effect.
|
|
436
|
+
|
|
437
|
+
```javascript
|
|
438
|
+
import { AD_TRACKING } from '@newrelic/video-videojs';
|
|
439
|
+
|
|
440
|
+
// Valid values: 'csai' | 'ssai:dai' | 'ssai:mt'
|
|
441
|
+
tracker.setAdTracking(AD_TRACKING.CSAI);
|
|
442
|
+
tracker.setAdTracking(AD_TRACKING.SSAI.MT);
|
|
443
|
+
```
|
|
444
|
+
|
|
381
445
|
### Example: Complete Integration
|
|
382
446
|
|
|
383
447
|
```javascript
|
|
@@ -437,68 +501,134 @@ The tracker captures four distinct bitrate metrics providing complete quality an
|
|
|
437
501
|
|
|
438
502
|
## Ad Tracking Support
|
|
439
503
|
|
|
440
|
-
The tracker provides comprehensive ad tracking capabilities:
|
|
441
|
-
|
|
442
504
|
### Supported Ad Technologies
|
|
443
505
|
|
|
444
|
-
|
|
445
|
-
|
|
446
|
-
|
|
506
|
+
| Category | Frameworks detected | Constant |
|
|
507
|
+
|---|---|---|
|
|
508
|
+
| CSAI | Google IMA, Brightcove IMA, Freewheel, generic | `AD_TRACKING.CSAI` |
|
|
509
|
+
| SSAI | Google DAI | `AD_TRACKING.SSAI.DAI` |
|
|
510
|
+
| SSAI | AWS MediaTailor | `AD_TRACKING.SSAI.MT` |
|
|
447
511
|
|
|
448
|
-
|
|
512
|
+
See [Configuration Options → Ad Tracking](#ad-tracking) for full usage and examples.
|
|
449
513
|
|
|
450
|
-
|
|
514
|
+
### Google DAI Integration
|
|
451
515
|
|
|
452
516
|
```javascript
|
|
453
|
-
|
|
454
|
-
const tracker = new VideojsTracker(player,
|
|
455
|
-
|
|
456
|
-
// The tracker will automatically capture:
|
|
457
|
-
// - Ad breaks, starts, and completions
|
|
458
|
-
// - Ad quartiles and click events
|
|
459
|
-
// - SSAI-specific metadata when available
|
|
517
|
+
import { AD_TRACKING } from '@newrelic/video-videojs';
|
|
518
|
+
const tracker = new VideojsTracker(player, { config: { ad: { type: AD_TRACKING.SSAI.DAI } } });
|
|
460
519
|
```
|
|
461
520
|
|
|
462
|
-
|
|
463
|
-
|
|
464
|
-
> [!NOTE]
|
|
465
|
-
> **Attention:**
|
|
466
|
-
> This version supports tracking for SSAI (Server-Side Ad Insertion), including AWS MediaTailor. See [samples/media-tailor-lab.html](./samples/media-tailor-lab.html) and the [SSAI Guide](./docs/ssai.md).
|
|
521
|
+
See [samples/dai/index.html](./samples/dai/index.html) for a complete example.
|
|
467
522
|
|
|
468
523
|
### AWS MediaTailor Integration
|
|
469
524
|
|
|
470
|
-
|
|
471
|
-
|
|
472
|
-
- **HLS and DASH** manifest formats
|
|
473
|
-
- **VOD and LIVE** stream types
|
|
474
|
-
- **Multiple ads (pods)** within a single break
|
|
475
|
-
- **Quartile tracking** (25%, 50%, 75%)
|
|
476
|
-
- **Tracking metadata enrichment** when MediaTailor tracking data is available
|
|
477
|
-
|
|
478
|
-
#### Usage
|
|
525
|
+
Supports HLS/DASH, VOD/LIVE, multiple ads per break, quartile tracking, and tracking metadata enrichment.
|
|
479
526
|
|
|
480
527
|
```javascript
|
|
481
|
-
import
|
|
528
|
+
import { AD_TRACKING } from '@newrelic/video-videojs';
|
|
482
529
|
|
|
483
|
-
// Initialize player with a sessionized MediaTailor playback URL
|
|
484
530
|
player.src({
|
|
485
531
|
src: 'https://your-mediatailor-endpoint.mediatailor.region.amazonaws.com/v1/master/...',
|
|
486
532
|
type: 'application/x-mpegURL'
|
|
487
533
|
});
|
|
488
534
|
|
|
489
|
-
|
|
490
|
-
|
|
535
|
+
const tracker = new VideojsTracker(player, { config: { ad: { type: AD_TRACKING.SSAI.MT } } });
|
|
536
|
+
|
|
537
|
+
// With custom CDN config
|
|
538
|
+
const tracker = new VideojsTracker(player, {
|
|
539
|
+
config: {
|
|
540
|
+
ad: {
|
|
541
|
+
type: AD_TRACKING.SSAI.MT,
|
|
542
|
+
segmentPrefix: '/my-cdn-path/',
|
|
543
|
+
},
|
|
544
|
+
},
|
|
545
|
+
});
|
|
546
|
+
```
|
|
547
|
+
|
|
548
|
+
Works with default AWS hostnames and custom CDN domains. See [docs/ssai.md](./docs/ssai.md) for custom CDN setup and advanced options.
|
|
549
|
+
|
|
550
|
+
## Quality/Rendition Tracking
|
|
551
|
+
|
|
552
|
+
The tracker can automatically detect and report rendition (quality) changes when adaptive bitrate (ABR) video is played. This is an **optional feature** — the tracker works perfectly fine without it.
|
|
553
|
+
|
|
554
|
+
### Optional: Enable Quality Tracking
|
|
555
|
+
|
|
556
|
+
To enable quality/rendition change tracking, install and include the **videojs-contrib-quality-levels** plugin:
|
|
557
|
+
|
|
558
|
+
**Step 1: Install the plugin**
|
|
559
|
+
|
|
560
|
+
```bash
|
|
561
|
+
npm install videojs-contrib-quality-levels
|
|
491
562
|
```
|
|
492
563
|
|
|
493
|
-
|
|
494
|
-
1. Detect MediaTailor URLs (`.mediatailor.` in URL)
|
|
495
|
-
2. Build the MediaTailor tracking endpoint from the sessionized playback URL
|
|
496
|
-
3. Parse HLS or DASH manifests for ad markers
|
|
497
|
-
4. Track ad breaks, ad starts, quartiles, and ad ends
|
|
498
|
-
5. Enrich ad metadata with the MediaTailor tracking endpoint when available
|
|
499
|
-
6. Handle VOD and LIVE streams appropriately
|
|
564
|
+
**Step 2: Include in your HTML** (before the tracker script):
|
|
500
565
|
|
|
501
|
-
|
|
566
|
+
```html
|
|
567
|
+
<!-- Video.js Player -->
|
|
568
|
+
<link href="https://vjs.zencdn.net/7.20.3/video-js.css" rel="stylesheet" />
|
|
569
|
+
<script src="https://vjs.zencdn.net/7.20.3/video.js"></script>
|
|
570
|
+
|
|
571
|
+
<!-- Quality Levels Plugin (Optional - only needed for rendition tracking) -->
|
|
572
|
+
<script src="https://cdn.jsdelivr.net/npm/videojs-contrib-quality-levels/dist/videojs-contrib-quality-levels.min.js"></script>
|
|
573
|
+
|
|
574
|
+
<!-- New Relic Video.js Tracker -->
|
|
575
|
+
<script src="path/to/newrelic-video-videojs.min.js"></script>
|
|
576
|
+
```
|
|
577
|
+
|
|
578
|
+
### How It Works
|
|
579
|
+
|
|
580
|
+
When the plugin is enabled:
|
|
581
|
+
- The tracker monitors the quality levels plugin for rendition change events
|
|
582
|
+
- When a rendition change occurs (automatic ABR or user-initiated), a `RENDITION_CHANGE` event is sent to New Relic
|
|
583
|
+
- The event includes quality metadata: bitrate, width, height, and label
|
|
584
|
+
- Quality changes are tracked for both content and ad playback
|
|
585
|
+
|
|
586
|
+
If the plugin is **not** loaded:
|
|
587
|
+
- The tracker continues to work normally
|
|
588
|
+
- All video events are tracked (play, pause, buffering, seeking, etc.)
|
|
589
|
+
- Quality/rendition change events are simply not captured
|
|
590
|
+
- A debug message logs to the console: `[QualityLevels] player.qualityLevels is not a function`
|
|
591
|
+
|
|
592
|
+
### Console Debugging
|
|
593
|
+
|
|
594
|
+
During development, if the plugin is enabled, the tracker logs quality change events to the console:
|
|
595
|
+
|
|
596
|
+
```
|
|
597
|
+
[QualityLevels] Plugin initialized successfully
|
|
598
|
+
[QualityLevels] Change event fired!
|
|
599
|
+
[QualityLevels] selectedIndex: 1
|
|
600
|
+
[QualityLevels] Selected level: {width: 1280, height: 720, bitrate: 2500000, …}
|
|
601
|
+
[QualityLevels] Sending rendition changed event
|
|
602
|
+
```
|
|
603
|
+
|
|
604
|
+
If you see this message instead:
|
|
605
|
+
```
|
|
606
|
+
[QualityLevels] player.qualityLevels is not a function
|
|
607
|
+
```
|
|
608
|
+
|
|
609
|
+
It means the plugin is not loaded or not available. This is fine — the tracker will continue tracking all other video metrics.
|
|
610
|
+
|
|
611
|
+
### NRQL Query Examples
|
|
612
|
+
|
|
613
|
+
When quality tracking is enabled:
|
|
614
|
+
|
|
615
|
+
```sql
|
|
616
|
+
-- Track rendition changes over time
|
|
617
|
+
SELECT count(*) FROM VideoAction
|
|
618
|
+
WHERE actionName = 'CONTENT_RENDITION_CHANGE'
|
|
619
|
+
FACET contentBitrate SINCE 1 day ago
|
|
620
|
+
|
|
621
|
+
-- Monitor average bitrate during playback
|
|
622
|
+
SELECT average(contentBitrate) FROM VideoAction
|
|
623
|
+
WHERE actionName = 'CONTENT_HEARTBEAT'
|
|
624
|
+
FACET contentRenditionWidth, contentRenditionHeight
|
|
625
|
+
SINCE 1 hour ago
|
|
626
|
+
|
|
627
|
+
-- Analyze quality upgrades vs downgrades
|
|
628
|
+
SELECT contentBitrate FROM VideoAction
|
|
629
|
+
WHERE actionName = 'CONTENT_RENDITION_CHANGE'
|
|
630
|
+
SINCE 24 hours ago
|
|
631
|
+
```
|
|
502
632
|
|
|
503
633
|
## SSAI Guide
|
|
504
634
|
|