Skip to content

feat(vue,nuxt): Record default UI spans without Options API (mixins) - #24174

Open
s1gr1d wants to merge 6 commits into
developfrom
sig/add-alternative-mixin-implementation
Open

s1gr1d wants to merge 6 commits into
developfrom
sig/add-alternative-mixin-implementation

Conversation

@s1gr1d

@s1gr1d s1gr1d commented Sep 7, 2026

Copy link
Copy Markdown
Member

Nuxt 5 disables Vue's Options API by default (nuxt/nuxt#35791). That turns app.mixin() into a silent no-op, and every Vue UI span comes from that mixin: Application Render and Vue <Root> disappear with no signal.

When the mixin is dropped, the SDK now wraps app.mount() and calls the same mixin hook bodies, so the default spans stay identical. The Nuxt SDK additionally extends the root span until <Suspense> resolves.

trackComponents still needs the Options API and warns when it is lost. Vue 2 behavior stays unchanged (always needs Options API as it's not possible otherwise).

Closes #23375

Docs follow-up: getsentry/sentry-docs#19290

@s1gr1d
s1gr1d requested a review from a team as a code owner September 7, 2026 12:45
@s1gr1d
s1gr1d requested review from mydea and nicohrubec and removed request for a team September 7, 2026 12:45
@s1gr1d

s1gr1d commented Sep 7, 2026

Copy link
Copy Markdown
Member Author

bugbot run

@github-actions

github-actions Bot commented Sep 7, 2026

Copy link
Copy Markdown
Contributor

size-limit report 📦

Path Size % Change Change
@sentry/browser 29.09 kB - -
@sentry/browser - with treeshaking flags 27.35 kB - -
@sentry/browser - with treeshaking flags tracing without tracing 27.26 kB - -
@sentry/browser (incl. Tracing) 50.6 kB - -
@sentry/browser (incl. Tracing + Span Streaming) 50.62 kB - -
@sentry/browser (incl. Tracing, Profiling) 53.61 kB - -
@sentry/browser (incl. Tracing, Replay) 90.15 kB - -
@sentry/browser (incl. Tracing, Replay) - with treeshaking flags 79.25 kB - -
@sentry/browser (incl. Tracing, Replay with Canvas) 94.85 kB - -
@sentry/browser (incl. Tracing, Replay, Feedback) 107.83 kB - -
@sentry/browser (incl. Feedback) 46.62 kB - -
@sentry/browser (incl. sendFeedback) 34.15 kB - -
@sentry/browser (incl. FeedbackAsync) 39.26 kB - -
@sentry/browser (incl. Metrics) 30.1 kB - -
@sentry/browser (incl. Logs) 30.35 kB - -
@sentry/browser (incl. Metrics & Logs) 31.02 kB - -
@sentry/react 30.84 kB - -
@sentry/react (incl. Tracing) 52.94 kB - -
@sentry/vue 36.44 kB +0.28% +99 B 🔺
@sentry/vue (incl. Tracing) 53.02 kB +0.21% +111 B 🔺
@sentry/svelte 29.11 kB - -
CDN Bundle 30.8 kB - -
CDN Bundle (incl. Tracing) 51.15 kB - -
CDN Bundle (incl. Logs, Metrics) 33.06 kB - -
CDN Bundle (incl. Tracing, Logs, Metrics) 53.14 kB - -
CDN Bundle (incl. Replay, Logs, Metrics) 73.75 kB - -
CDN Bundle (incl. Tracing, Replay) 88.69 kB - -
CDN Bundle (incl. Tracing, Replay, Logs, Metrics) 90.63 kB - -
CDN Bundle (incl. Tracing, Replay, Feedback) 94.73 kB - -
CDN Bundle (incl. Tracing, Replay, Feedback, Logs, Metrics) 96.78 kB - -
CDN Bundle - uncompressed 91.16 kB - -
CDN Bundle (incl. Tracing) - uncompressed 152.66 kB - -
CDN Bundle (incl. Logs, Metrics) - uncompressed 97.73 kB - -
CDN Bundle (incl. Tracing, Logs, Metrics) - uncompressed 158.61 kB - -
CDN Bundle (incl. Replay, Logs, Metrics) - uncompressed 227.14 kB - -
CDN Bundle (incl. Tracing, Replay) - uncompressed 272.23 kB - -
CDN Bundle (incl. Tracing, Replay, Logs, Metrics) - uncompressed 278.17 kB - -
CDN Bundle (incl. Tracing, Replay, Feedback) - uncompressed 285.93 kB - -
CDN Bundle (incl. Tracing, Replay, Feedback, Logs, Metrics) - uncompressed 291.86 kB - -
@sentry/nextjs (client) 55.27 kB - -
@sentry/sveltekit (client) 51.05 kB - -
@sentry/core/server 39.63 kB - -
@sentry/core/browser 13.66 kB - -
@sentry/node 132.37 kB +0.02% +18 B 🔺
@sentry/node/import (ESM hook with diagnostics-channel injection) 82.03 kB - -
@sentry/node - without tracing 89.82 kB +0.04% +30 B 🔺
@sentry/node - without channel injection 111.23 kB +0.02% +20 B 🔺
@sentry/aws-serverless 98.06 kB +0.03% +25 B 🔺
@sentry/cloudflare (withSentry) - minified 204.52 kB - -
@sentry/cloudflare (withSentry) 508.73 kB - -

View base workflow run

@cursor cursor Bot left a comment

Copy link
Copy Markdown

Choose a reason for hiding this comment

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

Cursor Bugbot has reviewed your changes and found 1 potential issue.

Fix All in Cursor

❌ Bugbot Autofix is OFF. To automatically fix reported issues with cloud agents, enable autofix in the Cursor dashboard.

Reviewed by Cursor Bugbot for commit 7b3c0ee. Configure here.

Comment thread packages/nuxt/src/runtime/plugins/sentry.client.ts Outdated
@github-actions

Copy link
Copy Markdown
Contributor

👋 @mydea, @nicohrubec — Please review this PR when you get a chance!

@s1gr1d
s1gr1d requested a review from chargome September 14, 2026 11:37

@chargome chargome 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.

Added a question, needs a rebase still

Comment thread packages/vue/src/rootInstrumentation.ts Outdated
* @internal Exported for the Sentry Nuxt SDK, not part of the stable public API.
* @experimental May change or be removed in any release.
*/
export function INTERNAL_extendVueRootRenderSpan(app: Vue): void {

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.

We only use this in the nuxt package AFAICT, could we just define it there and not add it to public exports?

Copy link
Copy Markdown
Member Author

Choose a reason for hiding this comment

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

it's defined in the vue package, because it needs the instrumentedApps. But I think I'll just remove this function because this is only relevant to close the "async gap": when a root span ends before <Suspense> resolves the page.

So far, we did not do this and we rather ship this as an extra feature.

Copy link
Copy Markdown
Member Author

Choose a reason for hiding this comment

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

Created a follow-up issue: #24460

@github-actions

Copy link
Copy Markdown
Contributor

👋 @mydea, @nicohrubec — Please review this PR when you get a chance!

# Conflicts:
#	dev-packages/e2e-tests/test-applications/vue-3/tests/performance.test.ts
@s1gr1d
s1gr1d requested a review from chargome September 17, 2026 12:01
@github-actions

Copy link
Copy Markdown
Contributor

👋 @mydea, @nicohrubec — Please review this PR when you get a chance!

Sign up for free to 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.

[Nuxt 5] Replace the Vue integration’s reliance on app.mixin()

2 participants