Skip to content

[PANA-5341] Add constants to make interacting with BrowserChangeRecords easier #336

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
sethfowler-datadog merged 1 commit into from
Jan 8, 2026
Merged

[PANA-5341] Add constants to make interacting with BrowserChangeRecords easier #336

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
21 changes: 21 additions & 0 deletions lib/cjs/src/session-replay-browser.d.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -15,6 +15,7 @@ export declare const RecordType: {
ViewEnd: SessionReplay.ViewEndRecord['type'];
VisualViewport: SessionReplay.VisualViewportRecord['type'];
FrustrationRecord: SessionReplay.FrustrationRecord['type'];
Change: SessionReplay.BrowserChangeRecord['type'];
};
export declare type RecordType = typeof RecordType[keyof typeof RecordType];
export declare const NodeType: {
Expand Down Expand Up @@ -56,3 +57,23 @@ export declare const MediaInteractionType: {
readonly Pause: 1;
};
export declare type MediaInteractionType = typeof MediaInteractionType[keyof typeof MediaInteractionType];
declare type ChangeTypeId<Id, Data> = [Id, ...Data[]] extends SessionReplay.Change ? Id : never;
export declare const ChangeType: {
AddString: ChangeTypeId<0, SessionReplay.AddStringChange>;
AddNode: ChangeTypeId<1, SessionReplay.AddNodeChange>;
RemoveNode: ChangeTypeId<2, SessionReplay.RemoveNodeChange>;
Attribute: ChangeTypeId<3, SessionReplay.AttributeChange>;
Text: ChangeTypeId<4, SessionReplay.TextChange>;
Size: ChangeTypeId<5, SessionReplay.SizeChange>;
ScrollPosition: ChangeTypeId<6, SessionReplay.ScrollPositionChange>;
AddStyleSheet: ChangeTypeId<7, SessionReplay.AddStyleSheetChange>;
AttachedStyleSheets: ChangeTypeId<8, SessionReplay.AttachedStyleSheetsChange>;
MediaPlaybackState: ChangeTypeId<9, SessionReplay.MediaPlaybackStateChange>;
VisualViewport: ChangeTypeId<10, SessionReplay.VisualViewportChange>;
};
export declare type ChangeType = typeof ChangeType[keyof typeof ChangeType];
export declare const PlaybackState: {
Playing: SessionReplay.PlaybackStatePlaying;
Paused: SessionReplay.PlaybackStatePaused;
};
export declare type PlaybackState = typeof PlaybackState[keyof typeof PlaybackState];
20 changes: 19 additions & 1 deletion lib/cjs/src/session-replay-browser.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -14,7 +14,7 @@ var __exportStar = (this && this.__exportStar) || function(m, exports) {
for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
};
Object.defineProperty(exports, "__esModule", { value: true });
exports.MediaInteractionType = exports.MouseInteractionType = exports.IncrementalSource = exports.NodeType = exports.RecordType = exports.BrowserSource = void 0;
exports.PlaybackState = exports.ChangeType = exports.MediaInteractionType = exports.MouseInteractionType = exports.IncrementalSource = exports.NodeType = exports.RecordType = exports.BrowserSource = void 0;
__exportStar(require("../generated/browserSessionReplay"), exports);
/**
* For backward compatibility reasons, `undefined` should be accepted as a possible value for Browser segments, too.
Expand All @@ -30,6 +30,7 @@ exports.RecordType = {
ViewEnd: 7,
VisualViewport: 8,
FrustrationRecord: 9,
Change: 12,
};
exports.NodeType = {
Document: 0,
Expand Down Expand Up @@ -67,3 +68,20 @@ exports.MediaInteractionType = {
Play: 0,
Pause: 1,
};
exports.ChangeType = {
AddString: 0,
AddNode: 1,
RemoveNode: 2,
Attribute: 3,
Text: 4,
Size: 5,
ScrollPosition: 6,
AddStyleSheet: 7,
AttachedStyleSheets: 8,
MediaPlaybackState: 9,
VisualViewport: 10,
};
exports.PlaybackState = {
Playing: 0,
Paused: 1,
};
12 changes: 11 additions & 1 deletion lib/cjs/src/session-replay.d.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
import type { IncrementalSource as BrowserIncrementalSource, RecordType as BrowserRecordType } from './session-replay-browser';
import type { IncrementalSource as MobileIncrementalSource, RecordType as MobileRecordType } from './session-replay-mobile';
export * from '../generated/sessionReplay';
export { BrowserSource, NodeType, IncrementalSource as BrowserIncrementalSource, MouseInteractionType, MediaInteractionType, } from './session-replay-browser';
export { BrowserSource, ChangeType as BrowserChangeType, NodeType, IncrementalSource as BrowserIncrementalSource, MouseInteractionType, MediaInteractionType, PlaybackState, } from './session-replay-browser';
export { IncrementalSource as MobileIncrementalSource, MobileSource, WireframeType } from './session-replay-mobile';
export declare const RecordType: {
BrowserFullSnapshot: typeof BrowserRecordType.FullSnapshot;
Expand All @@ -13,6 +13,7 @@ export declare const RecordType: {
FrustrationRecord: typeof BrowserRecordType.FrustrationRecord;
MobileFullSnapshot: typeof MobileRecordType.FullSnapshot;
MobileIncrementalSnapshot: typeof MobileRecordType.IncrementalSnapshot;
BrowserChange: typeof BrowserRecordType.Change;
};
export declare type RecordType = typeof RecordType[keyof typeof RecordType];
export declare type IncrementalSource = BrowserIncrementalSource | MobileIncrementalSource;
Expand All @@ -28,3 +29,12 @@ export declare const PointerType: {
readonly Pen: "pen";
};
export declare type PointerType = typeof PointerType[keyof typeof PointerType];
export declare type NodeId = number & {
__brand: 'NodeId';
};
export declare type StringId = number & {
__brand: 'StringId';
};
export declare type StyleSheetId = number & {
__brand: 'StyleSheetId';
};
5 changes: 4 additions & 1 deletion lib/cjs/src/session-replay.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -14,14 +14,16 @@ var __exportStar = (this && this.__exportStar) || function(m, exports) {
for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
};
Object.defineProperty(exports, "__esModule", { value: true });
exports.PointerType = exports.PointerEventType = exports.RecordType = exports.WireframeType = exports.MobileSource = exports.MobileIncrementalSource = exports.MediaInteractionType = exports.MouseInteractionType = exports.BrowserIncrementalSource = exports.NodeType = exports.BrowserSource = void 0;
exports.PointerType = exports.PointerEventType = exports.RecordType = exports.WireframeType = exports.MobileSource = exports.MobileIncrementalSource = exports.PlaybackState = exports.MediaInteractionType = exports.MouseInteractionType = exports.BrowserIncrementalSource = exports.NodeType = exports.BrowserChangeType = exports.BrowserSource = void 0;
__exportStar(require("../generated/sessionReplay"), exports);
var session_replay_browser_1 = require("./session-replay-browser");
Object.defineProperty(exports, "BrowserSource", { enumerable: true, get: function () { return session_replay_browser_1.BrowserSource; } });
Object.defineProperty(exports, "BrowserChangeType", { enumerable: true, get: function () { return session_replay_browser_1.ChangeType; } });
Object.defineProperty(exports, "NodeType", { enumerable: true, get: function () { return session_replay_browser_1.NodeType; } });
Object.defineProperty(exports, "BrowserIncrementalSource", { enumerable: true, get: function () { return session_replay_browser_1.IncrementalSource; } });
Object.defineProperty(exports, "MouseInteractionType", { enumerable: true, get: function () { return session_replay_browser_1.MouseInteractionType; } });
Object.defineProperty(exports, "MediaInteractionType", { enumerable: true, get: function () { return session_replay_browser_1.MediaInteractionType; } });
Object.defineProperty(exports, "PlaybackState", { enumerable: true, get: function () { return session_replay_browser_1.PlaybackState; } });
var session_replay_mobile_1 = require("./session-replay-mobile");
Object.defineProperty(exports, "MobileIncrementalSource", { enumerable: true, get: function () { return session_replay_mobile_1.IncrementalSource; } });
Object.defineProperty(exports, "MobileSource", { enumerable: true, get: function () { return session_replay_mobile_1.MobileSource; } });
Expand All @@ -36,6 +38,7 @@ exports.RecordType = {
FrustrationRecord: 9,
MobileFullSnapshot: 10,
MobileIncrementalSnapshot: 11,
BrowserChange: 12,
};
exports.PointerEventType = {
PointerDown: 'down',
Expand Down
21 changes: 21 additions & 0 deletions lib/esm/src/session-replay-browser.d.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -15,6 +15,7 @@ export declare const RecordType: {
ViewEnd: SessionReplay.ViewEndRecord['type'];
VisualViewport: SessionReplay.VisualViewportRecord['type'];
FrustrationRecord: SessionReplay.FrustrationRecord['type'];
Change: SessionReplay.BrowserChangeRecord['type'];
};
export declare type RecordType = typeof RecordType[keyof typeof RecordType];
export declare const NodeType: {
Expand Down Expand Up @@ -56,3 +57,23 @@ export declare const MediaInteractionType: {
readonly Pause: 1;
};
export declare type MediaInteractionType = typeof MediaInteractionType[keyof typeof MediaInteractionType];
declare type ChangeTypeId<Id, Data> = [Id, ...Data[]] extends SessionReplay.Change ? Id : never;
export declare const ChangeType: {
AddString: ChangeTypeId<0, SessionReplay.AddStringChange>;
AddNode: ChangeTypeId<1, SessionReplay.AddNodeChange>;
RemoveNode: ChangeTypeId<2, SessionReplay.RemoveNodeChange>;
Attribute: ChangeTypeId<3, SessionReplay.AttributeChange>;
Text: ChangeTypeId<4, SessionReplay.TextChange>;
Size: ChangeTypeId<5, SessionReplay.SizeChange>;
ScrollPosition: ChangeTypeId<6, SessionReplay.ScrollPositionChange>;
AddStyleSheet: ChangeTypeId<7, SessionReplay.AddStyleSheetChange>;
AttachedStyleSheets: ChangeTypeId<8, SessionReplay.AttachedStyleSheetsChange>;
MediaPlaybackState: ChangeTypeId<9, SessionReplay.MediaPlaybackStateChange>;
VisualViewport: ChangeTypeId<10, SessionReplay.VisualViewportChange>;
};
export declare type ChangeType = typeof ChangeType[keyof typeof ChangeType];
export declare const PlaybackState: {
Playing: SessionReplay.PlaybackStatePlaying;
Paused: SessionReplay.PlaybackStatePaused;
};
export declare type PlaybackState = typeof PlaybackState[keyof typeof PlaybackState];
18 changes: 18 additions & 0 deletions lib/esm/src/session-replay-browser.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -13,6 +13,7 @@ export var RecordType = {
ViewEnd: 7,
VisualViewport: 8,
FrustrationRecord: 9,
Change: 12,
};
export var NodeType = {
Document: 0,
Expand Down Expand Up @@ -50,3 +51,20 @@ export var MediaInteractionType = {
Play: 0,
Pause: 1,
};
export var ChangeType = {
AddString: 0,
AddNode: 1,
RemoveNode: 2,
Attribute: 3,
Text: 4,
Size: 5,
ScrollPosition: 6,
AddStyleSheet: 7,
AttachedStyleSheets: 8,
MediaPlaybackState: 9,
VisualViewport: 10,
};
export var PlaybackState = {
Playing: 0,
Paused: 1,
};
12 changes: 11 additions & 1 deletion lib/esm/src/session-replay.d.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
import type { IncrementalSource as BrowserIncrementalSource, RecordType as BrowserRecordType } from './session-replay-browser';
import type { IncrementalSource as MobileIncrementalSource, RecordType as MobileRecordType } from './session-replay-mobile';
export * from '../generated/sessionReplay';
export { BrowserSource, NodeType, IncrementalSource as BrowserIncrementalSource, MouseInteractionType, MediaInteractionType, } from './session-replay-browser';
export { BrowserSource, ChangeType as BrowserChangeType, NodeType, IncrementalSource as BrowserIncrementalSource, MouseInteractionType, MediaInteractionType, PlaybackState, } from './session-replay-browser';
export { IncrementalSource as MobileIncrementalSource, MobileSource, WireframeType } from './session-replay-mobile';
export declare const RecordType: {
BrowserFullSnapshot: typeof BrowserRecordType.FullSnapshot;
Expand All @@ -13,6 +13,7 @@ export declare const RecordType: {
FrustrationRecord: typeof BrowserRecordType.FrustrationRecord;
MobileFullSnapshot: typeof MobileRecordType.FullSnapshot;
MobileIncrementalSnapshot: typeof MobileRecordType.IncrementalSnapshot;
BrowserChange: typeof BrowserRecordType.Change;
};
export declare type RecordType = typeof RecordType[keyof typeof RecordType];
export declare type IncrementalSource = BrowserIncrementalSource | MobileIncrementalSource;
Expand All @@ -28,3 +29,12 @@ export declare const PointerType: {
readonly Pen: "pen";
};
export declare type PointerType = typeof PointerType[keyof typeof PointerType];
export declare type NodeId = number & {
__brand: 'NodeId';
};
export declare type StringId = number & {
__brand: 'StringId';
};
export declare type StyleSheetId = number & {
__brand: 'StyleSheetId';
};
3 changes: 2 additions & 1 deletion lib/esm/src/session-replay.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
export * from '../generated/sessionReplay';
export { BrowserSource, NodeType, IncrementalSource as BrowserIncrementalSource, MouseInteractionType, MediaInteractionType, } from './session-replay-browser';
export { BrowserSource, ChangeType as BrowserChangeType, NodeType, IncrementalSource as BrowserIncrementalSource, MouseInteractionType, MediaInteractionType, PlaybackState, } from './session-replay-browser';
export { IncrementalSource as MobileIncrementalSource, MobileSource, WireframeType } from './session-replay-mobile';
export var RecordType = {
BrowserFullSnapshot: 2,
Expand All @@ -11,6 +11,7 @@ export var RecordType = {
FrustrationRecord: 9,
MobileFullSnapshot: 10,
MobileIncrementalSnapshot: 11,
BrowserChange: 12,
};
export var PointerEventType = {
PointerDown: 'down',
Expand Down
44 changes: 44 additions & 0 deletions lib/src/session-replay-browser.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -19,6 +19,7 @@ export const RecordType: {
ViewEnd: SessionReplay.ViewEndRecord['type']
VisualViewport: SessionReplay.VisualViewportRecord['type']
FrustrationRecord: SessionReplay.FrustrationRecord['type']
Change: SessionReplay.BrowserChangeRecord['type']
} = {
FullSnapshot: 2,
IncrementalSnapshot: 3,
Expand All @@ -27,6 +28,7 @@ export const RecordType: {
ViewEnd: 7,
VisualViewport: 8,
FrustrationRecord: 9,
Change: 12,
} as const

export type RecordType = typeof RecordType[keyof typeof RecordType]
Expand Down Expand Up @@ -96,3 +98,45 @@ export const MediaInteractionType = {
} as const

export type MediaInteractionType = typeof MediaInteractionType[keyof typeof MediaInteractionType]

// ChangeTypeId evaluates to Id if [Id, ...Data[]] is a valid variant of Change;
// otherwise, it triggers a compile-time error.
type ChangeTypeId<Id, Data> = [Id, ...Data[]] extends SessionReplay.Change ? Id : never

export const ChangeType: {
AddString: ChangeTypeId<0, SessionReplay.AddStringChange>
AddNode: ChangeTypeId<1, SessionReplay.AddNodeChange>
RemoveNode: ChangeTypeId<2, SessionReplay.RemoveNodeChange>
Attribute: ChangeTypeId<3, SessionReplay.AttributeChange>
Text: ChangeTypeId<4, SessionReplay.TextChange>
Size: ChangeTypeId<5, SessionReplay.SizeChange>
ScrollPosition: ChangeTypeId<6, SessionReplay.ScrollPositionChange>
AddStyleSheet: ChangeTypeId<7, SessionReplay.AddStyleSheetChange>
AttachedStyleSheets: ChangeTypeId<8, SessionReplay.AttachedStyleSheetsChange>
MediaPlaybackState: ChangeTypeId<9, SessionReplay.MediaPlaybackStateChange>
VisualViewport: ChangeTypeId<10, SessionReplay.VisualViewportChange>
} = {
AddString: 0,
AddNode: 1,
RemoveNode: 2,
Attribute: 3,
Text: 4,
Size: 5,
ScrollPosition: 6,
AddStyleSheet: 7,
AttachedStyleSheets: 8,
MediaPlaybackState: 9,
VisualViewport: 10,
} as const

export type ChangeType = typeof ChangeType[keyof typeof ChangeType]

export const PlaybackState: {
Playing: SessionReplay.PlaybackStatePlaying
Paused: SessionReplay.PlaybackStatePaused
} = {
Playing: 0,
Paused: 1,
} as const

export type PlaybackState = typeof PlaybackState[keyof typeof PlaybackState]
8 changes: 8 additions & 0 deletions lib/src/session-replay.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -11,10 +11,12 @@ export * from '../generated/sessionReplay'

export {
BrowserSource,
ChangeType as BrowserChangeType,
NodeType,
IncrementalSource as BrowserIncrementalSource,
MouseInteractionType,
MediaInteractionType,
PlaybackState,
} from './session-replay-browser'
export { IncrementalSource as MobileIncrementalSource, MobileSource, WireframeType } from './session-replay-mobile'

Expand All @@ -28,6 +30,7 @@ export const RecordType: {
FrustrationRecord: typeof BrowserRecordType.FrustrationRecord
MobileFullSnapshot: typeof MobileRecordType.FullSnapshot
MobileIncrementalSnapshot: typeof MobileRecordType.IncrementalSnapshot
BrowserChange: typeof BrowserRecordType.Change
} = {
BrowserFullSnapshot: 2,
BrowserIncrementalSnapshot: 3,
Expand All @@ -38,6 +41,7 @@ export const RecordType: {
FrustrationRecord: 9,
MobileFullSnapshot: 10,
MobileIncrementalSnapshot: 11,
BrowserChange: 12,
} as const

export type RecordType = typeof RecordType[keyof typeof RecordType]
Expand All @@ -59,3 +63,7 @@ export const PointerType = {
} as const

export type PointerType = typeof PointerType[keyof typeof PointerType]

export type NodeId = number & { __brand: 'NodeId' }
export type StringId = number & { __brand: 'StringId' }
export type StyleSheetId = number & { __brand: 'StyleSheetId' }
Loading