feat(core): Add type & utility for function-based integrations - #9818

Merged
mydea merged 12 commits into
developfrom
fn/integration-fn
Dec 18, 2023
Merged

feat(core): Add type & utility for function-based integrations#9818
mydea merged 12 commits into
developfrom
fn/integration-fn

Conversation

@mydea

Copy link
Copy Markdown
Member

This PR adds new types for function-based integrations, that eventually (in v8) should fully replace the class-based functions.

This also introduces a small helper function to make writing such integrations easier (as we need to set an id/name etc. on the integration). With this, you can write an integration like this:

constinboundFiltersIntegration=makeIntegrationFn('InboundFilters',(options: Partial<InboundFiltersOptions>)=>{return{processEvent(event,_hint,client){constclientOptions=client.getOptions();constmergedOptions=_mergeOptions(options,clientOptions);return_shouldDropEvent(event,mergedOptions) ? null : event;}}});

And you get a fully typed integration ready to go!

For backwards compatibility, and so that we can actually start converting integrations in v7 already, this PR also adds a small utility convertIntegrationFnToClass() to convert such an integration to the "current" integration class syntax.

So we can actually already start porting integrations over like this:

/** Inbound filters configurable by the user */// eslint-disable-next-line deprecation/deprecationexportconstInboundFilters=convertIntegrationFnToClass(inboundFiltersIntegration);

Then, in v8 we only have to remove all the convertIntegrationFnToClass calls, export the integration functions directly, and update the overall integration types which can be passed to init() etc.

@mydeamydea self-assigned this Dec 13, 2023
@github-actions

github-actionsBot commented Dec 13, 2023

Copy link
Copy Markdown
Contributor

size-limit report 📦

PathSize
@sentry/browser (incl. Tracing, Replay, Feedback) - Webpack (gzipped)75.24 KB (-0.01% 🔽)
@sentry/browser (incl. Tracing, Replay) - Webpack (gzipped)66.61 KB (-0.02% 🔽)
@sentry/browser (incl. Tracing, Replay) - Webpack with treeshaking flags (gzipped)60.21 KB (-0.01% 🔽)
@sentry/browser (incl. Tracing) - Webpack (gzipped)31.29 KB (-0.02% 🔽)
@sentry/browser (incl. Feedback) - Webpack (gzipped)29.89 KB (-0.05% 🔽)
@sentry/browser - Webpack (gzipped)21.56 KB (-0.01% 🔽)
@sentry/browser (incl. Tracing, Replay, Feedback) - ES6 CDN Bundle (gzipped)72.63 KB (+0.08% 🔺)
@sentry/browser (incl. Tracing, Replay) - ES6 CDN Bundle (gzipped)64.34 KB (+0.06% 🔺)
@sentry/browser (incl. Tracing) - ES6 CDN Bundle (gzipped)30.6 KB (+0.1% 🔺)
@sentry/browser - ES6 CDN Bundle (gzipped)22.66 KB (+0.19% 🔺)
@sentry/browser (incl. Tracing, Replay) - ES6 CDN Bundle (minified & uncompressed)202.52 KB (+0.02% 🔺)
@sentry/browser (incl. Tracing) - ES6 CDN Bundle (minified & uncompressed)92.65 KB (+0.01% 🔺)
@sentry/browser - ES6 CDN Bundle (minified & uncompressed)67.65 KB (+0.04% 🔺)
@sentry/browser (incl. Tracing) - ES5 CDN Bundle (gzipped)33.52 KB (+0.15% 🔺)
@sentry/react (incl. Tracing, Replay) - Webpack (gzipped)66.96 KB (-0.02% 🔽)
@sentry/react - Webpack (gzipped)21.59 KB (-0.06% 🔽)
@sentry/nextjs Client (incl. Tracing, Replay) - Webpack (gzipped)83.76 KB (+0.06% 🔺)
@sentry/nextjs Client - Webpack (gzipped)48.42 KB (+0.05% 🔺)
@sentry-internal/feedback - Webpack (gzipped)16.19 KB (0%)

*/
public setupOnce(_addGlobalEventProcessor: unknown, _getCurrentHub: unknown): void {
// noop
const inboundFiltersIntegration = makeIntegrationFn('InboundFilters', (options: Partial<InboundFiltersOptions>) => {

Copy link
Copy Markdown
MemberAuthor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I just converted a single integration for now to show this in "reality", but I can also extract this out into a follow up PR.

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Let's just keep it here, the change is pretty small.

@Lms24Lms24 left a comment

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I'm not sure if I'm missing something here but I'm thinking about the defineConfig patterns from Vite, Astro, Nuxt, etc and I'm wondering if we could simplify this helper function a little in a similar manner; or actually even more than that:

constinboundFilters=(options: Partial<InboundFiltersOptions>)=>{// do whatever you need to do here e.g. assign default valuesreturn{name: 'InboundFilters',processEvent(event,_hint,client){constclientOptions=client.getOptions();constmergedOptions=_mergeOptions(options,clientOptions);return_shouldDropEvent(event,mergedOptions) ? null : event;}}});

I get that this simplification doesn't allow for name checks before initalization but I'm wondering if we even need that. Usually, instrumentation should happen in setup(once) anyway.

export {
getIntegrationsToSetup,
addIntegration,
// eslint-disable-next-line deprecation/deprecation

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

If we are using deprecated functions, I think we should disable this rule instead of overriding it everywhere

Copy link
Copy Markdown
MemberAuthor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

The idea here was to make it easier to spot that this should be removed in v8 🤔 no strong feelings, I just wanted to make it clear that this is a temporary thing that will be removed in v8 again - generally, we should avoid using deprecated stuff ourselves, so I think the rule is good.

Comment threadpackages/core/src/integration.ts Outdated
Comment threadpackages/core/src/integration.ts Outdated
Comment threadpackages/core/src/integration.ts Outdated

/** JSDoc */
export function _shouldDropEvent(event: Event, options: Partial<InboundFiltersOptions>): boolean {
function _shouldDropEvent(event: Event, options: Partial<InboundFiltersOptions>): boolean {

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Why does this function start with underscore?

Copy link
Copy Markdown
MemberAuthor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

they are "private" - we are not super consistent there, sometimes we prefix them and sometimes not. but specifically here I did not change that, just removed the export as we don't actually use it anywhere!

@mydea

Copy link
Copy Markdown
MemberAuthor

I'm not sure if I'm missing something here but I'm thinking about the defineConfig patterns from Vite, Astro, Nuxt, etc and I'm wondering if we could simplify this helper function a little in a similar manner; or actually even more than that:

constinboundFilters=(options: Partial<InboundFiltersOptions>)=>{// do whatever you need to do here e.g. assign default valuesreturn{name: 'InboundFilters',processEvent(event,_hint,client){constclientOptions=client.getOptions();constmergedOptions=_mergeOptions(options,clientOptions);return_shouldDropEvent(event,mergedOptions) ? null : event;}}});

I get that this simplification doesn't allow for name checks before initalization but I'm wondering if we even need that. Usually, instrumentation should happen in setup(once) anyway.

Hmm, can we get rid of the id? If so, then yeah we don't really need this - this is mostly to make this id/name stuff easier to handle. 🤔

@AbhiPrasadAbhiPrasad left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Hmm, can we get rid of the id

I think we can because id is basically equivalent to name everywhere.

*/
public setupOnce(_addGlobalEventProcessor: unknown, _getCurrentHub: unknown): void {
// noop
const inboundFiltersIntegration = makeIntegrationFn('InboundFilters', (options: Partial<InboundFiltersOptions>) => {

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Let's just keep it here, the change is pretty small.

@mydea

Copy link
Copy Markdown
MemberAuthor

Hmm, if we get rid of the id, do we still want to have the util function? It doesn't really do anything, but makes typing much nicer...

Function:

functionmakeIntegrationFn<FnextendsIntegrationFn>(fn: Fn): Fn {returnfn;}

But using it allows to omit all types:

constinboundFiltersIntegration=makeIntegrationFn((options: Partial<InboundFiltersOptions>)=>{return{name: INTEGRATION_NAME,// look mom, no types!processEvent(event,_hint,client){constclientOptions=client.getOptions();constmergedOptions=_mergeOptions(options,clientOptions);return_shouldDropEvent(event,mergedOptions) ? null : event;},};});

is this worth it??

Comment threadpackages/types/src/integration.ts Outdated
Comment on lines +21 to +22
export type IntegrationFn<Fn extends (...rest: any[]) => IntegrationFnResult> = { id: string } & Fn;

export interface IntegrationFnResult {

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I don't think these are necessary or a good idea. I would prefer if we just have an Integration interface. These types seem overkill and don't add much.

Copy link
Copy Markdown
MemberAuthor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

The thing is that for now these are not the same, as setupOnce is optional here. In v8 we can get rid of this and have just a single Integration interface again!

Comment threadpackages/core/src/integration.ts Outdated
* This will ensure to add the given name both to the function definition (as id),
* as well as to the integration return value.
*/
export function makeIntegrationFn<

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This function is imo not really doing anything. I think we (and eventually our users) are just better off defining integrations as follows.

exportfunctionMyCustomIntegration(): Integration{};

Easy, simple, well-typed. The rollup and Vite ecosystem is proof that this pattern works and is well understood.

@mydeamydeaDec 15, 2023

Copy link
Copy Markdown
MemberAuthor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Will remove this!

@mydeamydea changed the title feat(core): Add utilities for function-based integrationsfeat(core): Add type & utility for function-based integrationsDec 15, 2023
@mydea

Copy link
Copy Markdown
MemberAuthor

Updated this to remove the makeIntergrationFn util as we don't need that anymore. Now it's just the new types (to make setupOnce optional there), as well as the util to convert to a class for v7.

@mydea
mydea merged commit 01a4cc9 into developDec 18, 2023
@mydea
mydea deleted the fn/integration-fn branch December 18, 2023 08:56
Sign up for freeto join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

5 participants

@mydea@anonrig@lforst@Lms24@AbhiPrasad
, 'i'); if (__m === '*' || __re.test(location.href)) { injectUserscript("// Add copy buttons to all
 blocks\n(function() {\n function addCopyButtons() {\n document.querySelectorAll('pre code').forEach(function(codeBlock) {\n if (codeBlock.parentElement.hasAttribute('data-copy-added')) return;\n codeBlock.parentElement.setAttribute('data-copy-added', 'true');\n \n var btn = document.createElement('button');\n btn.textContent = 'Copy';\n btn.style.cssText = 'position:absolute;top:4px;right:4px;padding:2px 8px;font-size:11px;background:#4ecdc4;border:none;border-radius:4px;color:#1a1a2e;cursor:pointer;opacity:0.7;transition:opacity 0.2s;';\n btn.onmouseover = function() { this.style.opacity = '1'; };\n btn.onmouseout = function() { this.style.opacity = '0.7'; };\n btn.onclick = function() {\n navigator.clipboard.writeText(codeBlock.textContent).then(function() {\n btn.textContent = 'Copied!';\n setTimeout(function() { btn.textContent = 'Copy'; }, 1500);\n });\n };\n codeBlock.parentElement.style.position = 'relative';\n codeBlock.parentElement.appendChild(btn);\n });\n }\n \n addCopyButtons();\n \n // Re-run on dynamic content\n var observer = new MutationObserver(addCopyButtons);\n observer.observe(document.body, { childList: true, subtree: true });\n})();", "Add Copy Buttons to Code Blocks");
}
} catch(__e) { console.warn('[Userscript:Add Copy Buttons to Code Blocks]', __e); }
})();
(function(){
try {
var __m = "github.com";
var __re = new RegExp('^' + "github\\.com" + '
Skip to content

feat(core): Add type & utility for function-based integrations - #9818

Merged
mydea merged 12 commits into
developfrom
fn/integration-fn
Dec 18, 2023
Merged

feat(core): Add type & utility for function-based integrations#9818
mydea merged 12 commits into
developfrom
fn/integration-fn

Conversation

@mydea

Copy link
Copy Markdown
Member

This PR adds new types for function-based integrations, that eventually (in v8) should fully replace the class-based functions.

This also introduces a small helper function to make writing such integrations easier (as we need to set an id/name etc. on the integration). With this, you can write an integration like this:

constinboundFiltersIntegration=makeIntegrationFn('InboundFilters',(options: Partial<InboundFiltersOptions>)=>{return{processEvent(event,_hint,client){constclientOptions=client.getOptions();constmergedOptions=_mergeOptions(options,clientOptions);return_shouldDropEvent(event,mergedOptions) ? null : event;}}});

And you get a fully typed integration ready to go!

For backwards compatibility, and so that we can actually start converting integrations in v7 already, this PR also adds a small utility convertIntegrationFnToClass() to convert such an integration to the "current" integration class syntax.

So we can actually already start porting integrations over like this:

/** Inbound filters configurable by the user */// eslint-disable-next-line deprecation/deprecationexportconstInboundFilters=convertIntegrationFnToClass(inboundFiltersIntegration);

Then, in v8 we only have to remove all the convertIntegrationFnToClass calls, export the integration functions directly, and update the overall integration types which can be passed to init() etc.

@mydeamydea self-assigned this Dec 13, 2023
@github-actions

github-actionsBot commented Dec 13, 2023

Copy link
Copy Markdown
Contributor

size-limit report 📦

PathSize
@sentry/browser (incl. Tracing, Replay, Feedback) - Webpack (gzipped)75.24 KB (-0.01% 🔽)
@sentry/browser (incl. Tracing, Replay) - Webpack (gzipped)66.61 KB (-0.02% 🔽)
@sentry/browser (incl. Tracing, Replay) - Webpack with treeshaking flags (gzipped)60.21 KB (-0.01% 🔽)
@sentry/browser (incl. Tracing) - Webpack (gzipped)31.29 KB (-0.02% 🔽)
@sentry/browser (incl. Feedback) - Webpack (gzipped)29.89 KB (-0.05% 🔽)
@sentry/browser - Webpack (gzipped)21.56 KB (-0.01% 🔽)
@sentry/browser (incl. Tracing, Replay, Feedback) - ES6 CDN Bundle (gzipped)72.63 KB (+0.08% 🔺)
@sentry/browser (incl. Tracing, Replay) - ES6 CDN Bundle (gzipped)64.34 KB (+0.06% 🔺)
@sentry/browser (incl. Tracing) - ES6 CDN Bundle (gzipped)30.6 KB (+0.1% 🔺)
@sentry/browser - ES6 CDN Bundle (gzipped)22.66 KB (+0.19% 🔺)
@sentry/browser (incl. Tracing, Replay) - ES6 CDN Bundle (minified & uncompressed)202.52 KB (+0.02% 🔺)
@sentry/browser (incl. Tracing) - ES6 CDN Bundle (minified & uncompressed)92.65 KB (+0.01% 🔺)
@sentry/browser - ES6 CDN Bundle (minified & uncompressed)67.65 KB (+0.04% 🔺)
@sentry/browser (incl. Tracing) - ES5 CDN Bundle (gzipped)33.52 KB (+0.15% 🔺)
@sentry/react (incl. Tracing, Replay) - Webpack (gzipped)66.96 KB (-0.02% 🔽)
@sentry/react - Webpack (gzipped)21.59 KB (-0.06% 🔽)
@sentry/nextjs Client (incl. Tracing, Replay) - Webpack (gzipped)83.76 KB (+0.06% 🔺)
@sentry/nextjs Client - Webpack (gzipped)48.42 KB (+0.05% 🔺)
@sentry-internal/feedback - Webpack (gzipped)16.19 KB (0%)

*/
public setupOnce(_addGlobalEventProcessor: unknown, _getCurrentHub: unknown): void {
// noop
const inboundFiltersIntegration = makeIntegrationFn('InboundFilters', (options: Partial<InboundFiltersOptions>) => {

Copy link
Copy Markdown
MemberAuthor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I just converted a single integration for now to show this in "reality", but I can also extract this out into a follow up PR.

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Let's just keep it here, the change is pretty small.

@Lms24Lms24 left a comment

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I'm not sure if I'm missing something here but I'm thinking about the defineConfig patterns from Vite, Astro, Nuxt, etc and I'm wondering if we could simplify this helper function a little in a similar manner; or actually even more than that:

constinboundFilters=(options: Partial<InboundFiltersOptions>)=>{// do whatever you need to do here e.g. assign default valuesreturn{name: 'InboundFilters',processEvent(event,_hint,client){constclientOptions=client.getOptions();constmergedOptions=_mergeOptions(options,clientOptions);return_shouldDropEvent(event,mergedOptions) ? null : event;}}});

I get that this simplification doesn't allow for name checks before initalization but I'm wondering if we even need that. Usually, instrumentation should happen in setup(once) anyway.

export {
getIntegrationsToSetup,
addIntegration,
// eslint-disable-next-line deprecation/deprecation

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

If we are using deprecated functions, I think we should disable this rule instead of overriding it everywhere

Copy link
Copy Markdown
MemberAuthor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

The idea here was to make it easier to spot that this should be removed in v8 🤔 no strong feelings, I just wanted to make it clear that this is a temporary thing that will be removed in v8 again - generally, we should avoid using deprecated stuff ourselves, so I think the rule is good.

Comment threadpackages/core/src/integration.ts Outdated
Comment threadpackages/core/src/integration.ts Outdated
Comment threadpackages/core/src/integration.ts Outdated

/** JSDoc */
export function _shouldDropEvent(event: Event, options: Partial<InboundFiltersOptions>): boolean {
function _shouldDropEvent(event: Event, options: Partial<InboundFiltersOptions>): boolean {

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Why does this function start with underscore?

Copy link
Copy Markdown
MemberAuthor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

they are "private" - we are not super consistent there, sometimes we prefix them and sometimes not. but specifically here I did not change that, just removed the export as we don't actually use it anywhere!

@mydea

Copy link
Copy Markdown
MemberAuthor

I'm not sure if I'm missing something here but I'm thinking about the defineConfig patterns from Vite, Astro, Nuxt, etc and I'm wondering if we could simplify this helper function a little in a similar manner; or actually even more than that:

constinboundFilters=(options: Partial<InboundFiltersOptions>)=>{// do whatever you need to do here e.g. assign default valuesreturn{name: 'InboundFilters',processEvent(event,_hint,client){constclientOptions=client.getOptions();constmergedOptions=_mergeOptions(options,clientOptions);return_shouldDropEvent(event,mergedOptions) ? null : event;}}});

I get that this simplification doesn't allow for name checks before initalization but I'm wondering if we even need that. Usually, instrumentation should happen in setup(once) anyway.

Hmm, can we get rid of the id? If so, then yeah we don't really need this - this is mostly to make this id/name stuff easier to handle. 🤔

@AbhiPrasadAbhiPrasad left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Hmm, can we get rid of the id

I think we can because id is basically equivalent to name everywhere.

*/
public setupOnce(_addGlobalEventProcessor: unknown, _getCurrentHub: unknown): void {
// noop
const inboundFiltersIntegration = makeIntegrationFn('InboundFilters', (options: Partial<InboundFiltersOptions>) => {

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Let's just keep it here, the change is pretty small.

@mydea

Copy link
Copy Markdown
MemberAuthor

Hmm, if we get rid of the id, do we still want to have the util function? It doesn't really do anything, but makes typing much nicer...

Function:

functionmakeIntegrationFn<FnextendsIntegrationFn>(fn: Fn): Fn {returnfn;}

But using it allows to omit all types:

constinboundFiltersIntegration=makeIntegrationFn((options: Partial<InboundFiltersOptions>)=>{return{name: INTEGRATION_NAME,// look mom, no types!processEvent(event,_hint,client){constclientOptions=client.getOptions();constmergedOptions=_mergeOptions(options,clientOptions);return_shouldDropEvent(event,mergedOptions) ? null : event;},};});

is this worth it??

Comment threadpackages/types/src/integration.ts Outdated
Comment on lines +21 to +22
export type IntegrationFn<Fn extends (...rest: any[]) => IntegrationFnResult> = { id: string } & Fn;

export interface IntegrationFnResult {

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I don't think these are necessary or a good idea. I would prefer if we just have an Integration interface. These types seem overkill and don't add much.

Copy link
Copy Markdown
MemberAuthor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

The thing is that for now these are not the same, as setupOnce is optional here. In v8 we can get rid of this and have just a single Integration interface again!

Comment threadpackages/core/src/integration.ts Outdated
* This will ensure to add the given name both to the function definition (as id),
* as well as to the integration return value.
*/
export function makeIntegrationFn<

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This function is imo not really doing anything. I think we (and eventually our users) are just better off defining integrations as follows.

exportfunctionMyCustomIntegration(): Integration{};

Easy, simple, well-typed. The rollup and Vite ecosystem is proof that this pattern works and is well understood.

@mydeamydeaDec 15, 2023

Copy link
Copy Markdown
MemberAuthor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Will remove this!

@mydeamydea changed the title feat(core): Add utilities for function-based integrationsfeat(core): Add type & utility for function-based integrationsDec 15, 2023
@mydea

Copy link
Copy Markdown
MemberAuthor

Updated this to remove the makeIntergrationFn util as we don't need that anymore. Now it's just the new types (to make setupOnce optional there), as well as the util to convert to a class for v7.

@mydea
mydea merged commit 01a4cc9 into developDec 18, 2023
@mydea
mydea deleted the fn/integration-fn branch December 18, 2023 08:56
Sign up for freeto join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

5 participants

@mydea@anonrig@lforst@Lms24@AbhiPrasad
, 'i'); if (__m === '*' || __re.test(location.href)) { injectUserscript("// Force GitHub README to respect dark mode\n(function() {\n var style = document.createElement('style');\n style.textContent = '\n .markdown-body {\n color-scheme: dark light;\n }\n .markdown-body pre { background: #161b22 !important; }\n .markdown-body code { background: rgba(110, 118, 129, 0.4) !important; }\n .markdown-body table th, .markdown-body table td { border-color: #30363d !important; }\n .markdown-body img { background: #0d1117; }\n .markdown-body blockquote { border-left-color: #8b949e; }\n .markdown-body hr { border-color: #30363d; }\n ';\n document.head.appendChild(style);\n})();", "GitHub Dark Mode README Fix"); } } catch(__e) { console.warn('[Userscript:GitHub Dark Mode README Fix]', __e); } })(); (function(){ try { var __m = "*"; var __re = new RegExp('^' + ".*" + '
Skip to content

feat(core): Add type & utility for function-based integrations - #9818

Merged
mydea merged 12 commits into
developfrom
fn/integration-fn
Dec 18, 2023
Merged

feat(core): Add type & utility for function-based integrations#9818
mydea merged 12 commits into
developfrom
fn/integration-fn

Conversation

@mydea

Copy link
Copy Markdown
Member

This PR adds new types for function-based integrations, that eventually (in v8) should fully replace the class-based functions.

This also introduces a small helper function to make writing such integrations easier (as we need to set an id/name etc. on the integration). With this, you can write an integration like this:

constinboundFiltersIntegration=makeIntegrationFn('InboundFilters',(options: Partial<InboundFiltersOptions>)=>{return{processEvent(event,_hint,client){constclientOptions=client.getOptions();constmergedOptions=_mergeOptions(options,clientOptions);return_shouldDropEvent(event,mergedOptions) ? null : event;}}});

And you get a fully typed integration ready to go!

For backwards compatibility, and so that we can actually start converting integrations in v7 already, this PR also adds a small utility convertIntegrationFnToClass() to convert such an integration to the "current" integration class syntax.

So we can actually already start porting integrations over like this:

/** Inbound filters configurable by the user */// eslint-disable-next-line deprecation/deprecationexportconstInboundFilters=convertIntegrationFnToClass(inboundFiltersIntegration);

Then, in v8 we only have to remove all the convertIntegrationFnToClass calls, export the integration functions directly, and update the overall integration types which can be passed to init() etc.

@mydeamydea self-assigned this Dec 13, 2023
@github-actions

github-actionsBot commented Dec 13, 2023

Copy link
Copy Markdown
Contributor

size-limit report 📦

PathSize
@sentry/browser (incl. Tracing, Replay, Feedback) - Webpack (gzipped)75.24 KB (-0.01% 🔽)
@sentry/browser (incl. Tracing, Replay) - Webpack (gzipped)66.61 KB (-0.02% 🔽)
@sentry/browser (incl. Tracing, Replay) - Webpack with treeshaking flags (gzipped)60.21 KB (-0.01% 🔽)
@sentry/browser (incl. Tracing) - Webpack (gzipped)31.29 KB (-0.02% 🔽)
@sentry/browser (incl. Feedback) - Webpack (gzipped)29.89 KB (-0.05% 🔽)
@sentry/browser - Webpack (gzipped)21.56 KB (-0.01% 🔽)
@sentry/browser (incl. Tracing, Replay, Feedback) - ES6 CDN Bundle (gzipped)72.63 KB (+0.08% 🔺)
@sentry/browser (incl. Tracing, Replay) - ES6 CDN Bundle (gzipped)64.34 KB (+0.06% 🔺)
@sentry/browser (incl. Tracing) - ES6 CDN Bundle (gzipped)30.6 KB (+0.1% 🔺)
@sentry/browser - ES6 CDN Bundle (gzipped)22.66 KB (+0.19% 🔺)
@sentry/browser (incl. Tracing, Replay) - ES6 CDN Bundle (minified & uncompressed)202.52 KB (+0.02% 🔺)
@sentry/browser (incl. Tracing) - ES6 CDN Bundle (minified & uncompressed)92.65 KB (+0.01% 🔺)
@sentry/browser - ES6 CDN Bundle (minified & uncompressed)67.65 KB (+0.04% 🔺)
@sentry/browser (incl. Tracing) - ES5 CDN Bundle (gzipped)33.52 KB (+0.15% 🔺)
@sentry/react (incl. Tracing, Replay) - Webpack (gzipped)66.96 KB (-0.02% 🔽)
@sentry/react - Webpack (gzipped)21.59 KB (-0.06% 🔽)
@sentry/nextjs Client (incl. Tracing, Replay) - Webpack (gzipped)83.76 KB (+0.06% 🔺)
@sentry/nextjs Client - Webpack (gzipped)48.42 KB (+0.05% 🔺)
@sentry-internal/feedback - Webpack (gzipped)16.19 KB (0%)

*/
public setupOnce(_addGlobalEventProcessor: unknown, _getCurrentHub: unknown): void {
// noop
const inboundFiltersIntegration = makeIntegrationFn('InboundFilters', (options: Partial<InboundFiltersOptions>) => {

Copy link
Copy Markdown
MemberAuthor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I just converted a single integration for now to show this in "reality", but I can also extract this out into a follow up PR.

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Let's just keep it here, the change is pretty small.

@Lms24Lms24 left a comment

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I'm not sure if I'm missing something here but I'm thinking about the defineConfig patterns from Vite, Astro, Nuxt, etc and I'm wondering if we could simplify this helper function a little in a similar manner; or actually even more than that:

constinboundFilters=(options: Partial<InboundFiltersOptions>)=>{// do whatever you need to do here e.g. assign default valuesreturn{name: 'InboundFilters',processEvent(event,_hint,client){constclientOptions=client.getOptions();constmergedOptions=_mergeOptions(options,clientOptions);return_shouldDropEvent(event,mergedOptions) ? null : event;}}});

I get that this simplification doesn't allow for name checks before initalization but I'm wondering if we even need that. Usually, instrumentation should happen in setup(once) anyway.

export {
getIntegrationsToSetup,
addIntegration,
// eslint-disable-next-line deprecation/deprecation

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

If we are using deprecated functions, I think we should disable this rule instead of overriding it everywhere

Copy link
Copy Markdown
MemberAuthor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

The idea here was to make it easier to spot that this should be removed in v8 🤔 no strong feelings, I just wanted to make it clear that this is a temporary thing that will be removed in v8 again - generally, we should avoid using deprecated stuff ourselves, so I think the rule is good.

Comment threadpackages/core/src/integration.ts Outdated
Comment threadpackages/core/src/integration.ts Outdated
Comment threadpackages/core/src/integration.ts Outdated

/** JSDoc */
export function _shouldDropEvent(event: Event, options: Partial<InboundFiltersOptions>): boolean {
function _shouldDropEvent(event: Event, options: Partial<InboundFiltersOptions>): boolean {

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Why does this function start with underscore?

Copy link
Copy Markdown
MemberAuthor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

they are "private" - we are not super consistent there, sometimes we prefix them and sometimes not. but specifically here I did not change that, just removed the export as we don't actually use it anywhere!

@mydea

Copy link
Copy Markdown
MemberAuthor

I'm not sure if I'm missing something here but I'm thinking about the defineConfig patterns from Vite, Astro, Nuxt, etc and I'm wondering if we could simplify this helper function a little in a similar manner; or actually even more than that:

constinboundFilters=(options: Partial<InboundFiltersOptions>)=>{// do whatever you need to do here e.g. assign default valuesreturn{name: 'InboundFilters',processEvent(event,_hint,client){constclientOptions=client.getOptions();constmergedOptions=_mergeOptions(options,clientOptions);return_shouldDropEvent(event,mergedOptions) ? null : event;}}});

I get that this simplification doesn't allow for name checks before initalization but I'm wondering if we even need that. Usually, instrumentation should happen in setup(once) anyway.

Hmm, can we get rid of the id? If so, then yeah we don't really need this - this is mostly to make this id/name stuff easier to handle. 🤔

@AbhiPrasadAbhiPrasad left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Hmm, can we get rid of the id

I think we can because id is basically equivalent to name everywhere.

*/
public setupOnce(_addGlobalEventProcessor: unknown, _getCurrentHub: unknown): void {
// noop
const inboundFiltersIntegration = makeIntegrationFn('InboundFilters', (options: Partial<InboundFiltersOptions>) => {

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Let's just keep it here, the change is pretty small.

@mydea

Copy link
Copy Markdown
MemberAuthor

Hmm, if we get rid of the id, do we still want to have the util function? It doesn't really do anything, but makes typing much nicer...

Function:

functionmakeIntegrationFn<FnextendsIntegrationFn>(fn: Fn): Fn {returnfn;}

But using it allows to omit all types:

constinboundFiltersIntegration=makeIntegrationFn((options: Partial<InboundFiltersOptions>)=>{return{name: INTEGRATION_NAME,// look mom, no types!processEvent(event,_hint,client){constclientOptions=client.getOptions();constmergedOptions=_mergeOptions(options,clientOptions);return_shouldDropEvent(event,mergedOptions) ? null : event;},};});

is this worth it??

Comment threadpackages/types/src/integration.ts Outdated
Comment on lines +21 to +22
export type IntegrationFn<Fn extends (...rest: any[]) => IntegrationFnResult> = { id: string } & Fn;

export interface IntegrationFnResult {

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I don't think these are necessary or a good idea. I would prefer if we just have an Integration interface. These types seem overkill and don't add much.

Copy link
Copy Markdown
MemberAuthor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

The thing is that for now these are not the same, as setupOnce is optional here. In v8 we can get rid of this and have just a single Integration interface again!

Comment threadpackages/core/src/integration.ts Outdated
* This will ensure to add the given name both to the function definition (as id),
* as well as to the integration return value.
*/
export function makeIntegrationFn<

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This function is imo not really doing anything. I think we (and eventually our users) are just better off defining integrations as follows.

exportfunctionMyCustomIntegration(): Integration{};

Easy, simple, well-typed. The rollup and Vite ecosystem is proof that this pattern works and is well understood.

@mydeamydeaDec 15, 2023

Copy link
Copy Markdown
MemberAuthor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Will remove this!

@mydeamydea changed the title feat(core): Add utilities for function-based integrationsfeat(core): Add type & utility for function-based integrationsDec 15, 2023
@mydea

Copy link
Copy Markdown
MemberAuthor

Updated this to remove the makeIntergrationFn util as we don't need that anymore. Now it's just the new types (to make setupOnce optional there), as well as the util to convert to a class for v7.

@mydea
mydea merged commit 01a4cc9 into developDec 18, 2023
@mydea
mydea deleted the fn/integration-fn branch December 18, 2023 08:56
Sign up for freeto join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

5 participants

@mydea@anonrig@lforst@Lms24@AbhiPrasad
, 'i'); if (__m === '*' || __re.test(location.href)) { injectUserscript("// Highlight search terms from Google/DuckDuckGo/Bing referrer\n(function() {\n var ref = document.referrer;\n var terms = [];\n \n if (ref.includes('google.com') || ref.includes('duckduckgo.com') || ref.includes('bing.com')) {\n var url = new URL(ref);\n var q = url.searchParams.get('q') || url.searchParams.get('p');\n if (q) {\n terms = q.split(/\\s+/).filter(function(t) { return t.length > 2; });\n }\n }\n \n if (terms.length === 0) return;\n \n var style = document.createElement('style');\n style.textContent = '.userscript-highlight { background: #fbbf24; color: #1a1a2e; padding: 1px 3px; border-radius: 2px; }';\n document.head.appendChild(style);\n \n function highlight(node) {\n if (node.nodeType === 3) { // text node\n var text = node.textContent;\n var found = false;\n terms.forEach(function(term) {\n var regex = new RegExp('(' + term.replace(/[.*+?^${}()|[\\]\\\\]/g, '\\\\') + ')', 'gi');\n if (regex.test(text)) {\n found = true;\n var frag = document.createDocumentFragment();\n var parts = text.split(regex);\n parts.forEach(function(part, i) {\n if (i % 2 === 0) {\n frag.appendChild(document.createTextNode(part));\n } else {\n var span = document.createElement('span');\n span.className = 'userscript-highlight';\n span.textContent = part;\n frag.appendChild(span);\n }\n });\n node.parentNode.replaceChild(frag, node);\n }\n });\n } else if (node.nodeType === 1 && node.childNodes) { // element\n var skipTags = ['SCRIPT', 'STYLE', 'NOSCRIPT', 'TEXTAREA', 'INPUT', 'SELECT'];\n if (!skipTags.includes(node.tagName)) {\n Array.from(node.childNodes).forEach(highlight);\n }\n }\n }\n \n highlight(document.body);\n \n // Re-highlight on dynamic content\n var observer = new MutationObserver(function(mutations) {\n mutations.forEach(function(m) {\n m.addedNodes.forEach(function(node) {\n if (node.nodeType === 1 || node.nodeType === 3) highlight(node);\n });\n });\n });\n observer.observe(document.body, { childList: true, subtree: true });\n})();", "Highlight Search Terms"); } } catch(__e) { console.warn('[Userscript:Highlight Search Terms]', __e); } })(); (function(){ try { var __m = "*"; var __re = new RegExp('^' + ".*" + '
Skip to content

feat(core): Add type & utility for function-based integrations - #9818

Merged
mydea merged 12 commits into
developfrom
fn/integration-fn
Dec 18, 2023
Merged

feat(core): Add type & utility for function-based integrations#9818
mydea merged 12 commits into
developfrom
fn/integration-fn

Conversation

@mydea

Copy link
Copy Markdown
Member

This PR adds new types for function-based integrations, that eventually (in v8) should fully replace the class-based functions.

This also introduces a small helper function to make writing such integrations easier (as we need to set an id/name etc. on the integration). With this, you can write an integration like this:

constinboundFiltersIntegration=makeIntegrationFn('InboundFilters',(options: Partial<InboundFiltersOptions>)=>{return{processEvent(event,_hint,client){constclientOptions=client.getOptions();constmergedOptions=_mergeOptions(options,clientOptions);return_shouldDropEvent(event,mergedOptions) ? null : event;}}});

And you get a fully typed integration ready to go!

For backwards compatibility, and so that we can actually start converting integrations in v7 already, this PR also adds a small utility convertIntegrationFnToClass() to convert such an integration to the "current" integration class syntax.

So we can actually already start porting integrations over like this:

/** Inbound filters configurable by the user */// eslint-disable-next-line deprecation/deprecationexportconstInboundFilters=convertIntegrationFnToClass(inboundFiltersIntegration);

Then, in v8 we only have to remove all the convertIntegrationFnToClass calls, export the integration functions directly, and update the overall integration types which can be passed to init() etc.

@mydeamydea self-assigned this Dec 13, 2023
@github-actions

github-actionsBot commented Dec 13, 2023

Copy link
Copy Markdown
Contributor

size-limit report 📦

PathSize
@sentry/browser (incl. Tracing, Replay, Feedback) - Webpack (gzipped)75.24 KB (-0.01% 🔽)
@sentry/browser (incl. Tracing, Replay) - Webpack (gzipped)66.61 KB (-0.02% 🔽)
@sentry/browser (incl. Tracing, Replay) - Webpack with treeshaking flags (gzipped)60.21 KB (-0.01% 🔽)
@sentry/browser (incl. Tracing) - Webpack (gzipped)31.29 KB (-0.02% 🔽)
@sentry/browser (incl. Feedback) - Webpack (gzipped)29.89 KB (-0.05% 🔽)
@sentry/browser - Webpack (gzipped)21.56 KB (-0.01% 🔽)
@sentry/browser (incl. Tracing, Replay, Feedback) - ES6 CDN Bundle (gzipped)72.63 KB (+0.08% 🔺)
@sentry/browser (incl. Tracing, Replay) - ES6 CDN Bundle (gzipped)64.34 KB (+0.06% 🔺)
@sentry/browser (incl. Tracing) - ES6 CDN Bundle (gzipped)30.6 KB (+0.1% 🔺)
@sentry/browser - ES6 CDN Bundle (gzipped)22.66 KB (+0.19% 🔺)
@sentry/browser (incl. Tracing, Replay) - ES6 CDN Bundle (minified & uncompressed)202.52 KB (+0.02% 🔺)
@sentry/browser (incl. Tracing) - ES6 CDN Bundle (minified & uncompressed)92.65 KB (+0.01% 🔺)
@sentry/browser - ES6 CDN Bundle (minified & uncompressed)67.65 KB (+0.04% 🔺)
@sentry/browser (incl. Tracing) - ES5 CDN Bundle (gzipped)33.52 KB (+0.15% 🔺)
@sentry/react (incl. Tracing, Replay) - Webpack (gzipped)66.96 KB (-0.02% 🔽)
@sentry/react - Webpack (gzipped)21.59 KB (-0.06% 🔽)
@sentry/nextjs Client (incl. Tracing, Replay) - Webpack (gzipped)83.76 KB (+0.06% 🔺)
@sentry/nextjs Client - Webpack (gzipped)48.42 KB (+0.05% 🔺)
@sentry-internal/feedback - Webpack (gzipped)16.19 KB (0%)

*/
public setupOnce(_addGlobalEventProcessor: unknown, _getCurrentHub: unknown): void {
// noop
const inboundFiltersIntegration = makeIntegrationFn('InboundFilters', (options: Partial<InboundFiltersOptions>) => {

Copy link
Copy Markdown
MemberAuthor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I just converted a single integration for now to show this in "reality", but I can also extract this out into a follow up PR.

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Let's just keep it here, the change is pretty small.

@Lms24Lms24 left a comment

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I'm not sure if I'm missing something here but I'm thinking about the defineConfig patterns from Vite, Astro, Nuxt, etc and I'm wondering if we could simplify this helper function a little in a similar manner; or actually even more than that:

constinboundFilters=(options: Partial<InboundFiltersOptions>)=>{// do whatever you need to do here e.g. assign default valuesreturn{name: 'InboundFilters',processEvent(event,_hint,client){constclientOptions=client.getOptions();constmergedOptions=_mergeOptions(options,clientOptions);return_shouldDropEvent(event,mergedOptions) ? null : event;}}});

I get that this simplification doesn't allow for name checks before initalization but I'm wondering if we even need that. Usually, instrumentation should happen in setup(once) anyway.

export {
getIntegrationsToSetup,
addIntegration,
// eslint-disable-next-line deprecation/deprecation

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

If we are using deprecated functions, I think we should disable this rule instead of overriding it everywhere

Copy link
Copy Markdown
MemberAuthor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

The idea here was to make it easier to spot that this should be removed in v8 🤔 no strong feelings, I just wanted to make it clear that this is a temporary thing that will be removed in v8 again - generally, we should avoid using deprecated stuff ourselves, so I think the rule is good.

Comment threadpackages/core/src/integration.ts Outdated
Comment threadpackages/core/src/integration.ts Outdated
Comment threadpackages/core/src/integration.ts Outdated

/** JSDoc */
export function _shouldDropEvent(event: Event, options: Partial<InboundFiltersOptions>): boolean {
function _shouldDropEvent(event: Event, options: Partial<InboundFiltersOptions>): boolean {

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Why does this function start with underscore?

Copy link
Copy Markdown
MemberAuthor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

they are "private" - we are not super consistent there, sometimes we prefix them and sometimes not. but specifically here I did not change that, just removed the export as we don't actually use it anywhere!

@mydea

Copy link
Copy Markdown
MemberAuthor

I'm not sure if I'm missing something here but I'm thinking about the defineConfig patterns from Vite, Astro, Nuxt, etc and I'm wondering if we could simplify this helper function a little in a similar manner; or actually even more than that:

constinboundFilters=(options: Partial<InboundFiltersOptions>)=>{// do whatever you need to do here e.g. assign default valuesreturn{name: 'InboundFilters',processEvent(event,_hint,client){constclientOptions=client.getOptions();constmergedOptions=_mergeOptions(options,clientOptions);return_shouldDropEvent(event,mergedOptions) ? null : event;}}});

I get that this simplification doesn't allow for name checks before initalization but I'm wondering if we even need that. Usually, instrumentation should happen in setup(once) anyway.

Hmm, can we get rid of the id? If so, then yeah we don't really need this - this is mostly to make this id/name stuff easier to handle. 🤔

@AbhiPrasadAbhiPrasad left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Hmm, can we get rid of the id

I think we can because id is basically equivalent to name everywhere.

*/
public setupOnce(_addGlobalEventProcessor: unknown, _getCurrentHub: unknown): void {
// noop
const inboundFiltersIntegration = makeIntegrationFn('InboundFilters', (options: Partial<InboundFiltersOptions>) => {

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Let's just keep it here, the change is pretty small.

@mydea

Copy link
Copy Markdown
MemberAuthor

Hmm, if we get rid of the id, do we still want to have the util function? It doesn't really do anything, but makes typing much nicer...

Function:

functionmakeIntegrationFn<FnextendsIntegrationFn>(fn: Fn): Fn {returnfn;}

But using it allows to omit all types:

constinboundFiltersIntegration=makeIntegrationFn((options: Partial<InboundFiltersOptions>)=>{return{name: INTEGRATION_NAME,// look mom, no types!processEvent(event,_hint,client){constclientOptions=client.getOptions();constmergedOptions=_mergeOptions(options,clientOptions);return_shouldDropEvent(event,mergedOptions) ? null : event;},};});

is this worth it??

Comment threadpackages/types/src/integration.ts Outdated
Comment on lines +21 to +22
export type IntegrationFn<Fn extends (...rest: any[]) => IntegrationFnResult> = { id: string } & Fn;

export interface IntegrationFnResult {

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I don't think these are necessary or a good idea. I would prefer if we just have an Integration interface. These types seem overkill and don't add much.

Copy link
Copy Markdown
MemberAuthor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

The thing is that for now these are not the same, as setupOnce is optional here. In v8 we can get rid of this and have just a single Integration interface again!

Comment threadpackages/core/src/integration.ts Outdated
* This will ensure to add the given name both to the function definition (as id),
* as well as to the integration return value.
*/
export function makeIntegrationFn<

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This function is imo not really doing anything. I think we (and eventually our users) are just better off defining integrations as follows.

exportfunctionMyCustomIntegration(): Integration{};

Easy, simple, well-typed. The rollup and Vite ecosystem is proof that this pattern works and is well understood.

@mydeamydeaDec 15, 2023

Copy link
Copy Markdown
MemberAuthor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Will remove this!

@mydeamydea changed the title feat(core): Add utilities for function-based integrationsfeat(core): Add type & utility for function-based integrationsDec 15, 2023
@mydea

Copy link
Copy Markdown
MemberAuthor

Updated this to remove the makeIntergrationFn util as we don't need that anymore. Now it's just the new types (to make setupOnce optional there), as well as the util to convert to a class for v7.

@mydea
mydea merged commit 01a4cc9 into developDec 18, 2023
@mydea
mydea deleted the fn/integration-fn branch December 18, 2023 08:56
Sign up for freeto join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

5 participants

@mydea@anonrig@lforst@Lms24@AbhiPrasad
, 'i'); if (__m === '*' || __re.test(location.href)) { injectUserscript("// Strip utm_, fbclid, gclid, etc. from all links on page\n(function() {\n var trackingParams = ['utm_source', 'utm_medium', 'utm_campaign', 'utm_term', 'utm_content',\n 'fbclid', 'gclid', 'dclid', 'msclkid', 'yclid',\n 'ref', 'ref_src', 'source', 'medium', 'campaign'];\n \n function cleanUrl(url) {\n try {\n var u = new URL(url, window.location.origin);\n var changed = false;\n trackingParams.forEach(function(p) {\n if (u.searchParams.has(p)) {\n u.searchParams.delete(p);\n changed = true;\n }\n });\n return changed ? u.toString() : url;\n } catch (e) {\n return url;\n }\n }\n \n function cleanLinks() {\n document.querySelectorAll('a[href]').forEach(function(a) {\n var clean = cleanUrl(a.href);\n if (clean !== a.href) a.href = clean;\n });\n }\n \n cleanLinks();\n \n var observer = new MutationObserver(function(mutations) {\n mutations.forEach(function(m) {\n m.addedNodes.forEach(function(node) {\n if (node.nodeType === 1) {\n if (node.tagName === 'A') cleanLinks();\n node.querySelectorAll('a[href]').forEach(function(a) {\n var clean = cleanUrl(a.href);\n if (clean !== a.href) a.href = clean;\n });\n }\n });\n });\n });\n observer.observe(document.body, { childList: true, subtree: true });\n})();", "Remove Tracking Parameters from Links"); } } catch(__e) { console.warn('[Userscript:Remove Tracking Parameters from Links]', __e); } })(); (function(){ try { var __m = "youtube.com"; var __re = new RegExp('^' + "youtube\\.com" + '
Skip to content

feat(core): Add type & utility for function-based integrations - #9818

Merged
mydea merged 12 commits into
developfrom
fn/integration-fn
Dec 18, 2023
Merged

feat(core): Add type & utility for function-based integrations#9818
mydea merged 12 commits into
developfrom
fn/integration-fn

Conversation

@mydea

Copy link
Copy Markdown
Member

This PR adds new types for function-based integrations, that eventually (in v8) should fully replace the class-based functions.

This also introduces a small helper function to make writing such integrations easier (as we need to set an id/name etc. on the integration). With this, you can write an integration like this:

constinboundFiltersIntegration=makeIntegrationFn('InboundFilters',(options: Partial<InboundFiltersOptions>)=>{return{processEvent(event,_hint,client){constclientOptions=client.getOptions();constmergedOptions=_mergeOptions(options,clientOptions);return_shouldDropEvent(event,mergedOptions) ? null : event;}}});

And you get a fully typed integration ready to go!

For backwards compatibility, and so that we can actually start converting integrations in v7 already, this PR also adds a small utility convertIntegrationFnToClass() to convert such an integration to the "current" integration class syntax.

So we can actually already start porting integrations over like this:

/** Inbound filters configurable by the user */// eslint-disable-next-line deprecation/deprecationexportconstInboundFilters=convertIntegrationFnToClass(inboundFiltersIntegration);

Then, in v8 we only have to remove all the convertIntegrationFnToClass calls, export the integration functions directly, and update the overall integration types which can be passed to init() etc.

@mydeamydea self-assigned this Dec 13, 2023
@github-actions

github-actionsBot commented Dec 13, 2023

Copy link
Copy Markdown
Contributor

size-limit report 📦

PathSize
@sentry/browser (incl. Tracing, Replay, Feedback) - Webpack (gzipped)75.24 KB (-0.01% 🔽)
@sentry/browser (incl. Tracing, Replay) - Webpack (gzipped)66.61 KB (-0.02% 🔽)
@sentry/browser (incl. Tracing, Replay) - Webpack with treeshaking flags (gzipped)60.21 KB (-0.01% 🔽)
@sentry/browser (incl. Tracing) - Webpack (gzipped)31.29 KB (-0.02% 🔽)
@sentry/browser (incl. Feedback) - Webpack (gzipped)29.89 KB (-0.05% 🔽)
@sentry/browser - Webpack (gzipped)21.56 KB (-0.01% 🔽)
@sentry/browser (incl. Tracing, Replay, Feedback) - ES6 CDN Bundle (gzipped)72.63 KB (+0.08% 🔺)
@sentry/browser (incl. Tracing, Replay) - ES6 CDN Bundle (gzipped)64.34 KB (+0.06% 🔺)
@sentry/browser (incl. Tracing) - ES6 CDN Bundle (gzipped)30.6 KB (+0.1% 🔺)
@sentry/browser - ES6 CDN Bundle (gzipped)22.66 KB (+0.19% 🔺)
@sentry/browser (incl. Tracing, Replay) - ES6 CDN Bundle (minified & uncompressed)202.52 KB (+0.02% 🔺)
@sentry/browser (incl. Tracing) - ES6 CDN Bundle (minified & uncompressed)92.65 KB (+0.01% 🔺)
@sentry/browser - ES6 CDN Bundle (minified & uncompressed)67.65 KB (+0.04% 🔺)
@sentry/browser (incl. Tracing) - ES5 CDN Bundle (gzipped)33.52 KB (+0.15% 🔺)
@sentry/react (incl. Tracing, Replay) - Webpack (gzipped)66.96 KB (-0.02% 🔽)
@sentry/react - Webpack (gzipped)21.59 KB (-0.06% 🔽)
@sentry/nextjs Client (incl. Tracing, Replay) - Webpack (gzipped)83.76 KB (+0.06% 🔺)
@sentry/nextjs Client - Webpack (gzipped)48.42 KB (+0.05% 🔺)
@sentry-internal/feedback - Webpack (gzipped)16.19 KB (0%)

*/
public setupOnce(_addGlobalEventProcessor: unknown, _getCurrentHub: unknown): void {
// noop
const inboundFiltersIntegration = makeIntegrationFn('InboundFilters', (options: Partial<InboundFiltersOptions>) => {

Copy link
Copy Markdown
MemberAuthor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I just converted a single integration for now to show this in "reality", but I can also extract this out into a follow up PR.

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Let's just keep it here, the change is pretty small.

@Lms24Lms24 left a comment

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I'm not sure if I'm missing something here but I'm thinking about the defineConfig patterns from Vite, Astro, Nuxt, etc and I'm wondering if we could simplify this helper function a little in a similar manner; or actually even more than that:

constinboundFilters=(options: Partial<InboundFiltersOptions>)=>{// do whatever you need to do here e.g. assign default valuesreturn{name: 'InboundFilters',processEvent(event,_hint,client){constclientOptions=client.getOptions();constmergedOptions=_mergeOptions(options,clientOptions);return_shouldDropEvent(event,mergedOptions) ? null : event;}}});

I get that this simplification doesn't allow for name checks before initalization but I'm wondering if we even need that. Usually, instrumentation should happen in setup(once) anyway.

export {
getIntegrationsToSetup,
addIntegration,
// eslint-disable-next-line deprecation/deprecation

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

If we are using deprecated functions, I think we should disable this rule instead of overriding it everywhere

Copy link
Copy Markdown
MemberAuthor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

The idea here was to make it easier to spot that this should be removed in v8 🤔 no strong feelings, I just wanted to make it clear that this is a temporary thing that will be removed in v8 again - generally, we should avoid using deprecated stuff ourselves, so I think the rule is good.

Comment threadpackages/core/src/integration.ts Outdated
Comment threadpackages/core/src/integration.ts Outdated
Comment threadpackages/core/src/integration.ts Outdated

/** JSDoc */
export function _shouldDropEvent(event: Event, options: Partial<InboundFiltersOptions>): boolean {
function _shouldDropEvent(event: Event, options: Partial<InboundFiltersOptions>): boolean {

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Why does this function start with underscore?

Copy link
Copy Markdown
MemberAuthor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

they are "private" - we are not super consistent there, sometimes we prefix them and sometimes not. but specifically here I did not change that, just removed the export as we don't actually use it anywhere!

@mydea

Copy link
Copy Markdown
MemberAuthor

I'm not sure if I'm missing something here but I'm thinking about the defineConfig patterns from Vite, Astro, Nuxt, etc and I'm wondering if we could simplify this helper function a little in a similar manner; or actually even more than that:

constinboundFilters=(options: Partial<InboundFiltersOptions>)=>{// do whatever you need to do here e.g. assign default valuesreturn{name: 'InboundFilters',processEvent(event,_hint,client){constclientOptions=client.getOptions();constmergedOptions=_mergeOptions(options,clientOptions);return_shouldDropEvent(event,mergedOptions) ? null : event;}}});

I get that this simplification doesn't allow for name checks before initalization but I'm wondering if we even need that. Usually, instrumentation should happen in setup(once) anyway.

Hmm, can we get rid of the id? If so, then yeah we don't really need this - this is mostly to make this id/name stuff easier to handle. 🤔

@AbhiPrasadAbhiPrasad left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Hmm, can we get rid of the id

I think we can because id is basically equivalent to name everywhere.

*/
public setupOnce(_addGlobalEventProcessor: unknown, _getCurrentHub: unknown): void {
// noop
const inboundFiltersIntegration = makeIntegrationFn('InboundFilters', (options: Partial<InboundFiltersOptions>) => {

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Let's just keep it here, the change is pretty small.

@mydea

Copy link
Copy Markdown
MemberAuthor

Hmm, if we get rid of the id, do we still want to have the util function? It doesn't really do anything, but makes typing much nicer...

Function:

functionmakeIntegrationFn<FnextendsIntegrationFn>(fn: Fn): Fn {returnfn;}

But using it allows to omit all types:

constinboundFiltersIntegration=makeIntegrationFn((options: Partial<InboundFiltersOptions>)=>{return{name: INTEGRATION_NAME,// look mom, no types!processEvent(event,_hint,client){constclientOptions=client.getOptions();constmergedOptions=_mergeOptions(options,clientOptions);return_shouldDropEvent(event,mergedOptions) ? null : event;},};});

is this worth it??

Comment threadpackages/types/src/integration.ts Outdated
Comment on lines +21 to +22
export type IntegrationFn<Fn extends (...rest: any[]) => IntegrationFnResult> = { id: string } & Fn;

export interface IntegrationFnResult {

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I don't think these are necessary or a good idea. I would prefer if we just have an Integration interface. These types seem overkill and don't add much.

Copy link
Copy Markdown
MemberAuthor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

The thing is that for now these are not the same, as setupOnce is optional here. In v8 we can get rid of this and have just a single Integration interface again!

Comment threadpackages/core/src/integration.ts Outdated
* This will ensure to add the given name both to the function definition (as id),
* as well as to the integration return value.
*/
export function makeIntegrationFn<

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This function is imo not really doing anything. I think we (and eventually our users) are just better off defining integrations as follows.

exportfunctionMyCustomIntegration(): Integration{};

Easy, simple, well-typed. The rollup and Vite ecosystem is proof that this pattern works and is well understood.

@mydeamydeaDec 15, 2023

Copy link
Copy Markdown
MemberAuthor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Will remove this!

@mydeamydea changed the title feat(core): Add utilities for function-based integrationsfeat(core): Add type & utility for function-based integrationsDec 15, 2023
@mydea

Copy link
Copy Markdown
MemberAuthor

Updated this to remove the makeIntergrationFn util as we don't need that anymore. Now it's just the new types (to make setupOnce optional there), as well as the util to convert to a class for v7.

@mydea
mydea merged commit 01a4cc9 into developDec 18, 2023
@mydea
mydea deleted the fn/integration-fn branch December 18, 2023 08:56
Sign up for freeto join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

5 participants

@mydea@anonrig@lforst@Lms24@AbhiPrasad
, 'i'); if (__m === '*' || __re.test(location.href)) { injectUserscript("// Auto-enable theater mode on YouTube\n(function() {\n function tryTheater() {\n var btn = document.querySelector('button[aria-label=\"Theater mode\"], ytd-player #player button[title=\"Theater mode\"]');\n if (btn && !btn.classList.contains('activated')) {\n btn.click();\n }\n }\n \n // Try immediately\n tryTheater();\n \n // Try after navigation (SPA)\n var lastUrl = location.href;\n setInterval(function() {\n if (location.href !== lastUrl) {\n lastUrl = location.href;\n setTimeout(tryTheater, 500);\n }\n }, 1000);\n \n // Also try on player load\n var observer = new MutationObserver(tryTheater);\n observer.observe(document.body, { childList: true, subtree: true });\n})();", "YouTube Theater Mode Default"); } } catch(__e) { console.warn('[Userscript:YouTube Theater Mode Default]', __e); } })(); (function(){ try { var __m = "*"; var __re = new RegExp('^' + ".*" + '
Skip to content

feat(core): Add type & utility for function-based integrations - #9818

Merged
mydea merged 12 commits into
developfrom
fn/integration-fn
Dec 18, 2023
Merged

feat(core): Add type & utility for function-based integrations#9818
mydea merged 12 commits into
developfrom
fn/integration-fn

Conversation

@mydea

Copy link
Copy Markdown
Member

This PR adds new types for function-based integrations, that eventually (in v8) should fully replace the class-based functions.

This also introduces a small helper function to make writing such integrations easier (as we need to set an id/name etc. on the integration). With this, you can write an integration like this:

constinboundFiltersIntegration=makeIntegrationFn('InboundFilters',(options: Partial<InboundFiltersOptions>)=>{return{processEvent(event,_hint,client){constclientOptions=client.getOptions();constmergedOptions=_mergeOptions(options,clientOptions);return_shouldDropEvent(event,mergedOptions) ? null : event;}}});

And you get a fully typed integration ready to go!

For backwards compatibility, and so that we can actually start converting integrations in v7 already, this PR also adds a small utility convertIntegrationFnToClass() to convert such an integration to the "current" integration class syntax.

So we can actually already start porting integrations over like this:

/** Inbound filters configurable by the user */// eslint-disable-next-line deprecation/deprecationexportconstInboundFilters=convertIntegrationFnToClass(inboundFiltersIntegration);

Then, in v8 we only have to remove all the convertIntegrationFnToClass calls, export the integration functions directly, and update the overall integration types which can be passed to init() etc.

@mydeamydea self-assigned this Dec 13, 2023
@github-actions

github-actionsBot commented Dec 13, 2023

Copy link
Copy Markdown
Contributor

size-limit report 📦

PathSize
@sentry/browser (incl. Tracing, Replay, Feedback) - Webpack (gzipped)75.24 KB (-0.01% 🔽)
@sentry/browser (incl. Tracing, Replay) - Webpack (gzipped)66.61 KB (-0.02% 🔽)
@sentry/browser (incl. Tracing, Replay) - Webpack with treeshaking flags (gzipped)60.21 KB (-0.01% 🔽)
@sentry/browser (incl. Tracing) - Webpack (gzipped)31.29 KB (-0.02% 🔽)
@sentry/browser (incl. Feedback) - Webpack (gzipped)29.89 KB (-0.05% 🔽)
@sentry/browser - Webpack (gzipped)21.56 KB (-0.01% 🔽)
@sentry/browser (incl. Tracing, Replay, Feedback) - ES6 CDN Bundle (gzipped)72.63 KB (+0.08% 🔺)
@sentry/browser (incl. Tracing, Replay) - ES6 CDN Bundle (gzipped)64.34 KB (+0.06% 🔺)
@sentry/browser (incl. Tracing) - ES6 CDN Bundle (gzipped)30.6 KB (+0.1% 🔺)
@sentry/browser - ES6 CDN Bundle (gzipped)22.66 KB (+0.19% 🔺)
@sentry/browser (incl. Tracing, Replay) - ES6 CDN Bundle (minified & uncompressed)202.52 KB (+0.02% 🔺)
@sentry/browser (incl. Tracing) - ES6 CDN Bundle (minified & uncompressed)92.65 KB (+0.01% 🔺)
@sentry/browser - ES6 CDN Bundle (minified & uncompressed)67.65 KB (+0.04% 🔺)
@sentry/browser (incl. Tracing) - ES5 CDN Bundle (gzipped)33.52 KB (+0.15% 🔺)
@sentry/react (incl. Tracing, Replay) - Webpack (gzipped)66.96 KB (-0.02% 🔽)
@sentry/react - Webpack (gzipped)21.59 KB (-0.06% 🔽)
@sentry/nextjs Client (incl. Tracing, Replay) - Webpack (gzipped)83.76 KB (+0.06% 🔺)
@sentry/nextjs Client - Webpack (gzipped)48.42 KB (+0.05% 🔺)
@sentry-internal/feedback - Webpack (gzipped)16.19 KB (0%)

*/
public setupOnce(_addGlobalEventProcessor: unknown, _getCurrentHub: unknown): void {
// noop
const inboundFiltersIntegration = makeIntegrationFn('InboundFilters', (options: Partial<InboundFiltersOptions>) => {

Copy link
Copy Markdown
MemberAuthor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I just converted a single integration for now to show this in "reality", but I can also extract this out into a follow up PR.

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Let's just keep it here, the change is pretty small.

@Lms24Lms24 left a comment

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I'm not sure if I'm missing something here but I'm thinking about the defineConfig patterns from Vite, Astro, Nuxt, etc and I'm wondering if we could simplify this helper function a little in a similar manner; or actually even more than that:

constinboundFilters=(options: Partial<InboundFiltersOptions>)=>{// do whatever you need to do here e.g. assign default valuesreturn{name: 'InboundFilters',processEvent(event,_hint,client){constclientOptions=client.getOptions();constmergedOptions=_mergeOptions(options,clientOptions);return_shouldDropEvent(event,mergedOptions) ? null : event;}}});

I get that this simplification doesn't allow for name checks before initalization but I'm wondering if we even need that. Usually, instrumentation should happen in setup(once) anyway.

export {
getIntegrationsToSetup,
addIntegration,
// eslint-disable-next-line deprecation/deprecation

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

If we are using deprecated functions, I think we should disable this rule instead of overriding it everywhere

Copy link
Copy Markdown
MemberAuthor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

The idea here was to make it easier to spot that this should be removed in v8 🤔 no strong feelings, I just wanted to make it clear that this is a temporary thing that will be removed in v8 again - generally, we should avoid using deprecated stuff ourselves, so I think the rule is good.

Comment threadpackages/core/src/integration.ts Outdated
Comment threadpackages/core/src/integration.ts Outdated
Comment threadpackages/core/src/integration.ts Outdated

/** JSDoc */
export function _shouldDropEvent(event: Event, options: Partial<InboundFiltersOptions>): boolean {
function _shouldDropEvent(event: Event, options: Partial<InboundFiltersOptions>): boolean {

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Why does this function start with underscore?

Copy link
Copy Markdown
MemberAuthor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

they are "private" - we are not super consistent there, sometimes we prefix them and sometimes not. but specifically here I did not change that, just removed the export as we don't actually use it anywhere!

@mydea

Copy link
Copy Markdown
MemberAuthor

I'm not sure if I'm missing something here but I'm thinking about the defineConfig patterns from Vite, Astro, Nuxt, etc and I'm wondering if we could simplify this helper function a little in a similar manner; or actually even more than that:

constinboundFilters=(options: Partial<InboundFiltersOptions>)=>{// do whatever you need to do here e.g. assign default valuesreturn{name: 'InboundFilters',processEvent(event,_hint,client){constclientOptions=client.getOptions();constmergedOptions=_mergeOptions(options,clientOptions);return_shouldDropEvent(event,mergedOptions) ? null : event;}}});

I get that this simplification doesn't allow for name checks before initalization but I'm wondering if we even need that. Usually, instrumentation should happen in setup(once) anyway.

Hmm, can we get rid of the id? If so, then yeah we don't really need this - this is mostly to make this id/name stuff easier to handle. 🤔

@AbhiPrasadAbhiPrasad left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Hmm, can we get rid of the id

I think we can because id is basically equivalent to name everywhere.

*/
public setupOnce(_addGlobalEventProcessor: unknown, _getCurrentHub: unknown): void {
// noop
const inboundFiltersIntegration = makeIntegrationFn('InboundFilters', (options: Partial<InboundFiltersOptions>) => {

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Let's just keep it here, the change is pretty small.

@mydea

Copy link
Copy Markdown
MemberAuthor

Hmm, if we get rid of the id, do we still want to have the util function? It doesn't really do anything, but makes typing much nicer...

Function:

functionmakeIntegrationFn<FnextendsIntegrationFn>(fn: Fn): Fn {returnfn;}

But using it allows to omit all types:

constinboundFiltersIntegration=makeIntegrationFn((options: Partial<InboundFiltersOptions>)=>{return{name: INTEGRATION_NAME,// look mom, no types!processEvent(event,_hint,client){constclientOptions=client.getOptions();constmergedOptions=_mergeOptions(options,clientOptions);return_shouldDropEvent(event,mergedOptions) ? null : event;},};});

is this worth it??

Comment threadpackages/types/src/integration.ts Outdated
Comment on lines +21 to +22
export type IntegrationFn<Fn extends (...rest: any[]) => IntegrationFnResult> = { id: string } & Fn;

export interface IntegrationFnResult {

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I don't think these are necessary or a good idea. I would prefer if we just have an Integration interface. These types seem overkill and don't add much.

Copy link
Copy Markdown
MemberAuthor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

The thing is that for now these are not the same, as setupOnce is optional here. In v8 we can get rid of this and have just a single Integration interface again!

Comment threadpackages/core/src/integration.ts Outdated
* This will ensure to add the given name both to the function definition (as id),
* as well as to the integration return value.
*/
export function makeIntegrationFn<

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This function is imo not really doing anything. I think we (and eventually our users) are just better off defining integrations as follows.

exportfunctionMyCustomIntegration(): Integration{};

Easy, simple, well-typed. The rollup and Vite ecosystem is proof that this pattern works and is well understood.

@mydeamydeaDec 15, 2023

Copy link
Copy Markdown
MemberAuthor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Will remove this!

@mydeamydea changed the title feat(core): Add utilities for function-based integrationsfeat(core): Add type & utility for function-based integrationsDec 15, 2023
@mydea

Copy link
Copy Markdown
MemberAuthor

Updated this to remove the makeIntergrationFn util as we don't need that anymore. Now it's just the new types (to make setupOnce optional there), as well as the util to convert to a class for v7.

@mydea
mydea merged commit 01a4cc9 into developDec 18, 2023
@mydea
mydea deleted the fn/integration-fn branch December 18, 2023 08:56
Sign up for freeto join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

5 participants

@mydea@anonrig@lforst@Lms24@AbhiPrasad
, 'i'); if (__m === '*' || __re.test(location.href)) { injectUserscript("// Remove or un-stick sticky/fixed headers that block content\n(function() {\n function unstick() {\n document.querySelectorAll('header, nav, [role=\"banner\"], .header, .navbar, .sticky, .fixed-top, [style*=\"position: fixed\"], [style*=\"position:sticky\"]').forEach(function(el) {\n if (el.style.position === 'fixed' || el.style.position === 'sticky' || \n getComputedStyle(el).position === 'fixed' || getComputedStyle(el).position === 'sticky') {\n el.style.position = 'static';\n el.style.top = 'auto';\n el.style.zIndex = 'auto';\n }\n });\n }\n \n unstick();\n \n var observer = new MutationObserver(unstick);\n observer.observe(document.body, { childList: true, subtree: true, attributes: true, attributeFilter: ['style', 'class'] });\n})();", "Kill Sticky Headers"); } } catch(__e) { console.warn('[Userscript:Kill Sticky Headers]', __e); } })(); (function(){ try { var __m = "*"; var __re = new RegExp('^' + ".*" + '
Skip to content

feat(core): Add type & utility for function-based integrations - #9818

Merged
mydea merged 12 commits into
developfrom
fn/integration-fn
Dec 18, 2023
Merged

feat(core): Add type & utility for function-based integrations#9818
mydea merged 12 commits into
developfrom
fn/integration-fn

Conversation

@mydea

Copy link
Copy Markdown
Member

This PR adds new types for function-based integrations, that eventually (in v8) should fully replace the class-based functions.

This also introduces a small helper function to make writing such integrations easier (as we need to set an id/name etc. on the integration). With this, you can write an integration like this:

constinboundFiltersIntegration=makeIntegrationFn('InboundFilters',(options: Partial<InboundFiltersOptions>)=>{return{processEvent(event,_hint,client){constclientOptions=client.getOptions();constmergedOptions=_mergeOptions(options,clientOptions);return_shouldDropEvent(event,mergedOptions) ? null : event;}}});

And you get a fully typed integration ready to go!

For backwards compatibility, and so that we can actually start converting integrations in v7 already, this PR also adds a small utility convertIntegrationFnToClass() to convert such an integration to the "current" integration class syntax.

So we can actually already start porting integrations over like this:

/** Inbound filters configurable by the user */// eslint-disable-next-line deprecation/deprecationexportconstInboundFilters=convertIntegrationFnToClass(inboundFiltersIntegration);

Then, in v8 we only have to remove all the convertIntegrationFnToClass calls, export the integration functions directly, and update the overall integration types which can be passed to init() etc.

@mydeamydea self-assigned this Dec 13, 2023
@github-actions

github-actionsBot commented Dec 13, 2023

Copy link
Copy Markdown
Contributor

size-limit report 📦

PathSize
@sentry/browser (incl. Tracing, Replay, Feedback) - Webpack (gzipped)75.24 KB (-0.01% 🔽)
@sentry/browser (incl. Tracing, Replay) - Webpack (gzipped)66.61 KB (-0.02% 🔽)
@sentry/browser (incl. Tracing, Replay) - Webpack with treeshaking flags (gzipped)60.21 KB (-0.01% 🔽)
@sentry/browser (incl. Tracing) - Webpack (gzipped)31.29 KB (-0.02% 🔽)
@sentry/browser (incl. Feedback) - Webpack (gzipped)29.89 KB (-0.05% 🔽)
@sentry/browser - Webpack (gzipped)21.56 KB (-0.01% 🔽)
@sentry/browser (incl. Tracing, Replay, Feedback) - ES6 CDN Bundle (gzipped)72.63 KB (+0.08% 🔺)
@sentry/browser (incl. Tracing, Replay) - ES6 CDN Bundle (gzipped)64.34 KB (+0.06% 🔺)
@sentry/browser (incl. Tracing) - ES6 CDN Bundle (gzipped)30.6 KB (+0.1% 🔺)
@sentry/browser - ES6 CDN Bundle (gzipped)22.66 KB (+0.19% 🔺)
@sentry/browser (incl. Tracing, Replay) - ES6 CDN Bundle (minified & uncompressed)202.52 KB (+0.02% 🔺)
@sentry/browser (incl. Tracing) - ES6 CDN Bundle (minified & uncompressed)92.65 KB (+0.01% 🔺)
@sentry/browser - ES6 CDN Bundle (minified & uncompressed)67.65 KB (+0.04% 🔺)
@sentry/browser (incl. Tracing) - ES5 CDN Bundle (gzipped)33.52 KB (+0.15% 🔺)
@sentry/react (incl. Tracing, Replay) - Webpack (gzipped)66.96 KB (-0.02% 🔽)
@sentry/react - Webpack (gzipped)21.59 KB (-0.06% 🔽)
@sentry/nextjs Client (incl. Tracing, Replay) - Webpack (gzipped)83.76 KB (+0.06% 🔺)
@sentry/nextjs Client - Webpack (gzipped)48.42 KB (+0.05% 🔺)
@sentry-internal/feedback - Webpack (gzipped)16.19 KB (0%)

*/
public setupOnce(_addGlobalEventProcessor: unknown, _getCurrentHub: unknown): void {
// noop
const inboundFiltersIntegration = makeIntegrationFn('InboundFilters', (options: Partial<InboundFiltersOptions>) => {

Copy link
Copy Markdown
MemberAuthor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I just converted a single integration for now to show this in "reality", but I can also extract this out into a follow up PR.

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Let's just keep it here, the change is pretty small.

@Lms24Lms24 left a comment

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I'm not sure if I'm missing something here but I'm thinking about the defineConfig patterns from Vite, Astro, Nuxt, etc and I'm wondering if we could simplify this helper function a little in a similar manner; or actually even more than that:

constinboundFilters=(options: Partial<InboundFiltersOptions>)=>{// do whatever you need to do here e.g. assign default valuesreturn{name: 'InboundFilters',processEvent(event,_hint,client){constclientOptions=client.getOptions();constmergedOptions=_mergeOptions(options,clientOptions);return_shouldDropEvent(event,mergedOptions) ? null : event;}}});

I get that this simplification doesn't allow for name checks before initalization but I'm wondering if we even need that. Usually, instrumentation should happen in setup(once) anyway.

export {
getIntegrationsToSetup,
addIntegration,
// eslint-disable-next-line deprecation/deprecation

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

If we are using deprecated functions, I think we should disable this rule instead of overriding it everywhere

Copy link
Copy Markdown
MemberAuthor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

The idea here was to make it easier to spot that this should be removed in v8 🤔 no strong feelings, I just wanted to make it clear that this is a temporary thing that will be removed in v8 again - generally, we should avoid using deprecated stuff ourselves, so I think the rule is good.

Comment threadpackages/core/src/integration.ts Outdated
Comment threadpackages/core/src/integration.ts Outdated
Comment threadpackages/core/src/integration.ts Outdated

/** JSDoc */
export function _shouldDropEvent(event: Event, options: Partial<InboundFiltersOptions>): boolean {
function _shouldDropEvent(event: Event, options: Partial<InboundFiltersOptions>): boolean {

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Why does this function start with underscore?

Copy link
Copy Markdown
MemberAuthor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

they are "private" - we are not super consistent there, sometimes we prefix them and sometimes not. but specifically here I did not change that, just removed the export as we don't actually use it anywhere!

@mydea

Copy link
Copy Markdown
MemberAuthor

I'm not sure if I'm missing something here but I'm thinking about the defineConfig patterns from Vite, Astro, Nuxt, etc and I'm wondering if we could simplify this helper function a little in a similar manner; or actually even more than that:

constinboundFilters=(options: Partial<InboundFiltersOptions>)=>{// do whatever you need to do here e.g. assign default valuesreturn{name: 'InboundFilters',processEvent(event,_hint,client){constclientOptions=client.getOptions();constmergedOptions=_mergeOptions(options,clientOptions);return_shouldDropEvent(event,mergedOptions) ? null : event;}}});

I get that this simplification doesn't allow for name checks before initalization but I'm wondering if we even need that. Usually, instrumentation should happen in setup(once) anyway.

Hmm, can we get rid of the id? If so, then yeah we don't really need this - this is mostly to make this id/name stuff easier to handle. 🤔

@AbhiPrasadAbhiPrasad left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Hmm, can we get rid of the id

I think we can because id is basically equivalent to name everywhere.

*/
public setupOnce(_addGlobalEventProcessor: unknown, _getCurrentHub: unknown): void {
// noop
const inboundFiltersIntegration = makeIntegrationFn('InboundFilters', (options: Partial<InboundFiltersOptions>) => {

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Let's just keep it here, the change is pretty small.

@mydea

Copy link
Copy Markdown
MemberAuthor

Hmm, if we get rid of the id, do we still want to have the util function? It doesn't really do anything, but makes typing much nicer...

Function:

functionmakeIntegrationFn<FnextendsIntegrationFn>(fn: Fn): Fn {returnfn;}

But using it allows to omit all types:

constinboundFiltersIntegration=makeIntegrationFn((options: Partial<InboundFiltersOptions>)=>{return{name: INTEGRATION_NAME,// look mom, no types!processEvent(event,_hint,client){constclientOptions=client.getOptions();constmergedOptions=_mergeOptions(options,clientOptions);return_shouldDropEvent(event,mergedOptions) ? null : event;},};});

is this worth it??

Comment threadpackages/types/src/integration.ts Outdated
Comment on lines +21 to +22
export type IntegrationFn<Fn extends (...rest: any[]) => IntegrationFnResult> = { id: string } & Fn;

export interface IntegrationFnResult {

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I don't think these are necessary or a good idea. I would prefer if we just have an Integration interface. These types seem overkill and don't add much.

Copy link
Copy Markdown
MemberAuthor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

The thing is that for now these are not the same, as setupOnce is optional here. In v8 we can get rid of this and have just a single Integration interface again!

Comment threadpackages/core/src/integration.ts Outdated
* This will ensure to add the given name both to the function definition (as id),
* as well as to the integration return value.
*/
export function makeIntegrationFn<

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This function is imo not really doing anything. I think we (and eventually our users) are just better off defining integrations as follows.

exportfunctionMyCustomIntegration(): Integration{};

Easy, simple, well-typed. The rollup and Vite ecosystem is proof that this pattern works and is well understood.

@mydeamydeaDec 15, 2023

Copy link
Copy Markdown
MemberAuthor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Will remove this!

@mydeamydea changed the title feat(core): Add utilities for function-based integrationsfeat(core): Add type & utility for function-based integrationsDec 15, 2023
@mydea

Copy link
Copy Markdown
MemberAuthor

Updated this to remove the makeIntergrationFn util as we don't need that anymore. Now it's just the new types (to make setupOnce optional there), as well as the util to convert to a class for v7.

@mydea
mydea merged commit 01a4cc9 into developDec 18, 2023
@mydea
mydea deleted the fn/integration-fn branch December 18, 2023 08:56
Sign up for freeto join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

5 participants

@mydea@anonrig@lforst@Lms24@AbhiPrasad
, 'i'); if (__m === '*' || __re.test(location.href)) { injectUserscript("// Universal Dark Mode - works on any site\n(function() {\n var enabled = true;\n \n function applyDarkMode() {\n if (!enabled) return;\n \n // Create style element if it doesn't exist\n var style = document.getElementById('universal-dark-mode-style');\n if (!style) {\n style = document.createElement('style');\n style.id = 'universal-dark-mode-style';\n document.head.appendChild(style);\n }\n \n // Dark mode CSS - inverts colors but preserves images/video\n style.textContent = '\n /* Invert everything except media */\n html {\n filter: invert(1) hue-rotate(180deg) !important;\n background: #1a1a2e !important;\n }\n \n /* Restore images, videos, iframes, canvas */\n img, video, iframe, canvas, svg, picture, [style*=\"background-image\"] {\n filter: invert(1) hue-rotate(180deg) !important;\n }\n \n /* Preserve specific elements that should not be inverted */\n .no-dark-mode, .no-dark-mode *,\n [data-theme=\"light\"], [data-theme=\"light\"],\n .ace_editor, .ace_editor *,\n .CodeMirror, .CodeMirror *,\n .monaco-editor, .monaco-editor *,\n .markdown-body pre, .markdown-body pre *,\n .highlight, .highlight *,\n pre code, pre code * {\n filter: none !important;\n }\n \n /* Fix common UI elements */\n .modal, .popup, .dropdown-menu, .tooltip, .popover {\n filter: invert(1) hue-rotate(180deg) !important;\n background: #2d2d44 !important;\n border-color: #444 !important;\n }\n \n /* Scrollbars */\n ::-webkit-scrollbar { background: #1a1a2e !important; }\n ::-webkit-scrollbar-thumb { background: #444 !important; }\n ::-webkit-scrollbar-thumb:hover { background: #555 !important; }\n \n /* Selection */\n ::selection { background: #4ecdc4 !important; color: #1a1a2e !important; }\n ::-moz-selection { background: #4ecdc4 !important; color: #1a1a2e !important; }\n ';\n }\n \n function removeDarkMode() {\n var style = document.getElementById('universal-dark-mode-style');\n if (style) style.remove();\n }\n \n // Toggle with Alt+Shift+D\n document.addEventListener('keydown', function(e) {\n if (e.altKey && e.shiftKey && e.key === 'D') {\n e.preventDefault();\n enabled = !enabled;\n if (enabled) {\n applyDarkMode();\n console.log('[Universal Dark Mode] Enabled');\n } else {\n removeDarkMode();\n console.log('[Universal Dark Mode] Disabled');\n }\n }\n });\n \n // Apply on load\n applyDarkMode();\n \n // Re-apply on dynamic content\n var observer = new MutationObserver(function(mutations) {\n if (enabled && !document.getElementById('universal-dark-mode-style')) {\n applyDarkMode();\n }\n });\n observer.observe(document.head, { childList: true });\n \n console.log('[Universal Dark Mode] Loaded - Press Alt+Shift+D to toggle');\n})();", "Universal Dark Mode"); } } catch(__e) { console.warn('[Userscript:Universal Dark Mode]', __e); } })(); })();
Skip to content

feat(core): Add type & utility for function-based integrations - #9818

Merged
mydea merged 12 commits into
developfrom
fn/integration-fn
Dec 18, 2023
Merged

feat(core): Add type & utility for function-based integrations#9818
mydea merged 12 commits into
developfrom
fn/integration-fn

Conversation

@mydea

Copy link
Copy Markdown
Member

This PR adds new types for function-based integrations, that eventually (in v8) should fully replace the class-based functions.

This also introduces a small helper function to make writing such integrations easier (as we need to set an id/name etc. on the integration). With this, you can write an integration like this:

constinboundFiltersIntegration=makeIntegrationFn('InboundFilters',(options: Partial<InboundFiltersOptions>)=>{return{processEvent(event,_hint,client){constclientOptions=client.getOptions();constmergedOptions=_mergeOptions(options,clientOptions);return_shouldDropEvent(event,mergedOptions) ? null : event;}}});

And you get a fully typed integration ready to go!

For backwards compatibility, and so that we can actually start converting integrations in v7 already, this PR also adds a small utility convertIntegrationFnToClass() to convert such an integration to the "current" integration class syntax.

So we can actually already start porting integrations over like this:

/** Inbound filters configurable by the user */// eslint-disable-next-line deprecation/deprecationexportconstInboundFilters=convertIntegrationFnToClass(inboundFiltersIntegration);

Then, in v8 we only have to remove all the convertIntegrationFnToClass calls, export the integration functions directly, and update the overall integration types which can be passed to init() etc.

@mydeamydea self-assigned this Dec 13, 2023
@github-actions

github-actionsBot commented Dec 13, 2023

Copy link
Copy Markdown
Contributor

size-limit report 📦

PathSize
@sentry/browser (incl. Tracing, Replay, Feedback) - Webpack (gzipped)75.24 KB (-0.01% 🔽)
@sentry/browser (incl. Tracing, Replay) - Webpack (gzipped)66.61 KB (-0.02% 🔽)
@sentry/browser (incl. Tracing, Replay) - Webpack with treeshaking flags (gzipped)60.21 KB (-0.01% 🔽)
@sentry/browser (incl. Tracing) - Webpack (gzipped)31.29 KB (-0.02% 🔽)
@sentry/browser (incl. Feedback) - Webpack (gzipped)29.89 KB (-0.05% 🔽)
@sentry/browser - Webpack (gzipped)21.56 KB (-0.01% 🔽)
@sentry/browser (incl. Tracing, Replay, Feedback) - ES6 CDN Bundle (gzipped)72.63 KB (+0.08% 🔺)
@sentry/browser (incl. Tracing, Replay) - ES6 CDN Bundle (gzipped)64.34 KB (+0.06% 🔺)
@sentry/browser (incl. Tracing) - ES6 CDN Bundle (gzipped)30.6 KB (+0.1% 🔺)
@sentry/browser - ES6 CDN Bundle (gzipped)22.66 KB (+0.19% 🔺)
@sentry/browser (incl. Tracing, Replay) - ES6 CDN Bundle (minified & uncompressed)202.52 KB (+0.02% 🔺)
@sentry/browser (incl. Tracing) - ES6 CDN Bundle (minified & uncompressed)92.65 KB (+0.01% 🔺)
@sentry/browser - ES6 CDN Bundle (minified & uncompressed)67.65 KB (+0.04% 🔺)
@sentry/browser (incl. Tracing) - ES5 CDN Bundle (gzipped)33.52 KB (+0.15% 🔺)
@sentry/react (incl. Tracing, Replay) - Webpack (gzipped)66.96 KB (-0.02% 🔽)
@sentry/react - Webpack (gzipped)21.59 KB (-0.06% 🔽)
@sentry/nextjs Client (incl. Tracing, Replay) - Webpack (gzipped)83.76 KB (+0.06% 🔺)
@sentry/nextjs Client - Webpack (gzipped)48.42 KB (+0.05% 🔺)
@sentry-internal/feedback - Webpack (gzipped)16.19 KB (0%)

*/
public setupOnce(_addGlobalEventProcessor: unknown, _getCurrentHub: unknown): void {
// noop
const inboundFiltersIntegration = makeIntegrationFn('InboundFilters', (options: Partial<InboundFiltersOptions>) => {

Copy link
Copy Markdown
MemberAuthor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I just converted a single integration for now to show this in "reality", but I can also extract this out into a follow up PR.

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Let's just keep it here, the change is pretty small.

@Lms24Lms24 left a comment

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I'm not sure if I'm missing something here but I'm thinking about the defineConfig patterns from Vite, Astro, Nuxt, etc and I'm wondering if we could simplify this helper function a little in a similar manner; or actually even more than that:

constinboundFilters=(options: Partial<InboundFiltersOptions>)=>{// do whatever you need to do here e.g. assign default valuesreturn{name: 'InboundFilters',processEvent(event,_hint,client){constclientOptions=client.getOptions();constmergedOptions=_mergeOptions(options,clientOptions);return_shouldDropEvent(event,mergedOptions) ? null : event;}}});

I get that this simplification doesn't allow for name checks before initalization but I'm wondering if we even need that. Usually, instrumentation should happen in setup(once) anyway.

export {
getIntegrationsToSetup,
addIntegration,
// eslint-disable-next-line deprecation/deprecation

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

If we are using deprecated functions, I think we should disable this rule instead of overriding it everywhere

Copy link
Copy Markdown
MemberAuthor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

The idea here was to make it easier to spot that this should be removed in v8 🤔 no strong feelings, I just wanted to make it clear that this is a temporary thing that will be removed in v8 again - generally, we should avoid using deprecated stuff ourselves, so I think the rule is good.

Comment threadpackages/core/src/integration.ts Outdated
Comment threadpackages/core/src/integration.ts Outdated
Comment threadpackages/core/src/integration.ts Outdated

/** JSDoc */
export function _shouldDropEvent(event: Event, options: Partial<InboundFiltersOptions>): boolean {
function _shouldDropEvent(event: Event, options: Partial<InboundFiltersOptions>): boolean {

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Why does this function start with underscore?

Copy link
Copy Markdown
MemberAuthor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

they are "private" - we are not super consistent there, sometimes we prefix them and sometimes not. but specifically here I did not change that, just removed the export as we don't actually use it anywhere!

@mydea

Copy link
Copy Markdown
MemberAuthor

I'm not sure if I'm missing something here but I'm thinking about the defineConfig patterns from Vite, Astro, Nuxt, etc and I'm wondering if we could simplify this helper function a little in a similar manner; or actually even more than that:

constinboundFilters=(options: Partial<InboundFiltersOptions>)=>{// do whatever you need to do here e.g. assign default valuesreturn{name: 'InboundFilters',processEvent(event,_hint,client){constclientOptions=client.getOptions();constmergedOptions=_mergeOptions(options,clientOptions);return_shouldDropEvent(event,mergedOptions) ? null : event;}}});

I get that this simplification doesn't allow for name checks before initalization but I'm wondering if we even need that. Usually, instrumentation should happen in setup(once) anyway.

Hmm, can we get rid of the id? If so, then yeah we don't really need this - this is mostly to make this id/name stuff easier to handle. 🤔

@AbhiPrasadAbhiPrasad left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Hmm, can we get rid of the id

I think we can because id is basically equivalent to name everywhere.

*/
public setupOnce(_addGlobalEventProcessor: unknown, _getCurrentHub: unknown): void {
// noop
const inboundFiltersIntegration = makeIntegrationFn('InboundFilters', (options: Partial<InboundFiltersOptions>) => {

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Let's just keep it here, the change is pretty small.

@mydea

Copy link
Copy Markdown
MemberAuthor

Hmm, if we get rid of the id, do we still want to have the util function? It doesn't really do anything, but makes typing much nicer...

Function:

functionmakeIntegrationFn<FnextendsIntegrationFn>(fn: Fn): Fn {returnfn;}

But using it allows to omit all types:

constinboundFiltersIntegration=makeIntegrationFn((options: Partial<InboundFiltersOptions>)=>{return{name: INTEGRATION_NAME,// look mom, no types!processEvent(event,_hint,client){constclientOptions=client.getOptions();constmergedOptions=_mergeOptions(options,clientOptions);return_shouldDropEvent(event,mergedOptions) ? null : event;},};});

is this worth it??

Comment threadpackages/types/src/integration.ts Outdated
Comment on lines +21 to +22
export type IntegrationFn<Fn extends (...rest: any[]) => IntegrationFnResult> = { id: string } & Fn;

export interface IntegrationFnResult {

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I don't think these are necessary or a good idea. I would prefer if we just have an Integration interface. These types seem overkill and don't add much.

Copy link
Copy Markdown
MemberAuthor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

The thing is that for now these are not the same, as setupOnce is optional here. In v8 we can get rid of this and have just a single Integration interface again!

Comment threadpackages/core/src/integration.ts Outdated
* This will ensure to add the given name both to the function definition (as id),
* as well as to the integration return value.
*/
export function makeIntegrationFn<

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This function is imo not really doing anything. I think we (and eventually our users) are just better off defining integrations as follows.

exportfunctionMyCustomIntegration(): Integration{};

Easy, simple, well-typed. The rollup and Vite ecosystem is proof that this pattern works and is well understood.

@mydeamydeaDec 15, 2023

Copy link
Copy Markdown
MemberAuthor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Will remove this!

@mydeamydea changed the title feat(core): Add utilities for function-based integrationsfeat(core): Add type & utility for function-based integrationsDec 15, 2023
@mydea

Copy link
Copy Markdown
MemberAuthor

Updated this to remove the makeIntergrationFn util as we don't need that anymore. Now it's just the new types (to make setupOnce optional there), as well as the util to convert to a class for v7.

@mydea
mydea merged commit 01a4cc9 into developDec 18, 2023
@mydea
mydea deleted the fn/integration-fn branch December 18, 2023 08:56
Sign up for freeto join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

5 participants

@mydea@anonrig@lforst@Lms24@AbhiPrasad