@sentryqa/react

Optional adapter that enriches SentryQA contexts with React component names and hierarchies through Fiber, with a lexical fallback.

Recommended Installation

For the usual React + Vite workflow, do not install it directly. npx sentryqa init configures @sentryqa/vite, which connects it automatically to @sentryqa/runtime.

Install it only if you mount the runtime manually or need to inspect Fiber in a custom integration:

npm install @sentryqa/react @sentryqa/runtime

Minimal Advanced Workflow

import { mountSentryQa } from '@sentryqa/runtime';
import { createReactAdapter } from '@sentryqa/react';

const controller = mountSentryQa({
  apiBase: '/__sentryqa/issues',
  nonce: 'nonce-entregado-por-tu-bridge',
  adapter: createReactAdapter({ version: '19.0.0' }),
});

The version is optional. You can also use supportsReactFiberVersion(version), findFiber(element), and fiberOwnerPath(fiber) for introspection integrations.

Relationship to the Other Packages

• Connects to the runtime through FrameworkAdapter.
• @sentryqa/vite instruments React during vite serve and creates the runtime with this adapter.
• @sentryqa/core provides the shared context types.
• The package does not export React components or a UI.

When Not to Use It

Do not add it just to activate SentryQA in a Vite app: the plugin already manages that integration. Fiber enrichment is best-effort; code must tolerate missing metadata or a lexical fallback. Use it only in local development.