Merge pull request #7389 from getsentry/prepare-release/7.42.0

meta(changelog): Update changelog for 7.42.0

Author: AbhiPrasad

.craft.yml

@@ -22,6 +22,7 @@ targets:
   - name: github
     includeNames: /^sentry-.*$/
   - name: npm
+    excludeNames: /^sentry-sveltekit-.*$/
   - name: registry
     sdks:
       'npm:@sentry/browser':

CHANGELOG.md

@@ -4,6 +4,31 @@
 
 - "You miss 100 percent of the chances you don't take. — Wayne Gretzky" — Michael Scott
 
+## 7.42.0
+
+- feat(core): Add lifecycle hooks (#7370)
+- feat(core): Emit hooks for transaction start/finish (#7387)
+- feat(nextjs): Connect traces for server components (#7320)
+- feat(replay): Attach an error `cause` to send exceptions (#7350)
+- feat(replay): Consider user input in form field as "user activity" (#7355)
+- feat(replay): Update rrweb to 1.105.0 & add breadcrumb when encountering large mutation (#7314)
+- feat(tracing): Expose cancelIdleTimeout and add option to make it permanent (#7236)
+- feat(tracing): Track PerformanceObserver interactions as spans (#7331)
+- fix(core): Ensure `originalException` has type `unknown` (#7361)
+- fix(core): Avoid using `Object.values()` (#7360)
+- fix(react): Make redux integration be configurable via `normalizeDepth` (#7379)
+- fix(tracing): Record LCP and CLS on transaction finish (#7386)
+- ref(browser): Improve type safety of breadcrumbs integration (#7382)
+- ref(node): Parallelize disk io when reading source files for context lines (#7374)
+- ref(node): Partially remove dynamic `require` calls (#7377)
+
+**Replay `rrweb` changes:**
+
+`@sentry-internal/rrweb` was updated from 1.104.1 to 1.105.0 (#7314):
+
+- feat: Add `onMutation` option to record ([#70](https://github.com/getsentry/rrweb/pull/69))
+- fix: Ensure `<input type='submit' value='Btn text'>` is masked ([#69](https://github.com/getsentry/rrweb/pull/69))
+
 ## 7.41.0
 
 - feat: Ensure we use the same default `environment` everywhere (#7327)

README.md

@@ -52,6 +52,8 @@ package. Please refer to the README and instructions of those SDKs for more deta
   integrations for Express
 - [`@sentry/angular`](https://github.com/getsentry/sentry-javascript/tree/master/packages/angular): Browser SDK with
   Angular integration enabled
+- [`@sentry/angular-ivy`](https://github.com/getsentry/sentry-javascript/tree/master/packages/angular-ivy): Browser SDK with
+  Angular integration enabled including native support for Angular's Ivy rendering engine.
 - [`@sentry/ember`](https://github.com/getsentry/sentry-javascript/tree/master/packages/ember): Browser SDK with Ember
   integration enabled
 - [`@sentry/react`](https://github.com/getsentry/sentry-javascript/tree/master/packages/react): Browser SDK with React

package.json

@@ -58,6 +58,7 @@
     "packages/replay-worker",
     "packages/serverless",
     "packages/svelte",
+    "packages/sveltekit",
     "packages/tracing",
     "packages/types",
     "packages/typescript",

packages/angular-ivy/README.md

@@ -6,16 +6,16 @@
 
 # Official Sentry SDK for Angular with Ivy Compatibility
 
+[![npm version](https://img.shields.io/npm/v/@sentry/angular-ivy.svg)](https://www.npmjs.com/package/@sentry/angular-ivy)
+[![npm dm](https://img.shields.io/npm/dm/@sentry/angular-ivy.svg)](https://www.npmjs.com/package/@sentry/angular-ivy)
+[![npm dt](https://img.shields.io/npm/dt/@sentry/angular-ivy.svg)](https://www.npmjs.com/package/@sentry/angular-ivy)
+
 ## Links
 
 - [Official SDK Docs](https://docs.sentry.io/platforms/javascript/angular/)
 
 ## Angular Version Compatibility
 
-**Note**: This SDK is still experimental and not yet stable.
-We do not yet make guarantees in terms of breaking changes, version compatibilities or semver.
-Please open a Github issue if you experience bugs or would like to share feedback.
-
 This SDK officially supports Angular 12-15 with Angular's new rendering engine, Ivy.
 
 If you're using Angular 10, 11 or a newer Angular version with View Engine instead of Ivy, please use [`@sentry/angular`](https://github.com/getsentry/sentry-javascript/blob/develop/packages/angular/README.md).

packages/angular/README.md

@@ -6,6 +6,10 @@
 
 # Official Sentry SDK for Angular
 
+[![npm version](https://img.shields.io/npm/v/@sentry/angular.svg)](https://www.npmjs.com/package/@sentry/angular)
+[![npm dm](https://img.shields.io/npm/dm/@sentry/angular.svg)](https://www.npmjs.com/package/@sentry/angular)
+[![npm dt](https://img.shields.io/npm/dt/@sentry/angular.svg)](https://www.npmjs.com/package/@sentry/angular)
+
 ## Links
 
 - [Official SDK Docs](https://docs.sentry.io/platforms/javascript/angular/)

packages/browser/src/integrations/breadcrumbs.ts

@@ -1,7 +1,7 @@
 /* eslint-disable @typescript-eslint/no-unsafe-member-access */
 /* eslint-disable max-lines */
 import { getCurrentHub } from '@sentry/core';
-import type { Event, Integration } from '@sentry/types';
+import type { Event as SentryEvent, HandlerDataFetch, Integration, SentryWrappedXMLHttpRequest } from '@sentry/types';
 import {
   addInstrumentationHandler,
   getEventDescription,
@@ -14,6 +14,8 @@ import {
 
 import { WINDOW } from '../helpers';
 
+type HandlerData = Record<string, unknown>;
+
 /** JSDoc */
 interface BreadcrumbsOptions {
   console: boolean;
@@ -99,7 +101,7 @@ export class Breadcrumbs implements Integration {
   /**
    * Adds a breadcrumb for Sentry events or transactions if this option is enabled.
    */
-  public addSentryBreadcrumb(event: Event): void {
+  public addSentryBreadcrumb(event: SentryEvent): void {
     if (this.options.sentry) {
       getCurrentHub().addBreadcrumb(
         {
@@ -120,10 +122,8 @@ export class Breadcrumbs implements Integration {
  * A HOC that creaes a function that creates breadcrumbs from DOM API calls.
  * This is a HOC so that we get access to dom options in the closure.
  */
-// eslint-disable-next-line @typescript-eslint/no-explicit-any
-function _domBreadcrumb(dom: BreadcrumbsOptions['dom']): (handlerData: { [key: string]: any }) => void {
-  // eslint-disable-next-line @typescript-eslint/no-explicit-any
-  function _innerDomBreadcrumb(handlerData: { [key: string]: any }): void {
+function _domBreadcrumb(dom: BreadcrumbsOptions['dom']): (handlerData: HandlerData) => void {
+  function _innerDomBreadcrumb(handlerData: HandlerData): void {
     let target;
     let keyAttrs = typeof dom === 'object' ? dom.serializeAttribute : undefined;
 
@@ -143,9 +143,10 @@ function _domBreadcrumb(dom: BreadcrumbsOptions['dom']): (handlerData: { [key: s
 
     // Accessing event.target can throw (see getsentry/raven-js#838, #768)
     try {
-      target = handlerData.event.target
-        ? htmlTreeAsString(handlerData.event.target as Node, { keyAttrs, maxStringLength })
-        : htmlTreeAsString(handlerData.event as unknown as Node, { keyAttrs, maxStringLength });
+      const event = handlerData.event as Event | Node;
+      target = _isEvent(event)
+        ? htmlTreeAsString(event.target, { keyAttrs, maxStringLength })
+        : htmlTreeAsString(event, { keyAttrs, maxStringLength });
     } catch (e) {
       target = '<unknown>';
     }
@@ -173,8 +174,7 @@ function _domBreadcrumb(dom: BreadcrumbsOptions['dom']): (handlerData: { [key: s
 /**
  * Creates breadcrumbs from console API calls
  */
-// eslint-disable-next-line @typescript-eslint/no-explicit-any
-function _consoleBreadcrumb(handlerData: { [key: string]: any }): void {
+function _consoleBreadcrumb(handlerData: HandlerData & { args: unknown[]; level: string }): void {
   // This is a hack to fix a Vue3-specific bug that causes an infinite loop of
   // console warnings. This happens when a Vue template is rendered with
   // an undeclared variable, which we try to stringify, ultimately causing
@@ -216,8 +216,7 @@ function _consoleBreadcrumb(handlerData: { [key: string]: any }): void {
 /**
  * Creates breadcrumbs from XHR API calls
  */
-// eslint-disable-next-line @typescript-eslint/no-explicit-any
-function _xhrBreadcrumb(handlerData: { [key: string]: any }): void {
+function _xhrBreadcrumb(handlerData: HandlerData & { xhr: SentryWrappedXMLHttpRequest }): void {
   if (handlerData.endTimestamp) {
     // We only capture complete, non-sentry requests
     if (handlerData.xhr.__sentry_own_request__) {
@@ -249,8 +248,7 @@ function _xhrBreadcrumb(handlerData: { [key: string]: any }): void {
 /**
  * Creates breadcrumbs from fetch API calls
  */
-// eslint-disable-next-line @typescript-eslint/no-explicit-any
-function _fetchBreadcrumb(handlerData: { [key: string]: any }): void {
+function _fetchBreadcrumb(handlerData: HandlerData & HandlerDataFetch): void {
   // We only capture complete fetch requests
   if (!handlerData.endTimestamp) {
     return;
@@ -280,7 +278,7 @@ function _fetchBreadcrumb(handlerData: { [key: string]: any }): void {
         category: 'fetch',
         data: {
           ...handlerData.fetchData,
-          status_code: handlerData.response.status,
+          status_code: handlerData.response && handlerData.response.status,
         },
         type: 'http',
       },
@@ -295,10 +293,9 @@ function _fetchBreadcrumb(handlerData: { [key: string]: any }): void {
 /**
  * Creates breadcrumbs from history API calls
  */
-// eslint-disable-next-line @typescript-eslint/no-explicit-any
-function _historyBreadcrumb(handlerData: { [key: string]: any }): void {
-  let from = handlerData.from;
-  let to = handlerData.to;
+function _historyBreadcrumb(handlerData: HandlerData & { from: string; to: string }): void {
+  let from: string | undefined = handlerData.from;
+  let to: string | undefined = handlerData.to;
   const parsedLoc = parseUrl(WINDOW.location.href);
   let parsedFrom = parseUrl(from);
   const parsedTo = parseUrl(to);
@@ -325,3 +322,7 @@ function _historyBreadcrumb(handlerData: { [key: string]: any }): void {
     },
   });
 }
+
+function _isEvent(event: unknown): event is Event {
+  return event && !!(event as Record<string, unknown>).target;
+}

packages/core/src/baseclient.ts

@@ -17,6 +17,7 @@ import type {
   SessionAggregates,
   Severity,
   SeverityLevel,
+  Transaction,
   TransactionEvent,
   Transport,
 } from '@sentry/types';
@@ -97,6 +98,9 @@ export abstract class BaseClient<O extends ClientOptions> implements Client<O> {
   /** Holds flushable  */
   private _outcomes: { [key: string]: number } = {};
 
+  // eslint-disable-next-line @typescript-eslint/ban-types
+  private _hooks: Record<string, Function[]> = {};
+
   /**
    * Initializes this client instance.
    *
@@ -351,6 +355,38 @@ export abstract class BaseClient<O extends ClientOptions> implements Client<O> {
     }
   }
 
+  // Keep on() & emit() signatures in sync with types' client.ts interface
+
+  /** @inheritdoc */
+  public on(hook: 'startTransaction' | 'finishTransaction', callback: (transaction: Transaction) => void): void;
+
+  /** @inheritdoc */
+  public on(hook: 'beforeEnvelope', callback: (envelope: Envelope) => void): void;
+
+  /** @inheritdoc */
+  public on(hook: string, callback: unknown): void {
+    if (!this._hooks[hook]) {
+      this._hooks[hook] = [];
+    }
+
+    // @ts-ignore We assue the types are correct
+    this._hooks[hook].push(callback);
+  }
+
+  /** @inheritdoc */
+  public emit(hook: 'startTransaction' | 'finishTransaction', transaction: Transaction): void;
+
+  /** @inheritdoc */
+  public emit(hook: 'beforeEnvelope', envelope: Envelope): void;
+
+  /** @inheritdoc */
+  public emit(hook: string, ...rest: unknown[]): void {
+    if (this._hooks[hook]) {
+      // @ts-ignore we cannot enforce the callback to match the hook
+      this._hooks[hook].forEach(callback => callback(...rest));
+    }
+  }
+
   /** Updates existing session based on the provided event */
   protected _updateSessionFromEvent(session: Session, event: Event): void {
     let crashed = false;
@@ -560,7 +596,7 @@ export abstract class BaseClient<O extends ClientOptions> implements Client<O> {
           data: {
             __sentry__: true,
           },
-          originalException: reason as Error,
+          originalException: reason,
         });
         throw new SentryError(
           `Event processing pipeline threw an error, original event will not be sent. Details have been sent as a new event.\nReason: ${reason}`,

packages/core/src/hub.ts

@@ -183,8 +183,7 @@ export class Hub implements HubInterface {
   /**
    * @inheritDoc
    */
-  // eslint-disable-next-line @typescript-eslint/no-explicit-any, @typescript-eslint/explicit-module-boundary-types
-  public captureException(exception: any, hint?: EventHint): string {
+  public captureException(exception: unknown, hint?: EventHint): string {
     const eventId = (this._lastEventId = hint && hint.event_id ? hint.event_id : uuid4());
     const syntheticException = new Error('Sentry syntheticException');
     this._withClient((client, scope) => {

packages/core/src/index.ts

@@ -2,6 +2,7 @@ export type { ClientClass } from './sdk';
 export type { Carrier, Layer } from './hub';
 export type { OfflineStore, OfflineTransportOptions } from './transports/offline';
 
+export * from './tracing';
 export {
   addBreadcrumb,
   captureException,