ref: Make it easier to use stackParser

[AbhiPrasad]

After writing up #5011, I realized using clients manually was kind of annoying as you had to use a util to pass in the stackParser correctly:

import { BrowserClient, defaultStackParsers, defaultIntegrations, makeFetchTransport } from '@sentry/browser';
import { stackParserFromOptions } from '@sentry/utils';
// New in v7:
const client = new BrowserClient({
  transport: makeFetchTransport,
  stackParser: stackParserFromOptions(defaultStackParsers),
  integrations: defaultIntegrations,
});

This PR update exports so that you can just reference the defaultStackParser directly.

import { BrowserClient, defaultStackParser, defaultIntegrations, makeFetchTransport } from '@sentry/browser';

// New in v7:
const client = new BrowserClient({
  transport: makeFetchTransport,
  stackParser: defaultStackParser,
  integrations: defaultIntegrations,
});

[github-actions]

size-limit report 📦

Path	Size
@sentry/browser - ES5 CDN Bundle (gzipped + minified)	18.71 KB (-7.13% 🔽)
@sentry/browser - ES5 CDN Bundle (minified)	58.39 KB (-9.64% 🔽)
@sentry/browser - ES6 CDN Bundle (gzipped + minified)	17.42 KB (-7.67% 🔽)
@sentry/browser - ES6 CDN Bundle (minified)	52.55 KB (-9.35% 🔽)
@sentry/browser - Webpack (gzipped + minified)	19.2 KB (-17.37% 🔽)
@sentry/browser - Webpack (minified)	62.09 KB (-24.01% 🔽)
@sentry/react - Webpack (gzipped + minified)	19.22 KB (-17.41% 🔽)
@sentry/nextjs Client - Webpack (gzipped + minified)	42.89 KB (-10.75% 🔽)
@sentry/browser + @sentry/tracing - ES5 CDN Bundle (gzipped + minified)	24.5 KB (-6.04% 🔽)
@sentry/browser + @sentry/tracing - ES6 CDN Bundle (gzipped + minified)	22.97 KB (-6.2% 🔽)

[Lms24]

I think that's a good change. Some tests still need adjustments small import adjustments like here:

sentry-javascript/packages/browser/test/unit/tracekit/opera.test.ts

Lines 4 to 7 in 08f50c8

	import { defaultStackParsers, opera10StackParser, opera11StackParser } from '../../../src/stack-parsers';
	const operaParser = createStackParser(opera10StackParser, opera11StackParser);
	const chromiumParser = createStackParser(...defaultStackParsers);

[kamilogorek]

How about:

import { defaultBrowserOptions } from '@sentry/browser';

const client = BrowserClient({
  ...defaultBrowserOptions
});

import { defaultBrowserOptions } from '@sentry/browser';

const client = BrowserClient({
  ...defaultBrowserOptions,
  transport: myCustomTransportFactory
});

import { defaultBrowserOptions } from '@sentry/browser';

const { transport, stackParser, integrations } = defaultBrowserOptions;

const client = BrowserClient({
  transport,
  stackParser,
  integrations
});

or call it defaultClientOptions, so we can reuse the same name in every package.
If someone wants, they can always rename it during import.

[Lms24]

@kamilogorek do you mean defaultBrowserOptions could replace defaultIntegrations, defaultStackParser, etc?

Seems clean but would default integrations then still get tree-shaken out if they're not used? Say in a case like this:

import { defaultBrowserOptions } from '@sentry/browser';

const client = BrowserClient({
  ...defaultBrowserOptions,
  integrations: []
});

[kamilogorek]

@kamilogorek do you mean defaultBrowserOptions could replace defaultIntegrations, defaultStackParser, etc?

Yes

I'm not sure, but there's a chance they would not, it'd have to be tested.

const { transport, stackParser, integrations } = defaultBrowserOptions;

has a higher chance of being tree shaken (at least from a logical perspective)

[AbhiPrasad]

We had a chat about this - decided against the defaultClientOptions object (or similar) being included for now, we can always add it in afterwards if many people ask for it.

[Lms24]

LGTM, thanks for fixing the tests and for adding the migration changes!