• Version 8.19.0
  • Published
  • 956 kB
  • 7 dependencies
  • MIT license


npm i @sentry/browser
yarn add @sentry/browser
pnpm add @sentry/browser


Official Sentry SDK for browsers



variable chromeStackLineParser

const chromeStackLineParser: StackLineParser;

    variable defaultRequestInstrumentationOptions

    const defaultRequestInstrumentationOptions: RequestInstrumentationOptions;

      variable defaultStackLineParsers

      const defaultStackLineParsers: StackLineParser[];

        variable defaultStackParser

        const defaultStackParser: any;

          variable feedbackAsyncIntegration

          const feedbackAsyncIntegration: any;
          • An integration to add user feedback to your application, while loading most of the code lazily only when it's needed.

          variable feedbackIntegration

          const feedbackIntegration: any;
          • Add a widget to capture user feedback to your application.

          variable feedbackSyncIntegration

          const feedbackSyncIntegration: any;
          • Add a widget to capture user feedback to your application.

          variable geckoStackLineParser

          const geckoStackLineParser: StackLineParser;

            variable metrics

            const metrics: Metrics;

              variable opera10StackLineParser

              const opera10StackLineParser: StackLineParser;

                variable opera11StackLineParser

                const opera11StackLineParser: StackLineParser;

                  variable WINDOW

                  const WINDOW: any;

                    variable winjsStackLineParser

                    const winjsStackLineParser: StackLineParser;


                      breadcrumbsIntegration: (
                      options?: Partial<BreadcrumbsOptions> | undefined
                      ) => any;

                        function browserApiErrorsIntegration

                        browserApiErrorsIntegration: (
                        options?: Partial<BrowserApiErrorsOptions> | undefined
                        ) => any;
                        • Wrap timer functions and event targets to catch errors and provide better meta data.

                        function browserProfilingIntegration

                        browserProfilingIntegration: () => any;

                          function browserTracingIntegration

                          browserTracingIntegration: (_options?: Partial<BrowserTracingOptions>) => {
                          name: string;
                          afterAllSetup(client: Client<any>): void;
                          • The Browser Tracing integration automatically instruments browser pageload/navigation actions as transactions, and captures requests, metrics and errors as spans.

                            The integration can be configured with a variety of options, and can be extended to use any routing library.

                            We explicitly export the proper type here, as this has to be extended in some cases.

                          function captureUserFeedback

                          captureUserFeedback: (feedback: UserFeedback) => void;
                          • Captures user feedback and sends it to Sentry.


                            Use captureFeedback instead.

                          function contextLinesIntegration

                          contextLinesIntegration: (options?: ContextLinesOptions | undefined) => any;
                          • Collects source context lines around the lines of stackframes pointing to JS embedded in the current page's HTML.

                            This integration DOES NOT work for stack frames pointing to JS files that are loaded by the browser. For frames pointing to files, context lines are added during ingestion and symbolication by attempting to download the JS files to the Sentry backend.

                            Use this integration if you have inline JS code in HTML pages that can't be accessed by our backend (e.g. due to a login-protected page).

                          function createUserFeedbackEnvelope

                          createUserFeedbackEnvelope: (
                          feedback: UserFeedback,
                          }: {
                          metadata: SdkMetadata | undefined;
                          tunnel: string | undefined;
                          dsn: DsnComponents | undefined;
                          ) => EventEnvelope;
                          • Creates an envelope from a user feedback.

                          function eventFromException

                          eventFromException: (
                          stackParser: StackParser,
                          exception: unknown,
                          hint?: EventHint,
                          attachStacktrace?: boolean
                          ) => PromiseLike<Event>;
                          • Creates an Event from all inputs to captureException and non-primitive inputs to captureMessage.

                          function eventFromMessage

                          eventFromMessage: (
                          stackParser: StackParser,
                          message: ParameterizedString,
                          level?: SeverityLevel,
                          hint?: EventHint,
                          attachStacktrace?: boolean
                          ) => PromiseLike<Event>;
                          • Builds and Event from a Message

                          function exceptionFromError

                          exceptionFromError: (stackParser: StackParser, ex: Error) => Exception;
                          • This function creates an exception from a JavaScript Error

                          function forceLoad

                          forceLoad: () => void;
                          • This function is here to be API compatible with the loader.

                          function getDefaultIntegrations

                          getDefaultIntegrations: (_options: Options) => Integration[];
                          • Get the default integrations for the browser SDK.

                          function globalHandlersIntegration

                          globalHandlersIntegration: (
                          options?: Partial<GlobalHandlersIntegrations> | undefined
                          ) => any;

                            function httpClientIntegration

                            httpClientIntegration: (options?: Partial<HttpClientOptions> | undefined) => any;
                            • Create events for failed client side HTTP requests.

                            function httpContextIntegration

                            httpContextIntegration: () => any;
                            • Collects information about HTTP request headers and attaches them to the event.

                            function init

                            init: (browserOptions?: BrowserOptions) => Client | undefined;
                            • The Sentry Browser SDK Client.

                              To use this SDK, call the init function as early as possible when loading the web page. To set context information or send manual events, use the provided methods.

                              Example 1

                              import { init } from '@sentry/browser';
                              dsn: '__DSN__',
                              // ...

                              Example 2

                              import { addBreadcrumb } from '@sentry/browser';
                              message: 'My Breadcrumb',
                              // ...

                              Example 3

                              import * as Sentry from '@sentry/browser';
                              Sentry.captureMessage('Hello, world!');
                              Sentry.captureException(new Error('Good bye'));
                              message: 'Manual',
                              stacktrace: [
                              // ...

                              See Also

                            function instrumentOutgoingRequests

                            instrumentOutgoingRequests: (
                            _options?: Partial<RequestInstrumentationOptions>
                            ) => void;
                            • Registers span creators for xhr and fetch requests

                            function lazyLoadIntegration

                            lazyLoadIntegration: (
                            name: keyof typeof LazyLoadableIntegrations
                            ) => Promise<IntegrationFn>;
                            • Lazy load an integration from the CDN. Rejects if the integration cannot be loaded.

                            function linkedErrorsIntegration

                            linkedErrorsIntegration: (options?: LinkedErrorsOptions | undefined) => any;
                            • Aggregrate linked errors in an event.

                            function makeBrowserOfflineTransport

                            makeBrowserOfflineTransport: <T extends BaseTransportOptions>(
                            createTransport?: (options: T) => Transport
                            ) => (options: T & BrowserOfflineTransportOptions) => Transport;
                            • Creates a transport that uses IndexedDb to store events when offline.

                            function makeFetchTransport

                            makeFetchTransport: (
                            options: BrowserTransportOptions,
                            nativeFetch?: typeof WINDOW.fetch | undefined
                            ) => Transport;
                            • Creates a Transport that uses the Fetch API to send events to Sentry.

                            function onLoad

                            onLoad: (callback: () => void) => void;
                            • This function is here to be API compatible with the loader.

                            function reportingObserverIntegration

                            reportingObserverIntegration: (
                            options?: ReportingObserverOptions | undefined
                            ) => any;
                            • Reporting API integration - https://w3c.github.io/reporting/

                            function showReportDialog

                            showReportDialog: (options?: ReportDialogOptions) => void;
                            • Present the user with a report dialog.

                              Parameter options

                              Everything is optional, we try to fetch all info need from the global scope.

                            function startBrowserTracingNavigationSpan

                            startBrowserTracingNavigationSpan: (
                            client: Client,
                            spanOptions: StartSpanOptions
                            ) => Span | undefined;
                            • Manually start a navigation span. This will only do something if a browser tracing integration has been setup.

                            function startBrowserTracingPageLoadSpan

                            startBrowserTracingPageLoadSpan: (
                            client: Client,
                            spanOptions: StartSpanOptions,
                            traceOptions?: { sentryTrace?: string | undefined; baggage?: string | undefined }
                            ) => Span | undefined;
                            • Manually start a page load span. This will only do something if a browser tracing integration integration has been setup.

                              If you provide a custom traceOptions object, it will be used to continue the trace instead of the default behavior, which is to look it up on the tags.


                            class BrowserClient

                            class BrowserClient extends BaseClient<BrowserClientOptions> {}
                            • The Sentry Browser SDK Client.

                              See Also

                              • BrowserOptions for documentation on configuration options.

                              • SentryClient for usage documentation.


                            constructor(options: any);
                            • Creates a new Browser SDK instance.

                              Parameter options

                              Configuration options for this SDK.

                            method captureUserFeedback

                            captureUserFeedback: (feedback: UserFeedback) => void;
                            • Sends user feedback to Sentry.


                              Use captureFeedback instead.

                            method eventFromException

                            eventFromException: (exception: unknown, hint?: EventHint) => PromiseLike<Event>;

                            method eventFromMessage

                            eventFromMessage: (
                            message: ParameterizedString,
                            level?: SeverityLevel,
                            hint?: EventHint
                            ) => PromiseLike<Event>;


                            interface ReportDialogOptions

                            interface ReportDialogOptions {}
                            • All properties the report dialog supports

                            property dsn

                            dsn?: DsnLike;

                              property errorFormEntry

                              errorFormEntry?: string;

                                property errorGeneric

                                errorGeneric?: string;

                                  property eventId

                                  eventId?: string;

                                    property labelClose

                                    labelClose?: string;

                                      property labelComments

                                      labelComments?: string;

                                        property labelEmail

                                        labelEmail?: string;

                                          property labelName

                                          labelName?: string;

                                            property labelSubmit

                                            labelSubmit?: string;

                                              property lang

                                              lang?: string;

                                                property subtitle

                                                subtitle?: string;

                                                  property subtitle2

                                                  subtitle2?: string;

                                                    property successMessage

                                                    successMessage?: string;

                                                      property title

                                                      title?: string;

                                                        property user

                                                        user?: {
                                                        email?: string;
                                                        name?: string;

                                                          method onClose

                                                          onClose: (this: void) => void;
                                                          • Callback after reportDialog closed

                                                          method onLoad

                                                          onLoad: (this: void) => void;
                                                          • Callback after reportDialog showed up

                                                          index signature

                                                          [key: string]: any;

                                                            interface RequestInstrumentationOptions

                                                            interface RequestInstrumentationOptions {}
                                                            • Options for Request Instrumentation

                                                            property enableHTTPTimings

                                                            enableHTTPTimings: boolean;
                                                            • If true, Sentry will capture http timings and add them to the corresponding http spans.

                                                              Default: true

                                                            property traceFetch

                                                            traceFetch: boolean;
                                                            • Flag to disable patching all together for fetch requests.

                                                              Default: true

                                                            property tracePropagationTargets

                                                            tracePropagationTargets?: Array<string | RegExp>;
                                                            • List of strings and/or Regular Expressions used to determine which outgoing requests will have sentry-trace and baggage headers attached.

                                                              **Default:** If this option is not provided, tracing headers will be attached to all outgoing requests. If you are using a browser SDK, by default, tracing headers will only be attached to outgoing requests to the same origin.

                                                              **Disclaimer:** Carelessly setting this option in browser environments may result into CORS errors! Only attach tracing headers to requests to the same origin, or to requests to services you can control CORS headers of. Cross-origin requests, meaning requests to a different domain, for example a request to https://api.example.com/ while you're on https://example.com/, take special care. If you are attaching headers to cross-origin requests, make sure the backend handling the request returns a "Access-Control-Allow-Headers: sentry-trace, baggage" header to ensure your requests aren't blocked.

                                                              If you provide a tracePropagationTargets array, the entries you provide will be matched against the entire URL of the outgoing request. If you are using a browser SDK, the entries will also be matched against the pathname of the outgoing requests. This is so you can have matchers for relative requests, for example, /^\/api/ if you want to trace requests to your /api routes on the same domain.

                                                              If any of the two match any of the provided values, tracing headers will be attached to the outgoing request. Both, the string values, and the RegExes you provide in the array will match if they partially match the URL or pathname.

                                                              Examples: - tracePropagationTargets: [/^\/api/] and request to https://same-origin.com/api/posts: - Tracing headers will be attached because the request is sent to the same origin and the regex matches the pathname "/api/posts". - tracePropagationTargets: [/^\/api/] and request to https://different-origin.com/api/posts: - Tracing headers will not be attached because the pathname will only be compared when the request target lives on the same origin. - tracePropagationTargets: [/^\/api/, 'https://external-api.com'] and request to https://external-api.com/v1/data: - Tracing headers will be attached because the request URL matches the string 'https://external-api.com'.

                                                            property traceXHR

                                                            traceXHR: boolean;
                                                            • Flag to disable patching all together for xhr requests.

                                                              Default: true

                                                            method shouldCreateSpanForRequest

                                                            shouldCreateSpanForRequest: (this: void, url: string) => boolean;
                                                            • This function will be called before creating a span for a request with the given url. Return false if you don't want a span for the given url.

                                                              Default: (url: string) => true

                                                            Type Aliases

                                                            type BrowserOptions

                                                            type BrowserOptions = Options<BrowserTransportOptions> &
                                                            BrowserClientReplayOptions &
                                                            • Configuration options for the Sentry Browser SDK.

                                                              See Also

                                                              • @sentry/types Options for more information.

                                                            Package Files (24)

                                                            Dependencies (7)

                                                            Dev Dependencies (2)

                                                            Peer Dependencies (0)

                                                            No peer dependencies.


                                                            To add a badge like this onejsDocs.io badgeto your package's README, use the codes available below.

                                                            You may also use Shields.io to create a custom badge linking to https://www.jsdocs.io/package/@sentry/browser.

                                                            • Markdown
                                                            • HTML
                                                              <a href="https://www.jsdocs.io/package/@sentry/browser"><img src="https://img.shields.io/badge/jsDocs.io-reference-blue" alt="jsDocs.io"></a>