CtrlK
BlogDocsLog inGet started
Tessl Logo

tessl/npm-sentry--browser

Official Sentry SDK for browsers providing comprehensive error monitoring, performance tracking, user feedback collection, and session management capabilities for client-side JavaScript applications.

Pending
Overview
Eval results
Files

sdk-initialization.mddocs/

SDK Initialization

Core SDK setup and configuration management for browser environments. The Sentry Browser SDK provides comprehensive initialization options for error monitoring, performance tracking, and session management.

Capabilities

Main Initialization Function

Initialize the Sentry SDK with comprehensive configuration options.

/**
 * Initialize the Sentry Browser SDK
 * @param options - Configuration options for the SDK
 * @returns Client instance or undefined if initialization fails
 */
function init(options?: BrowserOptions): Client | undefined;

Usage Example:

import * as Sentry from "@sentry/browser";

Sentry.init({
  dsn: "https://examplePublicKey@o0.ingest.sentry.io/0",
  debug: true,
  environment: "production",
  release: "1.0.0",
  sampleRate: 1.0,
  tracesSampleRate: 0.1,
  integrations: [
    Sentry.browserTracingIntegration(),
    Sentry.replayIntegration({
      sessionSampleRate: 0.1,
      errorSampleRate: 1.0,
    }),
  ],
  beforeSend(event, hint) {
    // Filter out noisy errors
    if (event.exception) {
      const error = hint.originalException;
      if (error && error.message && error.message.includes("Script error")) {
        return null;
      }
    }
    return event;
  },
});

Client Management

Manage the active Sentry client instance.

/**
 * Get the current active client
 * @returns Current client instance or undefined
 */
function getClient(): Client | undefined;

/**
 * Set the current client
 * @param client - Client instance to set as current
 */
function setCurrentClient(client: Client): void;

/**
 * Check if the SDK has been initialized
 * @returns True if SDK is initialized
 */
function isInitialized(): boolean;

/**
 * Check if the SDK is enabled and will capture events
 * @returns True if SDK is enabled
 */
function isEnabled(): boolean;

Compatibility Functions

API compatibility functions for loader integration.

/**
 * Force load the SDK (no-op for browser)
 */
function forceLoad(): void;

/**
 * Execute callback when SDK is loaded
 * @param callback - Function to execute
 */
function onLoad(callback: () => void): void;

Default Integrations

Get the default integrations for browser environments.

/**
 * Get default integrations for the browser SDK
 * @param options - Configuration options
 * @returns Array of default integrations
 */
function getDefaultIntegrations(options: Options): Integration[];

Configuration Types

Browser Options

interface BrowserOptions extends CoreOptions<BrowserTransportOptions> {
  /** Data Source Name - URL for sending events to Sentry */
  dsn?: string;
  
  /** Enable debug mode for detailed logging */
  debug?: boolean;
  
  /** Environment name (e.g., production, development) */
  environment?: string;
  
  /** Release version identifier */
  release?: string;
  
  /** Sample rate for error events (0.0 to 1.0) */
  sampleRate?: number;
  
  /** Sample rate for performance traces (0.0 to 1.0) */
  tracesSampleRate?: number;
  
  /** Sample rate for profiling (0.0 to 1.0) */
  profilesSampleRate?: number;
  
  /** Maximum number of breadcrumbs to keep */
  maxBreadcrumbs?: number;
  
  /** Attach stack traces to captured messages */
  attachStacktrace?: boolean;
  
  /** Send default PII (personally identifiable information) */
  sendDefaultPii?: boolean;
  
  /** Skip browser extension detection check */
  skipBrowserExtensionCheck?: boolean;
  
  /** Propagate W3C traceparent header in addition to sentry-trace */
  propagateTraceparent?: boolean;
  
  /** Base URL for lazy loading integrations */
  cdnBaseUrl?: string;
  
  /** Array of integrations to install */
  integrations?: Integration[];
  
  /** Default integrations (null to disable all) */
  defaultIntegrations?: Integration[] | null;
  
  /** Event filtering function called before sending */
  beforeSend?: (event: Event, hint: EventHint) => Event | null | PromiseLike<Event | null>;
  
  /** Breadcrumb filtering function */
  beforeBreadcrumb?: (breadcrumb: Breadcrumb, hint?: BreadcrumbHint) => Breadcrumb | null;
  
  /** Custom transport function */
  transport?: (options: BrowserTransportOptions) => Transport;
  
  /** Stack parser for processing error stack traces */
  stackParser?: StackParser;
  
  /** Tags to be applied to all events */
  initialScope?: {
    tags?: { [key: string]: Primitive };
    user?: User;
    level?: SeverityLevel;
    fingerprint?: string[];
  };
}

Browser Client

/**
 * The Sentry Browser SDK Client class
 */
class BrowserClient extends Client<BrowserClientOptions> {
  /**
   * Creates a new Browser SDK client instance
   * @param options - Configuration options for this client
   */
  constructor(options: BrowserClientOptions);
  
  /**
   * Create an event from an exception
   * @param exception - The exception to convert
   * @param hint - Additional event hint information
   * @returns Promise resolving to the created event
   */
  eventFromException(exception: unknown, hint?: EventHint): PromiseLike<Event>;
  
  /**
   * Create an event from a message
   * @param message - The message to convert
   * @param level - Severity level
   * @param hint - Additional event hint information
   * @returns Promise resolving to the created event
   */
  eventFromMessage(
    message: ParameterizedString,
    level?: SeverityLevel,
    hint?: EventHint
  ): PromiseLike<Event>;
}

Transport Options

interface BrowserTransportOptions extends BaseTransportOptions {
  /** Fetch API init parameters */
  fetchOptions?: RequestInit;
  
  /** Custom headers for the transport */
  headers?: { [key: string]: string };
}

Default Integration List

The browser SDK includes these integrations by default:

  • inboundFiltersIntegration - Filters unwanted events and exceptions
  • functionToStringIntegration - Preserves function names in stack traces
  • browserApiErrorsIntegration - Captures browser API errors
  • breadcrumbsIntegration - Automatic breadcrumb collection
  • globalHandlersIntegration - Global error and unhandled promise handlers
  • linkedErrorsIntegration - Captures linked/caused-by errors
  • dedupeIntegration - Prevents duplicate events
  • httpContextIntegration - Adds HTTP request context
  • browserSessionIntegration - Session tracking

Environment Detection

The SDK automatically detects browser extension environments and warns against improper usage. Use skipBrowserExtensionCheck: true to bypass this check if it incorrectly flags your setup.

Error Handling

If initialization fails due to invalid configuration or browser extension detection, the function returns undefined and logs appropriate warnings to the console.

Install with Tessl CLI

npx tessl i tessl/npm-sentry--browser

docs

context-management.md

error-capture.md

index.md

integrations.md

performance-monitoring.md

sdk-initialization.md

session-management.md

session-replay.md

transport.md

user-feedback.md

tile.json