Skip to content

Replay

CurrentReplaySessionChangeEvent

CurrentReplaySessionChangeEvent = object

Event fired when the current replay session changes.

Properties

sessionId

sessionId: ID | undefined

The ID of the newly selected session, or undefined if no session is selected.


OpenTabOptions

OpenTabOptions = object

Options for opening a tab.

Properties

select?

optional select: boolean

Whether to select the tab after opening it. Defaults to true.


ReplayCollection

ReplayCollection = object

A collection in Replay.

Properties

id

id: ID

The ID of the collection.

name

name: string

The name of the collection.

sessionIds

sessionIds: ID[]

The sessions in the collection.


ReplayCollectionCreatedEvent

ReplayCollectionCreatedEvent = object

Event fired when a replay collection is created.

Properties

collection

collection: ReplayCollection

The newly created replay collection.


ReplayEntry

ReplayEntry = object

A replay entry.

Properties

id

id: ID

The ID of the entry.

requestId?

optional requestId: ID

The ID of the request associated with this entry, if any.

sessionId

sessionId: ID

The ID of the session this entry belongs to.


ReplaySDK

ReplaySDK = object

Utilities to interact with Replay.

Properties

addRequestEditorExtension()

addRequestEditorExtension: (extension: Extension) => void

Add an extension to the request editor.

Parameters
ParameterTypeDescription
extensionExtensionThe extension to add.
Returns

void

addRequestViewMode()

addRequestViewMode: (options: RequestViewModeOptions) => void

Add a custom view mode for requests.

Parameters
ParameterTypeDescription
optionsRequestViewModeOptionsThe view mode options.
Returns

void

addToSlot

addToSlot: DefineAddToSlotFn<ReplaySlotContent>

Add a component to a slot.

Param

The slot to add the component to.

Param

The content to add to the slot.

Example
ts
addToSlot(ReplaySlot.SessionToolbarPrimary, {
  kind: "Command",
  commandId: "my-command",
  icon: "my-icon",
});

addToSlot(ReplaySlot.SessionToolbarSecondary, {
  kind: "Custom",
  component: MyComponent,
});

addToSlot(ReplaySlot.Topbar, {
  kind: "Button",
  label: "My Button",
  icon: "my-icon",
  onClick: () => {
    console.log("Button clicked");
  },
});
closeTab()

closeTab: (sessionId: ID) => void

Close a replay tab for the given session.

Parameters
ParameterTypeDescription
sessionIdIDThe ID of the session to close.
Returns

void

createCollection()

createCollection: (name: string) => Promise<ReplayCollection>

Create a new collection.

Parameters
ParameterTypeDescription
namestringThe name of the collection to create.
Returns

Promise<ReplayCollection>

createSession()

createSession: (source: RequestSource, collectionId?: ID) => Promise<void>

Create a session.

Parameters
ParameterTypeDescription
sourceRequestSource-
collectionId?IDThe ID of the collection to add the request.
Returns

Promise<void>

deleteCollection()

deleteCollection: (id: ID) => Promise<boolean>

Delete a collection.

Parameters
ParameterTypeDescription
idIDThe ID of the collection to delete.
Returns

Promise<boolean>

Whether the collection was deleted.

deleteSessions()

deleteSessions: (sessionIds: ID[]) => Promise<ID[]>

Delete a session.

Parameters
ParameterTypeDescription
sessionIdsID[]The IDs of the sessions to delete.
Returns

Promise<ID[]>

getCollections()

getCollections: () => ReplayCollection[]

Get the list of all replay collections.

Returns

ReplayCollection[]

The list of all replay collections.

getCurrentSession()

getCurrentSession: () => ReplaySession | undefined

Get the currently selected replay session.

Returns

ReplaySession | undefined

The currently selected replay session, or undefined if no session is selected.

Example
ts
const currentSession = sdk.replay.getCurrentSession();
if (currentSession) {
  console.log(`Current session: ${currentSession.name}`);
} else {
  console.log("No session is currently selected");
}
getEntry()

getEntry: (entryId: ID) => ReplayEntry

Get a replay entry by its ID.

Parameters
ParameterTypeDescription
entryIdIDThe ID of the entry to get.
Returns

ReplayEntry

The replay entry.

Example
ts
const entry = await sdk.replay.getEntry(entryId);
console.log(entry.id, entry.sessionId, entry.requestId);
getSessions()

getSessions: () => ReplaySession[]

Get the list of all replay sessions.

Returns

ReplaySession[]

The list of all replay sessions.

getTabs()

getTabs: () => ReplayTab[]

Get the list of all open replay tabs.

Returns

ReplayTab[]

The list of all open replay tabs.

moveSession()

moveSession: (sessionId: ID, collectionId: ID) => Promise<ReplaySession>

Move a session to a different collection.

Parameters
ParameterTypeDescription
sessionIdIDThe ID of the session to move.
collectionIdIDThe ID of the collection to move the session to.
Returns

Promise<ReplaySession>

The updated session.

onCollectionCreate()

onCollectionCreate: (callback: (event: ReplayCollectionCreatedEvent) => void) => ListenerHandle

Subscribe to replay collection creation events.

Parameters
ParameterTypeDescription
callback(event: ReplayCollectionCreatedEvent) => voidThe callback to call when a collection is created.
Returns

ListenerHandle

An object with a stop method that can be called to stop listening to collection creation events.

Example
ts
const handler = sdk.replay.onCollectionCreate((event) => {
  console.log(`Collection ${event.collection.id} was created!`);
});

// Later, stop listening
handler.stop();
onCurrentSessionChange()

onCurrentSessionChange: (callback: (event: CurrentReplaySessionChangeEvent) => void) => ListenerHandle

Subscribe to current replay session changes.

Parameters
ParameterTypeDescription
callback(event: CurrentReplaySessionChangeEvent) => voidThe callback to call when the selected session changes.
Returns

ListenerHandle

An object with a stop method that can be called to stop listening to session changes.

Example
ts
const handler = sdk.replay.onCurrentSessionChange((event) => {
  console.log(`Session ${event.sessionId} got selected!`);
});

// Later, stop listening
handler.stop();
onSessionCreate()

onSessionCreate: (callback: (event: ReplaySessionCreatedEvent) => void) => ListenerHandle

Subscribe to replay session creation events.

Parameters
ParameterTypeDescription
callback(event: ReplaySessionCreatedEvent) => voidThe callback to call when a session is created.
Returns

ListenerHandle

An object with a stop method that can be called to stop listening to session creation events.

Example
ts
const handler = sdk.replay.onSessionCreate((event) => {
  console.log(`Session ${event.session.id} was created!`);
});

// Later, stop listening
handler.stop();
openTab()

openTab: (sessionId: ID, options?: OpenTabOptions) => void

Open a replay tab for the given session.

Parameters
ParameterTypeDescription
sessionIdIDThe ID of the session to open.
options?OpenTabOptionsThe options for opening the tab.
Returns

void

renameCollection()

renameCollection: (id: ID, name: string) => Promise<ReplayCollection>

Rename a collection.

Parameters
ParameterTypeDescription
idIDThe ID of the collection to rename.
namestringThe new name of the collection.
Returns

Promise<ReplayCollection>

The updated collection.

renameSession()

renameSession: (id: ID, name: string) => Promise<ReplaySession>

Rename a session.

Parameters
ParameterTypeDescription
idIDThe ID of the session to rename.
namestringThe new name of the session.
Returns

Promise<ReplaySession>

The updated session.

sendRequest()

sendRequest: (sessionId: ID, options: SendRequestOptions) => Promise<void>

Send a request to the Replay backend.

Parameters
ParameterTypeDescription
sessionIdID-
optionsSendRequestOptionsThe options for sending the request.
Returns

Promise<void>

Example
ts
sendRequest(sessionId, {
  connectionInfo: {
    SNI: "example.com",
    host: "example.com",
    isTLS: true,
    port: 443,
  },
  raw: "GET / HTTP/1.1\r\nHost: example.com\r\n\r\n",
  updateContentLength: false,
});
showEntry()

showEntry: (sessionId: ID, entryId: ID, options?: object) => Promise<void>

Show a specific entry in a replay session. This will open the session tab if not already open, set it as the selected session, and display the specified entry.

Parameters
ParameterTypeDescription
sessionIdIDThe ID of the session containing the entry.
entryIdIDThe ID of the entry to show.
options?{ overwriteDraft?: boolean; }The options for showing the entry.
options.overwriteDraft?booleanWhether to overwrite the request draft. If true, the draft will be removed and the entry's raw request will be shown. If false, the draft will be kept.
Returns

Promise<void>

Example
ts
await sdk.replay.showEntry(sessionId, entryId, {
  overwriteDraft: true,
});

ReplaySession

ReplaySession = object

A session in Replay.

Properties

collectionId

collectionId: ID

The ID of the collection the session belongs to.

entryIds

entryIds: ID[]

The IDs of all entries in this session.

id

id: ID

The ID of the session.

name

name: string

The name of the session.


ReplaySessionCreatedEvent

ReplaySessionCreatedEvent = object

Event fired when a replay session is created.

Properties

session

session: ReplaySession

The newly created replay session.


ReplayTab

ReplayTab = object

A replay tab.

Properties

sessionId

sessionId: ID

The ID of the session associated with this tab.


RequestSource

RequestSource = { connectionInfo: SendRequestOptions["connectionInfo"]; raw: string; type: "Raw"; } | { id: string; type: "ID"; }

Remarks

This type is a discriminated union with two possible shapes:

  • A raw request, containing the raw HTTP request string and connection information.
  • A reference to an existing request ID.

Example

ts
// Using a raw request
const source: RequestSource = {
  type: "Raw",
  raw: "GET /api/data HTTP/1.1",
  connectionInfo: { ... }
};
// Using an ID
const source: RequestSource = {
  type: "ID",
  id: "request-123"
};

SendRequestOptions

SendRequestOptions = object

Options for sending a request.

Properties

background?

optional background: boolean

Whether to send the request in the background without updating the UI. If true, the request will not update the UI. If false, the UI will be updated to display the session and the new request. Defaults to false.

connectionClose?

optional connectionClose: boolean

Whether to force close the connection by setting Connection: close header. Defaults to true.

connectionInfo

connectionInfo: object

The connection information to use for the request.

host

host: string

The host to use for the request.

isTLS

isTLS: boolean

Whether the request is TLS.

port

port: number

The port to use for the request.

SNI?

optional SNI: string

The SNI to use for the request. If not provided, the SNI will be inferred from the host.

overwriteDraft?

optional overwriteDraft: boolean

Whether to overwrite the editor's draft content. If true, draft content will be overwritten with the new request. If false, the draft will be kept. Defaults to true.

raw

raw: string

The raw request to send.

updateContentLength?

optional updateContentLength: boolean

Whether to update the content length automatically to match the body. Defaults to true.


ReplaySlot

const ReplaySlot: object

The slots in the Replay UI.

Type Declaration

SessionToolbarPrimary

readonly SessionToolbarPrimary: "session-toolbar-primary"

The left side of the session toolbar.

SessionToolbarSecondary

readonly SessionToolbarSecondary: "session-toolbar-secondary"

The right side of the session toolbar.

Topbar

readonly Topbar: "topbar"

The left side of the topbar.