fix(react): Avoid multiple name updates on navigation spans - #17438

Merged
chargome merged 16 commits into
developfrom
onur/react-router-multiple-name-updates
Aug 27, 2025
Merged

fix(react): Avoid multiple name updates on navigation spans#17438
chargome merged 16 commits into
developfrom
onur/react-router-multiple-name-updates

Conversation

@onurtemizkan

@onurtemizkanonurtemizkan commented Aug 21, 2025

Copy link
Copy Markdown
Contributor

This patch prevents name updates on navigation spans from being applied more than once.

This was fine and allowed for cross-usage of different instrumentation ways (such as instrumenting useRoutes and createBrowserRouter together), and didn't create any issues. But after adding support for lazy routes, it led to incorrect transaction names, especially when there's a navigation between two lazily-loaded routes.

While on it, I also had to do some refactoring to keep the code readable and maintainable, so now reactrouterv6-compat-utils is separated into 3 source files (instrumentation, common utils, and lazy routes specific functionality).

@onurtemizkan
onurtemizkanforce-pushed the onur/react-router-multiple-name-updates branch 4 times, most recently from aea2217 to 57c8b22CompareAugust 22, 2025 13:13
@github-actions

github-actionsBot commented Aug 22, 2025

Copy link
Copy Markdown
Contributor

size-limit report 📦

PathSize% ChangeChange
@sentry/browser24.16 kB--
@sentry/browser - with treeshaking flags22.73 kB--
@sentry/browser (incl. Tracing)39.87 kB--
@sentry/browser (incl. Tracing, Replay)78.23 kB--
@sentry/browser (incl. Tracing, Replay) - with treeshaking flags68.02 kB--
@sentry/browser (incl. Tracing, Replay with Canvas)82.91 kB--
@sentry/browser (incl. Tracing, Replay, Feedback)95.03 kB--
@sentry/browser (incl. Feedback)40.83 kB--
@sentry/browser (incl. sendFeedback)28.81 kB--
@sentry/browser (incl. FeedbackAsync)33.7 kB--
@sentry/react25.88 kB--
@sentry/react (incl. Tracing)41.89 kB+0.06%+23 B 🔺
@sentry/vue28.64 kB--
@sentry/vue (incl. Tracing)41.69 kB--
@sentry/svelte24.18 kB--
CDN Bundle25.66 kB--
CDN Bundle (incl. Tracing)39.75 kB--
CDN Bundle (incl. Tracing, Replay)76.03 kB--
CDN Bundle (incl. Tracing, Replay, Feedback)81.46 kB--
CDN Bundle - uncompressed74.96 kB--
CDN Bundle (incl. Tracing) - uncompressed117.59 kB--
CDN Bundle (incl. Tracing, Replay) - uncompressed232.68 kB--
CDN Bundle (incl. Tracing, Replay, Feedback) - uncompressed245.28 kB--
@sentry/nextjs (client)43.89 kB--
@sentry/sveltekit (client)40.32 kB--
@sentry/node-core47.99 kB-0.01%-1 B 🔽
@sentry/node149.25 kB--
@sentry/node - without tracing92.24 kB--
@sentry/aws-serverless104.91 kB+0.01%+1 B 🔺

View base workflow run

@onurtemizkan
onurtemizkanforce-pushed the onur/react-router-multiple-name-updates branch 4 times, most recently from 0e679dc to 27c5da6CompareAugust 27, 2025 00:18
@onurtemizkan
onurtemizkanforce-pushed the onur/react-router-multiple-name-updates branch from 8da7c27 to 453f5c6CompareAugust 27, 2025 07:29
@onurtemizkan
onurtemizkan marked this pull request as ready for review August 27, 2025 07:29
cursor[bot]

This comment was marked as outdated.

@onurtemizkan
onurtemizkanforce-pushed the onur/react-router-multiple-name-updates branch from 1d2839b to 8507984CompareAugust 27, 2025 08:16

CopilotAI 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.

Pull Request Overview

This PR refactors the React Router v6/v7 compatibility utilities to prevent multiple navigation span name updates and fix incorrect transaction names for lazy routes.

  • Refactors the reactrouterv6-compat-utils module into three separate files for better organization
  • Implements tracking to prevent duplicate navigation span name updates during navigation
  • Fixes transaction naming issues that occurred when navigating between lazy routes

Reviewed Changes

Copilot reviewed 16 out of 16 changed files in this pull request and generated 4 comments.

Show a summary per file
FileDescription
packages/react/test/reactrouterv6-compat-utils.test.tsxRemoves entire test file as functionality moved to new modules
packages/react/test/reactrouter-cross-usage.test.tsxRemoves assertions expecting multiple updateName calls since they're now prevented
packages/react/test/reactrouter-compat-utils/utils.test.tsAdds comprehensive tests for utility functions moved from old module
packages/react/test/reactrouter-compat-utils/lazy-routes.test.tsAdds tests for lazy route handling functionality
packages/react/test/reactrouter-compat-utils/instrumentation.test.tsxAdds tests for instrumentation-specific functionality
packages/react/src/reactrouterv7.tsxUpdates import path to new module structure
packages/react/src/reactrouterv6.tsxUpdates import path to new module structure
packages/react/src/reactrouter-compat-utils/utils.tsNew utility functions module with core router utilities
packages/react/src/reactrouter-compat-utils/lazy-routes.tsxNew module for lazy route handling functionality
packages/react/src/reactrouter-compat-utils/instrumentation.tsxNew main instrumentation module with navigation span tracking
packages/react/src/reactrouter-compat-utils/index.tsNew index file exporting all functionality from sub-modules
dev-packages/e2e-tests/test-applications/react-router-7-lazy-routes/tests/transactions.test.tsAdds tests for navigation between lazy routes
dev-packages/e2e-tests/test-applications/react-router-7-lazy-routes/src/pages/InnerLazyRoutes.tsxAdds navigation link to another lazy route
dev-packages/e2e-tests/test-applications/react-router-7-lazy-routes/src/pages/Index.tsxAdds navigation links to lazy routes
dev-packages/e2e-tests/test-applications/react-router-7-lazy-routes/src/pages/AnotherLazyRoutes.tsxAdds new lazy route component with navigation links
dev-packages/e2e-tests/test-applications/react-router-7-lazy-routes/src/index.tsxAdds another lazy route configuration

Tip: Customize your code reviews with copilot-instructions.md. Create the file or learn how to get started.

Comment threadpackages/react/src/reactrouter-compat-utils/instrumentation.tsx Outdated
Comment threadpackages/react/src/reactrouter-compat-utils/instrumentation.tsx Outdated
Comment threadpackages/react/src/reactrouter-compat-utils/utils.ts Outdated
@onurtemizkan
onurtemizkanforce-pushed the onur/react-router-multiple-name-updates branch from 1431408 to 60a9d7cCompareAugust 27, 2025 09:34

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

Phew big change – Did not review all the tests in detail but looks good 🚀

Comment threadpackages/react/src/reactrouter-compat-utils/instrumentation.tsx Outdated
Comment threadpackages/react/src/reactrouter-compat-utils/lazy-routes.tsx Outdated
Comment threadpackages/react/src/reactrouter-compat-utils/index.ts
@chargomechargome self-assigned this Aug 27, 2025
@chargome

Copy link
Copy Markdown
Member

@onurtemizkan Added some minor things myself so I can release that tomorrow, thanks for the refactor!

@chargome
chargome merged commit 895b385 into developAug 27, 2025
319 of 323 checks passed
@chargome
chargome deleted the onur/react-router-multiple-name-updates branch August 27, 2025 20:35
s1gr1d added a commit that referenced this pull request Sep 9, 2025
Removes recently introduced special-casing lazy-route -> lazy-route
transaction name updates.
This completes the fix in #17438.
E2E tests are updated to replicate a similar case in the reproduction
here: #17417
Also manually tested on the reproduction.
---------
Co-authored-by: Sigrid Huemer <32902192+s1gr1d@users.noreply.github.com>
mergifyBot added a commit to reisene/HulajDusza-serwis that referenced this pull request Sep 29, 2025
![snyk-io[bot]](https://badgen.net/badge/icon/snyk-io%5Bbot%5D/green?label=)
![Contributor](https://badgen.net/badge/icon/Contributor/000000?label=)
[<img width="16" alt="Powered by Pull Request Badge"
src="https://user-images.githubusercontent.com/1393946/111216524-d2bb8e00-85d4-11eb-821b-ed4c00989c02.png">](https://pullrequestbadge.com/?utm_medium=github&utm_source=reisene&utm_campaign=badge_info)<!--
PR-BADGE: PLEASE DO NOT REMOVE THIS COMMENT -->
![snyk-top-banner](https://res.cloudinary.com/snyk/image/upload/r-d/scm-platform/snyk-pull-requests/pr-banner-default.svg)
<h3>Snyk has created this PR to upgrade @sentry/profiling-node from
10.8.0 to 10.9.0.</h3>
:information_source: Keep your dependencies up-to-date. This makes it
easier to fix existing vulnerabilities and to more quickly identify and
fix newly disclosed vulnerabilities when they affect your project.
<hr/>
- The recommended version is **1 version** ahead of your current
version.
- The recommended version was released **22 days ago**.
#### Issues fixed by the recommended upgrade:
| | Issue | Score | Exploit Maturity |
:-------------------------:|:-------------------------|:-------------------------|:-------------------------
![low
severity](https://res.cloudinary.com/snyk/image/upload/r-d/scm-platform/snyk-pull-requests//severity-low.svg
'low severity') | Regular Expression Denial of Service
(ReDoS)<br/>[SNYK-JS-BRACEEXPANSION-9789073](https://snyk.io/vuln/SNYK-JS-BRACEEXPANSION-9789073)
| **57** | Proof of Concept
![low
severity](https://res.cloudinary.com/snyk/image/upload/r-d/scm-platform/snyk-pull-requests//severity-low.svg
'low severity') | Regular Expression Denial of Service
(ReDoS)<br/>[SNYK-JS-BRACEEXPANSION-9789073](https://snyk.io/vuln/SNYK-JS-BRACEEXPANSION-9789073)
| **57** | Proof of Concept
<details>
<summary><b>Release notes</b></summary>
<br/>
<details>
<summary>Package name: <b>@sentry/profiling-node</b></summary>
<ul>
<li>
<b>10.9.0</b> - <a
href="https://redirect.github.com/getsentry/sentry-javascript/releases/tag/10.9.0">2025-09-03</a></br><h3>Important
Changes</h3>
<ul>
<li><strong>feat(node): Update <code>httpIntegration</code> handling of
incoming requests (<a
href="https://redirect.github.com/getsentry/sentry-javascript/pull/17371"
data-hovercard-type="pull_request"
data-hovercard-url="/getsentry/sentry-javascript/pull/17371/hovercard">#17371</a>)</strong></li>
</ul>
<p>This version updates the handling of the Node SDK of incoming
requests. Instead of relying on @ opentelemetry/instrumentation-http, we
now handle incoming request instrumentation internally, ensuring that we
can optimize performance as much as possible and avoid interop
problems.</p>
<p>This change should not affect you, unless you're relying on very
in-depth implementation details. Importantly, this also drops the
<code>_experimentalConfig</code> option of the integration - this will
no longer do anything.<br>
Finally, you can still pass
<code>instrumentation.{requestHook,responseHook,applyCustomAttributesOnSpan}</code>
options, but they are deprecated and will be removed in v11. Instead,
you can use the new <code>incomingRequestSpanHook</code> configuration
option if you want to adjust the incoming request span.</p>
<h3>Other Changes</h3>
<ul>
<li>feat(browser): Add replay.feedback CDN bundle (<a
href="https://redirect.github.com/getsentry/sentry-javascript/pull/17496"
data-hovercard-type="pull_request"
data-hovercard-url="/getsentry/sentry-javascript/pull/17496/hovercard">#17496</a>)</li>
<li>feat(browser): Export <code>sendFeedback</code> from CDN bundles (<a
href="https://redirect.github.com/getsentry/sentry-javascript/pull/17495"
data-hovercard-type="pull_request"
data-hovercard-url="/getsentry/sentry-javascript/pull/17495/hovercard">#17495</a>)</li>
<li>fix(astro): Ensure span name from <code>beforeStartSpan</code> isn't
overwritten (<a
href="https://redirect.github.com/getsentry/sentry-javascript/pull/17500"
data-hovercard-type="pull_request"
data-hovercard-url="/getsentry/sentry-javascript/pull/17500/hovercard">#17500</a>)</li>
<li>fix(browser): Ensure source is set correctly when updating span name
in-place in <code>beforeStartSpan</code> (<a
href="https://redirect.github.com/getsentry/sentry-javascript/pull/17501"
data-hovercard-type="pull_request"
data-hovercard-url="/getsentry/sentry-javascript/pull/17501/hovercard">#17501</a>)</li>
<li>fix(core): Only set template attributes on logs if parameters exist
(<a
href="https://redirect.github.com/getsentry/sentry-javascript/pull/17480"
data-hovercard-type="pull_request"
data-hovercard-url="/getsentry/sentry-javascript/pull/17480/hovercard">#17480</a>)</li>
<li>fix(nextjs): Fix parameterization for root catchall routes (<a
href="https://redirect.github.com/getsentry/sentry-javascript/pull/17489"
data-hovercard-type="pull_request"
data-hovercard-url="/getsentry/sentry-javascript/pull/17489/hovercard">#17489</a>)</li>
<li>fix(node-core): Shut down OTel TraceProvider when calling
<code>Sentry.close()</code> (<a
href="https://redirect.github.com/getsentry/sentry-javascript/pull/17499"
data-hovercard-type="pull_request"
data-hovercard-url="/getsentry/sentry-javascript/pull/17499/hovercard">#17499</a>)</li>
</ul>
<details>
<summary> <strong>Internal Changes</strong> </summary>
<ul>
<li>chore: Add <code>changelog</code> script back to package.json (<a
href="https://redirect.github.com/getsentry/sentry-javascript/pull/17517"
data-hovercard-type="pull_request"
data-hovercard-url="/getsentry/sentry-javascript/pull/17517/hovercard">#17517</a>)</li>
<li>chore: Ensure prettier is run on all files (<a
href="https://redirect.github.com/getsentry/sentry-javascript/pull/17497"
data-hovercard-type="pull_request"
data-hovercard-url="/getsentry/sentry-javascript/pull/17497/hovercard">#17497</a>)</li>
<li>chore: Ignore prettier commit for git blame (<a
href="https://redirect.github.com/getsentry/sentry-javascript/pull/17498"
data-hovercard-type="pull_request"
data-hovercard-url="/getsentry/sentry-javascript/pull/17498/hovercard">#17498</a>)</li>
<li>chore: Remove experimental from Nuxt SDK package description (<a
href="https://redirect.github.com/getsentry/sentry-javascript/pull/17483"
data-hovercard-type="pull_request"
data-hovercard-url="/getsentry/sentry-javascript/pull/17483/hovercard">#17483</a>)</li>
<li>ci: Capture overhead in node app (<a
href="https://redirect.github.com/getsentry/sentry-javascript/pull/17420"
data-hovercard-type="pull_request"
data-hovercard-url="/getsentry/sentry-javascript/pull/17420/hovercard">#17420</a>)</li>
<li>ci: Ensure we fail on cancelled jobs (<a
href="https://redirect.github.com/getsentry/sentry-javascript/pull/17506"
data-hovercard-type="pull_request"
data-hovercard-url="/getsentry/sentry-javascript/pull/17506/hovercard">#17506</a>)</li>
<li>ci(deps): bump actions/checkout from 4 to 5 (<a
href="https://redirect.github.com/getsentry/sentry-javascript/pull/17505"
data-hovercard-type="pull_request"
data-hovercard-url="/getsentry/sentry-javascript/pull/17505/hovercard">#17505</a>)</li>
<li>ci(deps): bump actions/create-github-app-token from 2.0.6 to 2.1.1
(<a
href="https://redirect.github.com/getsentry/sentry-javascript/pull/17504"
data-hovercard-type="pull_request"
data-hovercard-url="/getsentry/sentry-javascript/pull/17504/hovercard">#17504</a>)</li>
<li>test(aws): Improve reliability on CI (<a
href="https://redirect.github.com/getsentry/sentry-javascript/pull/17502"
data-hovercard-type="pull_request"
data-hovercard-url="/getsentry/sentry-javascript/pull/17502/hovercard">#17502</a>)</li>
</ul>
</details>
<h2>Bundle size 📦</h2>
<table>
<thead>
<tr>
<th>Path</th>
<th>Size</th>
</tr>
</thead>
<tbody>
<tr>
<td>@ sentry/browser</td>
<td>23.59 KB</td>
</tr>
<tr>
<td>@ sentry/browser - with treeshaking flags</td>
<td>22.2 KB</td>
</tr>
<tr>
<td>@ sentry/browser (incl. Tracing)</td>
<td>38.93 KB</td>
</tr>
<tr>
<td>@ sentry/browser (incl. Tracing, Replay)</td>
<td>76.4 KB</td>
</tr>
<tr>
<td>@ sentry/browser (incl. Tracing, Replay) - with treeshaking
flags</td>
<td>66.43 KB</td>
</tr>
<tr>
<td>@ sentry/browser (incl. Tracing, Replay with Canvas)</td>
<td>80.97 KB</td>
</tr>
<tr>
<td>@ sentry/browser (incl. Tracing, Replay, Feedback)</td>
<td>92.81 KB</td>
</tr>
<tr>
<td>@ sentry/browser (incl. Feedback)</td>
<td>39.88 KB</td>
</tr>
<tr>
<td>@ sentry/browser (incl. sendFeedback)</td>
<td>28.13 KB</td>
</tr>
<tr>
<td>@ sentry/browser (incl. FeedbackAsync)</td>
<td>32.92 KB</td>
</tr>
<tr>
<td>@ sentry/react</td>
<td>25.27 KB</td>
</tr>
<tr>
<td>@ sentry/react (incl. Tracing)</td>
<td>40.91 KB</td>
</tr>
<tr>
<td>@ sentry/vue</td>
<td>27.97 KB</td>
</tr>
<tr>
<td>@ sentry/vue (incl. Tracing)</td>
<td>40.72 KB</td>
</tr>
<tr>
<td>@ sentry/svelte</td>
<td>23.62 KB</td>
</tr>
<tr>
<td>CDN Bundle</td>
<td>25.06 KB</td>
</tr>
<tr>
<td>CDN Bundle (incl. Tracing)</td>
<td>38.82 KB</td>
</tr>
<tr>
<td>CDN Bundle (incl. Tracing, Replay)</td>
<td>74.25 KB</td>
</tr>
<tr>
<td>CDN Bundle (incl. Tracing, Replay, Feedback)</td>
<td>79.56 KB</td>
</tr>
<tr>
<td>CDN Bundle - uncompressed</td>
<td>73.2 KB</td>
</tr>
<tr>
<td>CDN Bundle (incl. Tracing) - uncompressed</td>
<td>114.83 KB</td>
</tr>
<tr>
<td>CDN Bundle (incl. Tracing, Replay) - uncompressed</td>
<td>227.23 KB</td>
</tr>
<tr>
<td>CDN Bundle (incl. Tracing, Replay, Feedback) - uncompressed</td>
<td>239.56 KB</td>
</tr>
<tr>
<td>@ sentry/nextjs (client)</td>
<td>42.86 KB</td>
</tr>
<tr>
<td>@ sentry/sveltekit (client)</td>
<td>39.38 KB</td>
</tr>
<tr>
<td>@ sentry/node-core</td>
<td>48.45 KB</td>
</tr>
<tr>
<td>@ sentry/node</td>
<td>146.74 KB</td>
</tr>
<tr>
<td>@ sentry/node - without tracing</td>
<td>90.02 KB</td>
</tr>
<tr>
<td>@ sentry/aws-serverless</td>
<td>103.01 KB</td>
</tr>
</tbody>
</table>
</li>
<li>
<b>10.8.0</b> - <a
href="https://redirect.github.com/getsentry/sentry-javascript/releases/tag/10.8.0">2025-08-29</a></br><h3>Important
Changes</h3>
<ul>
<li>
<p><strong>feat(sveltekit): Add Compatibility for builtin SvelteKit
Tracing (<a
href="https://redirect.github.com/getsentry/sentry-javascript/pull/17423"
data-hovercard-type="pull_request"
data-hovercard-url="/getsentry/sentry-javascript/pull/17423/hovercard">#17423</a>)</strong></p>
<p>This release makes the <code>@ sentry/sveltekit</code> SDK compatible
with SvelteKit's native <a
href="https://svelte.dev/docs/kit/observability"
rel="nofollow">observability support</a> introduced in SvelteKit version
<code>2.31.0</code>.<br>
If you enable both, instrumentation and tracing, the SDK will now
initialize early enough to set up additional instrumentation like
database queries and it will pick up spans emitted from SvelteKit.</p>
<p>We will follow up with docs how to set up the SDK soon.<br>
For now, If you're on SvelteKit version <code>2.31.0</code> or newer,
you can easily opt into the new feature:</p>
<ol>
<li>
<p>Enable <a href="https://svelte.dev/docs/kit/observability"
rel="nofollow">experimental tracing and instrumentation support</a> in
<code>svelte.config.js</code>:</p>
</li>
<li>
<p>Move your <code>Sentry.init()</code> call from
<code>src/hooks.server.(js|ts)</code> to the new
<code>instrumentation.server.(js|ts)</code> file:</p>
<div class="highlight highlight-source-ts notranslate position-relative
overflow-auto" data-snippet-clipboard-copy-content="//
instrumentation.server.ts
import * as Sentry from '@ sentry/sveltekit';
Sentry.init({
dsn: '...',
// rest of your config
});"><pre><span class="pl-c">// instrumentation.server.ts</span>
<span class="pl-k">import</span> <span class="pl-c1">*</span> <span
class="pl-k">as</span> <span class="pl-v">Sentry</span> <span
class="pl-k">from</span> <span class="pl-s">'@
sentry/sveltekit'</span><span class="pl-kos">;</span>
<span class="pl-v">Sentry</span><span class="pl-kos">.</span><span
class="pl-en">init</span><span class="pl-kos">(</span><span
class="pl-kos">{</span>
<span class="pl-c1">dsn</span>: <span class="pl-s">'...'</span><span
class="pl-kos">,</span>
<span class="pl-c">// rest of your config</span>
<span class="pl-kos">}</span><span class="pl-kos">)</span><span
class="pl-kos">;</span></pre></div>
<p>The rest of your Sentry config in <code>hooks.server.ts</code>
(<code>sentryHandle</code> and <code>handleErrorWithSentry</code>)
should stay the same.</p>
</li>
</ol>
<p>If you prefer to stay on the hooks-file based config for now, the SDK
will continue to work as previously.</p>
<p>Thanks to the Svelte team and <a class="user-mention notranslate"
data-hovercard-type="user"
data-hovercard-url="/users/elliott-with-the-longest-name-on-github/hovercard"
data-octo-click="hovercard-link-click"
data-octo-dimensions="link_type:self"
href="https://redirect.github.com/elliott-with-the-longest-name-on-github">@
elliott-with-the-longest-name-on-github</a> for implementing
observability support and for reviewing our PR!</p>
</li>
</ul>
<h3>Other Changes</h3>
<ul>
<li>fix(react): Avoid multiple name updates on navigation spans (<a
href="https://redirect.github.com/getsentry/sentry-javascript/pull/17438"
data-hovercard-type="pull_request"
data-hovercard-url="/getsentry/sentry-javascript/pull/17438/hovercard">#17438</a>)</li>
</ul>
<details>
<summary> <strong>Internal Changes</strong> </summary>
<ul>
<li>test(profiling): Add tests for current state of profiling (<a
href="https://redirect.github.com/getsentry/sentry-javascript/pull/17470"
data-hovercard-type="pull_request"
data-hovercard-url="/getsentry/sentry-javascript/pull/17470/hovercard">#17470</a>)</li>
</ul>
</details>
<h2>Bundle size 📦</h2>
<table>
<thead>
<tr>
<th>Path</th>
<th>Size</th>
</tr>
</thead>
<tbody>
<tr>
<td>@ sentry/browser</td>
<td>23.59 KB</td>
</tr>
<tr>
<td>@ sentry/browser - with treeshaking flags</td>
<td>22.2 KB</td>
</tr>
<tr>
<td>@ sentry/browser (incl. Tracing)</td>
<td>38.94 KB</td>
</tr>
<tr>
<td>@ sentry/browser (incl. Tracing, Replay)</td>
<td>76.4 KB</td>
</tr>
<tr>
<td>@ sentry/browser (incl. Tracing, Replay) - with treeshaking
flags</td>
<td>66.43 KB</td>
</tr>
<tr>
<td>@ sentry/browser (incl. Tracing, Replay with Canvas)</td>
<td>80.97 KB</td>
</tr>
<tr>
<td>@ sentry/browser (incl. Tracing, Replay, Feedback)</td>
<td>92.8 KB</td>
</tr>
<tr>
<td>@ sentry/browser (incl. Feedback)</td>
<td>39.88 KB</td>
</tr>
<tr>
<td>@ sentry/browser (incl. sendFeedback)</td>
<td>28.13 KB</td>
</tr>
<tr>
<td>@ sentry/browser (incl. FeedbackAsync)</td>
<td>32.92 KB</td>
</tr>
<tr>
<td>@ sentry/react</td>
<td>25.27 KB</td>
</tr>
<tr>
<td>@ sentry/react (incl. Tracing)</td>
<td>40.91 KB</td>
</tr>
<tr>
<td>@ sentry/vue</td>
<td>27.97 KB</td>
</tr>
<tr>
<td>@ sentry/vue (incl. Tracing)</td>
<td>40.72 KB</td>
</tr>
<tr>
<td>@ sentry/svelte</td>
<td>23.62 KB</td>
</tr>
<tr>
<td>CDN Bundle</td>
<td>25.06 KB</td>
</tr>
<tr>
<td>CDN Bundle (incl. Tracing)</td>
<td>38.82 KB</td>
</tr>
<tr>
<td>CDN Bundle (incl. Tracing, Replay)</td>
<td>74.24 KB</td>
</tr>
<tr>
<td>CDN Bundle (incl. Tracing, Replay, Feedback)</td>
<td>79.55 KB</td>
</tr>
<tr>
<td>CDN Bundle - uncompressed</td>
<td>73.2 KB</td>
</tr>
<tr>
<td>CDN Bundle (incl. Tracing) - uncompressed</td>
<td>114.83 KB</td>
</tr>
<tr>
<td>CDN Bundle (incl. Tracing, Replay) - uncompressed</td>
<td>227.23 KB</td>
</tr>
<tr>
<td>CDN Bundle (incl. Tracing, Replay, Feedback) - uncompressed</td>
<td>239.53 KB</td>
</tr>
<tr>
<td>@ sentry/nextjs (client)</td>
<td>42.86 KB</td>
</tr>
<tr>
<td>@ sentry/sveltekit (client)</td>
<td>39.38 KB</td>
</tr>
<tr>
<td>@ sentry/node-core</td>
<td>46.87 KB</td>
</tr>
<tr>
<td>@ sentry/node</td>
<td>145.75 KB</td>
</tr>
<tr>
<td>@ sentry/node - without tracing</td>
<td>90.08 KB</td>
</tr>
<tr>
<td>@ sentry/aws-serverless</td>
<td>102.45 KB</td>
</tr>
</tbody>
</table>
</li>
</ul>
from <a
href="https://redirect.github.com/getsentry/sentry-javascript/releases">@sentry/profiling-node
GitHub release notes</a>
</details>
</details>
---
> [!IMPORTANT]
>
> - Check the changes in this PR to ensure they won't cause issues with
your project.
> - This PR was automatically created by Snyk using the credentials of a
real user.
> - Max score is 1000. Note that the real score may have changed since
the PR was raised.
---
**Note:** _You are seeing this because you or someone else with access
to this repository has authorized Snyk to open upgrade PRs._
**For more information:** <img
src="https://api.segment.io/v1/pixel/track?data=eyJ3cml0ZUtleSI6InJyWmxZcEdHY2RyTHZsb0lYd0dUcVg4WkFRTnNCOUEwIiwiYW5vbnltb3VzSWQiOiI2MDhkOWU5ZS04ZDBlLTQ5N2EtYTNkZS1mMTVkYzU1YmNkNTciLCJldmVudCI6IlBSIHZpZXdlZCIsInByb3BlcnRpZXMiOnsicHJJZCI6IjYwOGQ5ZTllLThkMGUtNDk3YS1hM2RlLWYxNWRjNTViY2Q1NyJ9fQ=="
width="0" height="0"/>
> - 🧐 [View latest project
report](https://app.snyk.io/org/reisene/project/55e114f8-489e-4f14-b900-20574b041e59?utm_source&#x3D;github-cloud-app&amp;utm_medium&#x3D;referral&amp;page&#x3D;upgrade-pr)
> - 📜 [Customise PR
templates](https://docs.snyk.io/scan-using-snyk/pull-requests/snyk-fix-pull-or-merge-requests/customize-pr-templates?utm_source=&utm_content=fix-pr-template)
> - 🛠 [Adjust upgrade PR
settings](https://app.snyk.io/org/reisene/project/55e114f8-489e-4f14-b900-20574b041e59/settings/integration?utm_source&#x3D;github-cloud-app&amp;utm_medium&#x3D;referral&amp;page&#x3D;upgrade-pr)
> - 🔕 [Ignore this dependency or unsubscribe from future upgrade
PRs](https://app.snyk.io/org/reisene/project/55e114f8-489e-4f14-b900-20574b041e59/settings/integration?pkg&#x3D;@sentry/profiling-node&amp;utm_source&#x3D;github-cloud-app&amp;utm_medium&#x3D;referral&amp;page&#x3D;upgrade-pr#auto-dep-upgrades)
[//]: #
'snyk:metadata:{"customTemplate":{"variablesUsed":[],"fieldsUsed":[]},"dependencies":[{"name":"@sentry/profiling-node","from":"10.8.0","to":"10.9.0"}],"env":"prod","hasFixes":true,"isBreakingChange":false,"isMajorUpgrade":false,"issuesToFix":["SNYK-JS-BRACEEXPANSION-9789073","SNYK-JS-BRACEEXPANSION-9789073"],"prId":"608d9e9e-8d0e-497a-a3de-f15dc55bcd57","prPublicId":"608d9e9e-8d0e-497a-a3de-f15dc55bcd57","packageManager":"npm","priorityScoreList":[57],"projectPublicId":"55e114f8-489e-4f14-b900-20574b041e59","projectUrl":"https://app.snyk.io/org/reisene/project/55e114f8-489e-4f14-b900-20574b041e59?utm_source=github-cloud-app&utm_medium=referral&page=upgrade-pr","prType":"upgrade","templateFieldSources":{"branchName":"default","commitMessage":"default","description":"default","title":"default"},"templateVariants":["priorityScore"],"type":"auto","upgrade":["SNYK-JS-BRACEEXPANSION-9789073","SNYK-JS-BRACEEXPANSION-9789073"],"upgradeInfo":{"versionsDiff":1,"publishedDate":"2025-09-03T12:59:52.227Z"},"vulns":["SNYK-JS-BRACEEXPANSION-9789073","SNYK-JS-BRACEEXPANSION-9789073"]}'
onurtemizkan added a commit that referenced this pull request Feb 10, 2026
…es (#19086)
This PR will resolve the core reason for the series of fixes / handling
for automatic lazy-route resolution for a while.
Related: #18898,
#18881,
#18346,
#18155,
#18098,
#17962,
#17867,
#17438,
#17277
The core issue we have been trying to tackle is not having access to the
complete route hierarchy when asynchronously loaded lazy routes are
used. React Router provides a route manifest that we can use while
matching parameterized transaction names with routes in all cases except
this lazy-routes pattern.
This problem has been discussed on React Router:
- remix-run/react-router#11113
While this has been
[addressed](remix-run/react-router#11626) for
Remix / React Router (Framework Mode), it's still not available in
Library Mode. The manifest contains the lazily-loaded route, only when
it's navigated to. While waiting for navigation, our transactions can be
dropped for several reasons, such as user behaviour like switching tabs
(`document.hidden` guard), hitting timeouts like `idleTimeout`, and
potentially other reasons. This results in incomplete transaction naming
with leftover wildcards, which caused broken aggregation on the Sentry
dashboard.
The series of attempts to fix this while keeping automatic route
discovery has been prone to race conditions and required special-case
handling of each edge case scenario, also requiring a considerable
amount of internal logic, affecting our readability and performance. At
the end, all failed in giving completely robust and deterministic
results on the customers' side.
This PR proposes a new option: `lazyRouteManifest` specifically for lazy
routes. This will let us have initial information about the route
hierarchy. So we can assign correct parameterized transaction names
without needing to wait for navigated state.
It's a static array of routes in parameterized format (needs to be
maintained by the users on route hierarchy updates) like:
```ts
Sentry.reactRouterV7BrowserTracingIntegration({
// ...
enableAsyncRouteHandlers: true
lazyRouteManifest: [
'/',
'/pricing',
'/features',
'/login',
'/signup',
'/forgot-password',
'/reset-password/:token',
'/org/:orgSlug',
'/org/:orgSlug/dashboard',
'/org/:orgSlug/projects',
'/org/:orgSlug/projects/:projectId',
'/org/:orgSlug/projects/:projectId/settings',
'/org/:orgSlug/projects/:projectId/issues',
'/org/:orgSlug/projects/:projectId/issues/:issueId',
'/org/:orgSlug/team',
'/org/:orgSlug/team/:memberId',
'/org/:orgSlug/settings',
'/org/:orgSlug/billing',
'/admin',
'/admin/users',
'/admin/users/:userId',
'/admin/orgs',
'/admin/orgs/:orgId',
],
})
```
- This will only be active when `enableAsyncRouteHandlers` is set to
`true`
- To match URLs with given routes, we mimic React Router's own
implementation.
- When this is not provided or fails, it falls back to the current
behaviour
- This manifest is primarily for lazy routes, but the users can also add
their non-lazy routes here for convenience or consistency.
- Also added E2E tests that will fail when (if at some point) React
Router manifests include the lazy routes before navigation, so we'll be
aware and plan depending on that manifest instead.
- We can do a cleanup for the race-condition / edge-case handling part
of the code in a follow-up PR.
Closes#19090 (added automatically)
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.

3 participants

@onurtemizkan@chargome
, '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

fix(react): Avoid multiple name updates on navigation spans - #17438

Merged
chargome merged 16 commits into
developfrom
onur/react-router-multiple-name-updates
Aug 27, 2025
Merged

fix(react): Avoid multiple name updates on navigation spans#17438
chargome merged 16 commits into
developfrom
onur/react-router-multiple-name-updates

Conversation

@onurtemizkan

@onurtemizkanonurtemizkan commented Aug 21, 2025

Copy link
Copy Markdown
Contributor

This patch prevents name updates on navigation spans from being applied more than once.

This was fine and allowed for cross-usage of different instrumentation ways (such as instrumenting useRoutes and createBrowserRouter together), and didn't create any issues. But after adding support for lazy routes, it led to incorrect transaction names, especially when there's a navigation between two lazily-loaded routes.

While on it, I also had to do some refactoring to keep the code readable and maintainable, so now reactrouterv6-compat-utils is separated into 3 source files (instrumentation, common utils, and lazy routes specific functionality).

@onurtemizkan
onurtemizkanforce-pushed the onur/react-router-multiple-name-updates branch 4 times, most recently from aea2217 to 57c8b22CompareAugust 22, 2025 13:13
@github-actions

github-actionsBot commented Aug 22, 2025

Copy link
Copy Markdown
Contributor

size-limit report 📦

PathSize% ChangeChange
@sentry/browser24.16 kB--
@sentry/browser - with treeshaking flags22.73 kB--
@sentry/browser (incl. Tracing)39.87 kB--
@sentry/browser (incl. Tracing, Replay)78.23 kB--
@sentry/browser (incl. Tracing, Replay) - with treeshaking flags68.02 kB--
@sentry/browser (incl. Tracing, Replay with Canvas)82.91 kB--
@sentry/browser (incl. Tracing, Replay, Feedback)95.03 kB--
@sentry/browser (incl. Feedback)40.83 kB--
@sentry/browser (incl. sendFeedback)28.81 kB--
@sentry/browser (incl. FeedbackAsync)33.7 kB--
@sentry/react25.88 kB--
@sentry/react (incl. Tracing)41.89 kB+0.06%+23 B 🔺
@sentry/vue28.64 kB--
@sentry/vue (incl. Tracing)41.69 kB--
@sentry/svelte24.18 kB--
CDN Bundle25.66 kB--
CDN Bundle (incl. Tracing)39.75 kB--
CDN Bundle (incl. Tracing, Replay)76.03 kB--
CDN Bundle (incl. Tracing, Replay, Feedback)81.46 kB--
CDN Bundle - uncompressed74.96 kB--
CDN Bundle (incl. Tracing) - uncompressed117.59 kB--
CDN Bundle (incl. Tracing, Replay) - uncompressed232.68 kB--
CDN Bundle (incl. Tracing, Replay, Feedback) - uncompressed245.28 kB--
@sentry/nextjs (client)43.89 kB--
@sentry/sveltekit (client)40.32 kB--
@sentry/node-core47.99 kB-0.01%-1 B 🔽
@sentry/node149.25 kB--
@sentry/node - without tracing92.24 kB--
@sentry/aws-serverless104.91 kB+0.01%+1 B 🔺

View base workflow run

@onurtemizkan
onurtemizkanforce-pushed the onur/react-router-multiple-name-updates branch 4 times, most recently from 0e679dc to 27c5da6CompareAugust 27, 2025 00:18
@onurtemizkan
onurtemizkanforce-pushed the onur/react-router-multiple-name-updates branch from 8da7c27 to 453f5c6CompareAugust 27, 2025 07:29
@onurtemizkan
onurtemizkan marked this pull request as ready for review August 27, 2025 07:29
cursor[bot]

This comment was marked as outdated.

@onurtemizkan
onurtemizkanforce-pushed the onur/react-router-multiple-name-updates branch from 1d2839b to 8507984CompareAugust 27, 2025 08:16

CopilotAI 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.

Pull Request Overview

This PR refactors the React Router v6/v7 compatibility utilities to prevent multiple navigation span name updates and fix incorrect transaction names for lazy routes.

  • Refactors the reactrouterv6-compat-utils module into three separate files for better organization
  • Implements tracking to prevent duplicate navigation span name updates during navigation
  • Fixes transaction naming issues that occurred when navigating between lazy routes

Reviewed Changes

Copilot reviewed 16 out of 16 changed files in this pull request and generated 4 comments.

Show a summary per file
FileDescription
packages/react/test/reactrouterv6-compat-utils.test.tsxRemoves entire test file as functionality moved to new modules
packages/react/test/reactrouter-cross-usage.test.tsxRemoves assertions expecting multiple updateName calls since they're now prevented
packages/react/test/reactrouter-compat-utils/utils.test.tsAdds comprehensive tests for utility functions moved from old module
packages/react/test/reactrouter-compat-utils/lazy-routes.test.tsAdds tests for lazy route handling functionality
packages/react/test/reactrouter-compat-utils/instrumentation.test.tsxAdds tests for instrumentation-specific functionality
packages/react/src/reactrouterv7.tsxUpdates import path to new module structure
packages/react/src/reactrouterv6.tsxUpdates import path to new module structure
packages/react/src/reactrouter-compat-utils/utils.tsNew utility functions module with core router utilities
packages/react/src/reactrouter-compat-utils/lazy-routes.tsxNew module for lazy route handling functionality
packages/react/src/reactrouter-compat-utils/instrumentation.tsxNew main instrumentation module with navigation span tracking
packages/react/src/reactrouter-compat-utils/index.tsNew index file exporting all functionality from sub-modules
dev-packages/e2e-tests/test-applications/react-router-7-lazy-routes/tests/transactions.test.tsAdds tests for navigation between lazy routes
dev-packages/e2e-tests/test-applications/react-router-7-lazy-routes/src/pages/InnerLazyRoutes.tsxAdds navigation link to another lazy route
dev-packages/e2e-tests/test-applications/react-router-7-lazy-routes/src/pages/Index.tsxAdds navigation links to lazy routes
dev-packages/e2e-tests/test-applications/react-router-7-lazy-routes/src/pages/AnotherLazyRoutes.tsxAdds new lazy route component with navigation links
dev-packages/e2e-tests/test-applications/react-router-7-lazy-routes/src/index.tsxAdds another lazy route configuration

Tip: Customize your code reviews with copilot-instructions.md. Create the file or learn how to get started.

Comment threadpackages/react/src/reactrouter-compat-utils/instrumentation.tsx Outdated
Comment threadpackages/react/src/reactrouter-compat-utils/instrumentation.tsx Outdated
Comment threadpackages/react/src/reactrouter-compat-utils/utils.ts Outdated
@onurtemizkan
onurtemizkanforce-pushed the onur/react-router-multiple-name-updates branch from 1431408 to 60a9d7cCompareAugust 27, 2025 09:34

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

Phew big change – Did not review all the tests in detail but looks good 🚀

Comment threadpackages/react/src/reactrouter-compat-utils/instrumentation.tsx Outdated
Comment threadpackages/react/src/reactrouter-compat-utils/lazy-routes.tsx Outdated
Comment threadpackages/react/src/reactrouter-compat-utils/index.ts
@chargomechargome self-assigned this Aug 27, 2025
@chargome

Copy link
Copy Markdown
Member

@onurtemizkan Added some minor things myself so I can release that tomorrow, thanks for the refactor!

@chargome
chargome merged commit 895b385 into developAug 27, 2025
319 of 323 checks passed
@chargome
chargome deleted the onur/react-router-multiple-name-updates branch August 27, 2025 20:35
s1gr1d added a commit that referenced this pull request Sep 9, 2025
Removes recently introduced special-casing lazy-route -> lazy-route
transaction name updates.
This completes the fix in #17438.
E2E tests are updated to replicate a similar case in the reproduction
here: #17417
Also manually tested on the reproduction.
---------
Co-authored-by: Sigrid Huemer <32902192+s1gr1d@users.noreply.github.com>
mergifyBot added a commit to reisene/HulajDusza-serwis that referenced this pull request Sep 29, 2025
![snyk-io[bot]](https://badgen.net/badge/icon/snyk-io%5Bbot%5D/green?label=)
![Contributor](https://badgen.net/badge/icon/Contributor/000000?label=)
[<img width="16" alt="Powered by Pull Request Badge"
src="https://user-images.githubusercontent.com/1393946/111216524-d2bb8e00-85d4-11eb-821b-ed4c00989c02.png">](https://pullrequestbadge.com/?utm_medium=github&utm_source=reisene&utm_campaign=badge_info)<!--
PR-BADGE: PLEASE DO NOT REMOVE THIS COMMENT -->
![snyk-top-banner](https://res.cloudinary.com/snyk/image/upload/r-d/scm-platform/snyk-pull-requests/pr-banner-default.svg)
<h3>Snyk has created this PR to upgrade @sentry/profiling-node from
10.8.0 to 10.9.0.</h3>
:information_source: Keep your dependencies up-to-date. This makes it
easier to fix existing vulnerabilities and to more quickly identify and
fix newly disclosed vulnerabilities when they affect your project.
<hr/>
- The recommended version is **1 version** ahead of your current
version.
- The recommended version was released **22 days ago**.
#### Issues fixed by the recommended upgrade:
| | Issue | Score | Exploit Maturity |
:-------------------------:|:-------------------------|:-------------------------|:-------------------------
![low
severity](https://res.cloudinary.com/snyk/image/upload/r-d/scm-platform/snyk-pull-requests//severity-low.svg
'low severity') | Regular Expression Denial of Service
(ReDoS)<br/>[SNYK-JS-BRACEEXPANSION-9789073](https://snyk.io/vuln/SNYK-JS-BRACEEXPANSION-9789073)
| **57** | Proof of Concept
![low
severity](https://res.cloudinary.com/snyk/image/upload/r-d/scm-platform/snyk-pull-requests//severity-low.svg
'low severity') | Regular Expression Denial of Service
(ReDoS)<br/>[SNYK-JS-BRACEEXPANSION-9789073](https://snyk.io/vuln/SNYK-JS-BRACEEXPANSION-9789073)
| **57** | Proof of Concept
<details>
<summary><b>Release notes</b></summary>
<br/>
<details>
<summary>Package name: <b>@sentry/profiling-node</b></summary>
<ul>
<li>
<b>10.9.0</b> - <a
href="https://redirect.github.com/getsentry/sentry-javascript/releases/tag/10.9.0">2025-09-03</a></br><h3>Important
Changes</h3>
<ul>
<li><strong>feat(node): Update <code>httpIntegration</code> handling of
incoming requests (<a
href="https://redirect.github.com/getsentry/sentry-javascript/pull/17371"
data-hovercard-type="pull_request"
data-hovercard-url="/getsentry/sentry-javascript/pull/17371/hovercard">#17371</a>)</strong></li>
</ul>
<p>This version updates the handling of the Node SDK of incoming
requests. Instead of relying on @ opentelemetry/instrumentation-http, we
now handle incoming request instrumentation internally, ensuring that we
can optimize performance as much as possible and avoid interop
problems.</p>
<p>This change should not affect you, unless you're relying on very
in-depth implementation details. Importantly, this also drops the
<code>_experimentalConfig</code> option of the integration - this will
no longer do anything.<br>
Finally, you can still pass
<code>instrumentation.{requestHook,responseHook,applyCustomAttributesOnSpan}</code>
options, but they are deprecated and will be removed in v11. Instead,
you can use the new <code>incomingRequestSpanHook</code> configuration
option if you want to adjust the incoming request span.</p>
<h3>Other Changes</h3>
<ul>
<li>feat(browser): Add replay.feedback CDN bundle (<a
href="https://redirect.github.com/getsentry/sentry-javascript/pull/17496"
data-hovercard-type="pull_request"
data-hovercard-url="/getsentry/sentry-javascript/pull/17496/hovercard">#17496</a>)</li>
<li>feat(browser): Export <code>sendFeedback</code> from CDN bundles (<a
href="https://redirect.github.com/getsentry/sentry-javascript/pull/17495"
data-hovercard-type="pull_request"
data-hovercard-url="/getsentry/sentry-javascript/pull/17495/hovercard">#17495</a>)</li>
<li>fix(astro): Ensure span name from <code>beforeStartSpan</code> isn't
overwritten (<a
href="https://redirect.github.com/getsentry/sentry-javascript/pull/17500"
data-hovercard-type="pull_request"
data-hovercard-url="/getsentry/sentry-javascript/pull/17500/hovercard">#17500</a>)</li>
<li>fix(browser): Ensure source is set correctly when updating span name
in-place in <code>beforeStartSpan</code> (<a
href="https://redirect.github.com/getsentry/sentry-javascript/pull/17501"
data-hovercard-type="pull_request"
data-hovercard-url="/getsentry/sentry-javascript/pull/17501/hovercard">#17501</a>)</li>
<li>fix(core): Only set template attributes on logs if parameters exist
(<a
href="https://redirect.github.com/getsentry/sentry-javascript/pull/17480"
data-hovercard-type="pull_request"
data-hovercard-url="/getsentry/sentry-javascript/pull/17480/hovercard">#17480</a>)</li>
<li>fix(nextjs): Fix parameterization for root catchall routes (<a
href="https://redirect.github.com/getsentry/sentry-javascript/pull/17489"
data-hovercard-type="pull_request"
data-hovercard-url="/getsentry/sentry-javascript/pull/17489/hovercard">#17489</a>)</li>
<li>fix(node-core): Shut down OTel TraceProvider when calling
<code>Sentry.close()</code> (<a
href="https://redirect.github.com/getsentry/sentry-javascript/pull/17499"
data-hovercard-type="pull_request"
data-hovercard-url="/getsentry/sentry-javascript/pull/17499/hovercard">#17499</a>)</li>
</ul>
<details>
<summary> <strong>Internal Changes</strong> </summary>
<ul>
<li>chore: Add <code>changelog</code> script back to package.json (<a
href="https://redirect.github.com/getsentry/sentry-javascript/pull/17517"
data-hovercard-type="pull_request"
data-hovercard-url="/getsentry/sentry-javascript/pull/17517/hovercard">#17517</a>)</li>
<li>chore: Ensure prettier is run on all files (<a
href="https://redirect.github.com/getsentry/sentry-javascript/pull/17497"
data-hovercard-type="pull_request"
data-hovercard-url="/getsentry/sentry-javascript/pull/17497/hovercard">#17497</a>)</li>
<li>chore: Ignore prettier commit for git blame (<a
href="https://redirect.github.com/getsentry/sentry-javascript/pull/17498"
data-hovercard-type="pull_request"
data-hovercard-url="/getsentry/sentry-javascript/pull/17498/hovercard">#17498</a>)</li>
<li>chore: Remove experimental from Nuxt SDK package description (<a
href="https://redirect.github.com/getsentry/sentry-javascript/pull/17483"
data-hovercard-type="pull_request"
data-hovercard-url="/getsentry/sentry-javascript/pull/17483/hovercard">#17483</a>)</li>
<li>ci: Capture overhead in node app (<a
href="https://redirect.github.com/getsentry/sentry-javascript/pull/17420"
data-hovercard-type="pull_request"
data-hovercard-url="/getsentry/sentry-javascript/pull/17420/hovercard">#17420</a>)</li>
<li>ci: Ensure we fail on cancelled jobs (<a
href="https://redirect.github.com/getsentry/sentry-javascript/pull/17506"
data-hovercard-type="pull_request"
data-hovercard-url="/getsentry/sentry-javascript/pull/17506/hovercard">#17506</a>)</li>
<li>ci(deps): bump actions/checkout from 4 to 5 (<a
href="https://redirect.github.com/getsentry/sentry-javascript/pull/17505"
data-hovercard-type="pull_request"
data-hovercard-url="/getsentry/sentry-javascript/pull/17505/hovercard">#17505</a>)</li>
<li>ci(deps): bump actions/create-github-app-token from 2.0.6 to 2.1.1
(<a
href="https://redirect.github.com/getsentry/sentry-javascript/pull/17504"
data-hovercard-type="pull_request"
data-hovercard-url="/getsentry/sentry-javascript/pull/17504/hovercard">#17504</a>)</li>
<li>test(aws): Improve reliability on CI (<a
href="https://redirect.github.com/getsentry/sentry-javascript/pull/17502"
data-hovercard-type="pull_request"
data-hovercard-url="/getsentry/sentry-javascript/pull/17502/hovercard">#17502</a>)</li>
</ul>
</details>
<h2>Bundle size 📦</h2>
<table>
<thead>
<tr>
<th>Path</th>
<th>Size</th>
</tr>
</thead>
<tbody>
<tr>
<td>@ sentry/browser</td>
<td>23.59 KB</td>
</tr>
<tr>
<td>@ sentry/browser - with treeshaking flags</td>
<td>22.2 KB</td>
</tr>
<tr>
<td>@ sentry/browser (incl. Tracing)</td>
<td>38.93 KB</td>
</tr>
<tr>
<td>@ sentry/browser (incl. Tracing, Replay)</td>
<td>76.4 KB</td>
</tr>
<tr>
<td>@ sentry/browser (incl. Tracing, Replay) - with treeshaking
flags</td>
<td>66.43 KB</td>
</tr>
<tr>
<td>@ sentry/browser (incl. Tracing, Replay with Canvas)</td>
<td>80.97 KB</td>
</tr>
<tr>
<td>@ sentry/browser (incl. Tracing, Replay, Feedback)</td>
<td>92.81 KB</td>
</tr>
<tr>
<td>@ sentry/browser (incl. Feedback)</td>
<td>39.88 KB</td>
</tr>
<tr>
<td>@ sentry/browser (incl. sendFeedback)</td>
<td>28.13 KB</td>
</tr>
<tr>
<td>@ sentry/browser (incl. FeedbackAsync)</td>
<td>32.92 KB</td>
</tr>
<tr>
<td>@ sentry/react</td>
<td>25.27 KB</td>
</tr>
<tr>
<td>@ sentry/react (incl. Tracing)</td>
<td>40.91 KB</td>
</tr>
<tr>
<td>@ sentry/vue</td>
<td>27.97 KB</td>
</tr>
<tr>
<td>@ sentry/vue (incl. Tracing)</td>
<td>40.72 KB</td>
</tr>
<tr>
<td>@ sentry/svelte</td>
<td>23.62 KB</td>
</tr>
<tr>
<td>CDN Bundle</td>
<td>25.06 KB</td>
</tr>
<tr>
<td>CDN Bundle (incl. Tracing)</td>
<td>38.82 KB</td>
</tr>
<tr>
<td>CDN Bundle (incl. Tracing, Replay)</td>
<td>74.25 KB</td>
</tr>
<tr>
<td>CDN Bundle (incl. Tracing, Replay, Feedback)</td>
<td>79.56 KB</td>
</tr>
<tr>
<td>CDN Bundle - uncompressed</td>
<td>73.2 KB</td>
</tr>
<tr>
<td>CDN Bundle (incl. Tracing) - uncompressed</td>
<td>114.83 KB</td>
</tr>
<tr>
<td>CDN Bundle (incl. Tracing, Replay) - uncompressed</td>
<td>227.23 KB</td>
</tr>
<tr>
<td>CDN Bundle (incl. Tracing, Replay, Feedback) - uncompressed</td>
<td>239.56 KB</td>
</tr>
<tr>
<td>@ sentry/nextjs (client)</td>
<td>42.86 KB</td>
</tr>
<tr>
<td>@ sentry/sveltekit (client)</td>
<td>39.38 KB</td>
</tr>
<tr>
<td>@ sentry/node-core</td>
<td>48.45 KB</td>
</tr>
<tr>
<td>@ sentry/node</td>
<td>146.74 KB</td>
</tr>
<tr>
<td>@ sentry/node - without tracing</td>
<td>90.02 KB</td>
</tr>
<tr>
<td>@ sentry/aws-serverless</td>
<td>103.01 KB</td>
</tr>
</tbody>
</table>
</li>
<li>
<b>10.8.0</b> - <a
href="https://redirect.github.com/getsentry/sentry-javascript/releases/tag/10.8.0">2025-08-29</a></br><h3>Important
Changes</h3>
<ul>
<li>
<p><strong>feat(sveltekit): Add Compatibility for builtin SvelteKit
Tracing (<a
href="https://redirect.github.com/getsentry/sentry-javascript/pull/17423"
data-hovercard-type="pull_request"
data-hovercard-url="/getsentry/sentry-javascript/pull/17423/hovercard">#17423</a>)</strong></p>
<p>This release makes the <code>@ sentry/sveltekit</code> SDK compatible
with SvelteKit's native <a
href="https://svelte.dev/docs/kit/observability"
rel="nofollow">observability support</a> introduced in SvelteKit version
<code>2.31.0</code>.<br>
If you enable both, instrumentation and tracing, the SDK will now
initialize early enough to set up additional instrumentation like
database queries and it will pick up spans emitted from SvelteKit.</p>
<p>We will follow up with docs how to set up the SDK soon.<br>
For now, If you're on SvelteKit version <code>2.31.0</code> or newer,
you can easily opt into the new feature:</p>
<ol>
<li>
<p>Enable <a href="https://svelte.dev/docs/kit/observability"
rel="nofollow">experimental tracing and instrumentation support</a> in
<code>svelte.config.js</code>:</p>
</li>
<li>
<p>Move your <code>Sentry.init()</code> call from
<code>src/hooks.server.(js|ts)</code> to the new
<code>instrumentation.server.(js|ts)</code> file:</p>
<div class="highlight highlight-source-ts notranslate position-relative
overflow-auto" data-snippet-clipboard-copy-content="//
instrumentation.server.ts
import * as Sentry from '@ sentry/sveltekit';
Sentry.init({
dsn: '...',
// rest of your config
});"><pre><span class="pl-c">// instrumentation.server.ts</span>
<span class="pl-k">import</span> <span class="pl-c1">*</span> <span
class="pl-k">as</span> <span class="pl-v">Sentry</span> <span
class="pl-k">from</span> <span class="pl-s">'@
sentry/sveltekit'</span><span class="pl-kos">;</span>
<span class="pl-v">Sentry</span><span class="pl-kos">.</span><span
class="pl-en">init</span><span class="pl-kos">(</span><span
class="pl-kos">{</span>
<span class="pl-c1">dsn</span>: <span class="pl-s">'...'</span><span
class="pl-kos">,</span>
<span class="pl-c">// rest of your config</span>
<span class="pl-kos">}</span><span class="pl-kos">)</span><span
class="pl-kos">;</span></pre></div>
<p>The rest of your Sentry config in <code>hooks.server.ts</code>
(<code>sentryHandle</code> and <code>handleErrorWithSentry</code>)
should stay the same.</p>
</li>
</ol>
<p>If you prefer to stay on the hooks-file based config for now, the SDK
will continue to work as previously.</p>
<p>Thanks to the Svelte team and <a class="user-mention notranslate"
data-hovercard-type="user"
data-hovercard-url="/users/elliott-with-the-longest-name-on-github/hovercard"
data-octo-click="hovercard-link-click"
data-octo-dimensions="link_type:self"
href="https://redirect.github.com/elliott-with-the-longest-name-on-github">@
elliott-with-the-longest-name-on-github</a> for implementing
observability support and for reviewing our PR!</p>
</li>
</ul>
<h3>Other Changes</h3>
<ul>
<li>fix(react): Avoid multiple name updates on navigation spans (<a
href="https://redirect.github.com/getsentry/sentry-javascript/pull/17438"
data-hovercard-type="pull_request"
data-hovercard-url="/getsentry/sentry-javascript/pull/17438/hovercard">#17438</a>)</li>
</ul>
<details>
<summary> <strong>Internal Changes</strong> </summary>
<ul>
<li>test(profiling): Add tests for current state of profiling (<a
href="https://redirect.github.com/getsentry/sentry-javascript/pull/17470"
data-hovercard-type="pull_request"
data-hovercard-url="/getsentry/sentry-javascript/pull/17470/hovercard">#17470</a>)</li>
</ul>
</details>
<h2>Bundle size 📦</h2>
<table>
<thead>
<tr>
<th>Path</th>
<th>Size</th>
</tr>
</thead>
<tbody>
<tr>
<td>@ sentry/browser</td>
<td>23.59 KB</td>
</tr>
<tr>
<td>@ sentry/browser - with treeshaking flags</td>
<td>22.2 KB</td>
</tr>
<tr>
<td>@ sentry/browser (incl. Tracing)</td>
<td>38.94 KB</td>
</tr>
<tr>
<td>@ sentry/browser (incl. Tracing, Replay)</td>
<td>76.4 KB</td>
</tr>
<tr>
<td>@ sentry/browser (incl. Tracing, Replay) - with treeshaking
flags</td>
<td>66.43 KB</td>
</tr>
<tr>
<td>@ sentry/browser (incl. Tracing, Replay with Canvas)</td>
<td>80.97 KB</td>
</tr>
<tr>
<td>@ sentry/browser (incl. Tracing, Replay, Feedback)</td>
<td>92.8 KB</td>
</tr>
<tr>
<td>@ sentry/browser (incl. Feedback)</td>
<td>39.88 KB</td>
</tr>
<tr>
<td>@ sentry/browser (incl. sendFeedback)</td>
<td>28.13 KB</td>
</tr>
<tr>
<td>@ sentry/browser (incl. FeedbackAsync)</td>
<td>32.92 KB</td>
</tr>
<tr>
<td>@ sentry/react</td>
<td>25.27 KB</td>
</tr>
<tr>
<td>@ sentry/react (incl. Tracing)</td>
<td>40.91 KB</td>
</tr>
<tr>
<td>@ sentry/vue</td>
<td>27.97 KB</td>
</tr>
<tr>
<td>@ sentry/vue (incl. Tracing)</td>
<td>40.72 KB</td>
</tr>
<tr>
<td>@ sentry/svelte</td>
<td>23.62 KB</td>
</tr>
<tr>
<td>CDN Bundle</td>
<td>25.06 KB</td>
</tr>
<tr>
<td>CDN Bundle (incl. Tracing)</td>
<td>38.82 KB</td>
</tr>
<tr>
<td>CDN Bundle (incl. Tracing, Replay)</td>
<td>74.24 KB</td>
</tr>
<tr>
<td>CDN Bundle (incl. Tracing, Replay, Feedback)</td>
<td>79.55 KB</td>
</tr>
<tr>
<td>CDN Bundle - uncompressed</td>
<td>73.2 KB</td>
</tr>
<tr>
<td>CDN Bundle (incl. Tracing) - uncompressed</td>
<td>114.83 KB</td>
</tr>
<tr>
<td>CDN Bundle (incl. Tracing, Replay) - uncompressed</td>
<td>227.23 KB</td>
</tr>
<tr>
<td>CDN Bundle (incl. Tracing, Replay, Feedback) - uncompressed</td>
<td>239.53 KB</td>
</tr>
<tr>
<td>@ sentry/nextjs (client)</td>
<td>42.86 KB</td>
</tr>
<tr>
<td>@ sentry/sveltekit (client)</td>
<td>39.38 KB</td>
</tr>
<tr>
<td>@ sentry/node-core</td>
<td>46.87 KB</td>
</tr>
<tr>
<td>@ sentry/node</td>
<td>145.75 KB</td>
</tr>
<tr>
<td>@ sentry/node - without tracing</td>
<td>90.08 KB</td>
</tr>
<tr>
<td>@ sentry/aws-serverless</td>
<td>102.45 KB</td>
</tr>
</tbody>
</table>
</li>
</ul>
from <a
href="https://redirect.github.com/getsentry/sentry-javascript/releases">@sentry/profiling-node
GitHub release notes</a>
</details>
</details>
---
> [!IMPORTANT]
>
> - Check the changes in this PR to ensure they won't cause issues with
your project.
> - This PR was automatically created by Snyk using the credentials of a
real user.
> - Max score is 1000. Note that the real score may have changed since
the PR was raised.
---
**Note:** _You are seeing this because you or someone else with access
to this repository has authorized Snyk to open upgrade PRs._
**For more information:** <img
src="https://api.segment.io/v1/pixel/track?data=eyJ3cml0ZUtleSI6InJyWmxZcEdHY2RyTHZsb0lYd0dUcVg4WkFRTnNCOUEwIiwiYW5vbnltb3VzSWQiOiI2MDhkOWU5ZS04ZDBlLTQ5N2EtYTNkZS1mMTVkYzU1YmNkNTciLCJldmVudCI6IlBSIHZpZXdlZCIsInByb3BlcnRpZXMiOnsicHJJZCI6IjYwOGQ5ZTllLThkMGUtNDk3YS1hM2RlLWYxNWRjNTViY2Q1NyJ9fQ=="
width="0" height="0"/>
> - 🧐 [View latest project
report](https://app.snyk.io/org/reisene/project/55e114f8-489e-4f14-b900-20574b041e59?utm_source&#x3D;github-cloud-app&amp;utm_medium&#x3D;referral&amp;page&#x3D;upgrade-pr)
> - 📜 [Customise PR
templates](https://docs.snyk.io/scan-using-snyk/pull-requests/snyk-fix-pull-or-merge-requests/customize-pr-templates?utm_source=&utm_content=fix-pr-template)
> - 🛠 [Adjust upgrade PR
settings](https://app.snyk.io/org/reisene/project/55e114f8-489e-4f14-b900-20574b041e59/settings/integration?utm_source&#x3D;github-cloud-app&amp;utm_medium&#x3D;referral&amp;page&#x3D;upgrade-pr)
> - 🔕 [Ignore this dependency or unsubscribe from future upgrade
PRs](https://app.snyk.io/org/reisene/project/55e114f8-489e-4f14-b900-20574b041e59/settings/integration?pkg&#x3D;@sentry/profiling-node&amp;utm_source&#x3D;github-cloud-app&amp;utm_medium&#x3D;referral&amp;page&#x3D;upgrade-pr#auto-dep-upgrades)
[//]: #
'snyk:metadata:{"customTemplate":{"variablesUsed":[],"fieldsUsed":[]},"dependencies":[{"name":"@sentry/profiling-node","from":"10.8.0","to":"10.9.0"}],"env":"prod","hasFixes":true,"isBreakingChange":false,"isMajorUpgrade":false,"issuesToFix":["SNYK-JS-BRACEEXPANSION-9789073","SNYK-JS-BRACEEXPANSION-9789073"],"prId":"608d9e9e-8d0e-497a-a3de-f15dc55bcd57","prPublicId":"608d9e9e-8d0e-497a-a3de-f15dc55bcd57","packageManager":"npm","priorityScoreList":[57],"projectPublicId":"55e114f8-489e-4f14-b900-20574b041e59","projectUrl":"https://app.snyk.io/org/reisene/project/55e114f8-489e-4f14-b900-20574b041e59?utm_source=github-cloud-app&utm_medium=referral&page=upgrade-pr","prType":"upgrade","templateFieldSources":{"branchName":"default","commitMessage":"default","description":"default","title":"default"},"templateVariants":["priorityScore"],"type":"auto","upgrade":["SNYK-JS-BRACEEXPANSION-9789073","SNYK-JS-BRACEEXPANSION-9789073"],"upgradeInfo":{"versionsDiff":1,"publishedDate":"2025-09-03T12:59:52.227Z"},"vulns":["SNYK-JS-BRACEEXPANSION-9789073","SNYK-JS-BRACEEXPANSION-9789073"]}'
onurtemizkan added a commit that referenced this pull request Feb 10, 2026
…es (#19086)
This PR will resolve the core reason for the series of fixes / handling
for automatic lazy-route resolution for a while.
Related: #18898,
#18881,
#18346,
#18155,
#18098,
#17962,
#17867,
#17438,
#17277
The core issue we have been trying to tackle is not having access to the
complete route hierarchy when asynchronously loaded lazy routes are
used. React Router provides a route manifest that we can use while
matching parameterized transaction names with routes in all cases except
this lazy-routes pattern.
This problem has been discussed on React Router:
- remix-run/react-router#11113
While this has been
[addressed](remix-run/react-router#11626) for
Remix / React Router (Framework Mode), it's still not available in
Library Mode. The manifest contains the lazily-loaded route, only when
it's navigated to. While waiting for navigation, our transactions can be
dropped for several reasons, such as user behaviour like switching tabs
(`document.hidden` guard), hitting timeouts like `idleTimeout`, and
potentially other reasons. This results in incomplete transaction naming
with leftover wildcards, which caused broken aggregation on the Sentry
dashboard.
The series of attempts to fix this while keeping automatic route
discovery has been prone to race conditions and required special-case
handling of each edge case scenario, also requiring a considerable
amount of internal logic, affecting our readability and performance. At
the end, all failed in giving completely robust and deterministic
results on the customers' side.
This PR proposes a new option: `lazyRouteManifest` specifically for lazy
routes. This will let us have initial information about the route
hierarchy. So we can assign correct parameterized transaction names
without needing to wait for navigated state.
It's a static array of routes in parameterized format (needs to be
maintained by the users on route hierarchy updates) like:
```ts
Sentry.reactRouterV7BrowserTracingIntegration({
// ...
enableAsyncRouteHandlers: true
lazyRouteManifest: [
'/',
'/pricing',
'/features',
'/login',
'/signup',
'/forgot-password',
'/reset-password/:token',
'/org/:orgSlug',
'/org/:orgSlug/dashboard',
'/org/:orgSlug/projects',
'/org/:orgSlug/projects/:projectId',
'/org/:orgSlug/projects/:projectId/settings',
'/org/:orgSlug/projects/:projectId/issues',
'/org/:orgSlug/projects/:projectId/issues/:issueId',
'/org/:orgSlug/team',
'/org/:orgSlug/team/:memberId',
'/org/:orgSlug/settings',
'/org/:orgSlug/billing',
'/admin',
'/admin/users',
'/admin/users/:userId',
'/admin/orgs',
'/admin/orgs/:orgId',
],
})
```
- This will only be active when `enableAsyncRouteHandlers` is set to
`true`
- To match URLs with given routes, we mimic React Router's own
implementation.
- When this is not provided or fails, it falls back to the current
behaviour
- This manifest is primarily for lazy routes, but the users can also add
their non-lazy routes here for convenience or consistency.
- Also added E2E tests that will fail when (if at some point) React
Router manifests include the lazy routes before navigation, so we'll be
aware and plan depending on that manifest instead.
- We can do a cleanup for the race-condition / edge-case handling part
of the code in a follow-up PR.
Closes#19090 (added automatically)
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.

3 participants

@onurtemizkan@chargome
, '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

fix(react): Avoid multiple name updates on navigation spans - #17438

Merged
chargome merged 16 commits into
developfrom
onur/react-router-multiple-name-updates
Aug 27, 2025
Merged

fix(react): Avoid multiple name updates on navigation spans#17438
chargome merged 16 commits into
developfrom
onur/react-router-multiple-name-updates

Conversation

@onurtemizkan

@onurtemizkanonurtemizkan commented Aug 21, 2025

Copy link
Copy Markdown
Contributor

This patch prevents name updates on navigation spans from being applied more than once.

This was fine and allowed for cross-usage of different instrumentation ways (such as instrumenting useRoutes and createBrowserRouter together), and didn't create any issues. But after adding support for lazy routes, it led to incorrect transaction names, especially when there's a navigation between two lazily-loaded routes.

While on it, I also had to do some refactoring to keep the code readable and maintainable, so now reactrouterv6-compat-utils is separated into 3 source files (instrumentation, common utils, and lazy routes specific functionality).

@onurtemizkan
onurtemizkanforce-pushed the onur/react-router-multiple-name-updates branch 4 times, most recently from aea2217 to 57c8b22CompareAugust 22, 2025 13:13
@github-actions

github-actionsBot commented Aug 22, 2025

Copy link
Copy Markdown
Contributor

size-limit report 📦

PathSize% ChangeChange
@sentry/browser24.16 kB--
@sentry/browser - with treeshaking flags22.73 kB--
@sentry/browser (incl. Tracing)39.87 kB--
@sentry/browser (incl. Tracing, Replay)78.23 kB--
@sentry/browser (incl. Tracing, Replay) - with treeshaking flags68.02 kB--
@sentry/browser (incl. Tracing, Replay with Canvas)82.91 kB--
@sentry/browser (incl. Tracing, Replay, Feedback)95.03 kB--
@sentry/browser (incl. Feedback)40.83 kB--
@sentry/browser (incl. sendFeedback)28.81 kB--
@sentry/browser (incl. FeedbackAsync)33.7 kB--
@sentry/react25.88 kB--
@sentry/react (incl. Tracing)41.89 kB+0.06%+23 B 🔺
@sentry/vue28.64 kB--
@sentry/vue (incl. Tracing)41.69 kB--
@sentry/svelte24.18 kB--
CDN Bundle25.66 kB--
CDN Bundle (incl. Tracing)39.75 kB--
CDN Bundle (incl. Tracing, Replay)76.03 kB--
CDN Bundle (incl. Tracing, Replay, Feedback)81.46 kB--
CDN Bundle - uncompressed74.96 kB--
CDN Bundle (incl. Tracing) - uncompressed117.59 kB--
CDN Bundle (incl. Tracing, Replay) - uncompressed232.68 kB--
CDN Bundle (incl. Tracing, Replay, Feedback) - uncompressed245.28 kB--
@sentry/nextjs (client)43.89 kB--
@sentry/sveltekit (client)40.32 kB--
@sentry/node-core47.99 kB-0.01%-1 B 🔽
@sentry/node149.25 kB--
@sentry/node - without tracing92.24 kB--
@sentry/aws-serverless104.91 kB+0.01%+1 B 🔺

View base workflow run

@onurtemizkan
onurtemizkanforce-pushed the onur/react-router-multiple-name-updates branch 4 times, most recently from 0e679dc to 27c5da6CompareAugust 27, 2025 00:18
@onurtemizkan
onurtemizkanforce-pushed the onur/react-router-multiple-name-updates branch from 8da7c27 to 453f5c6CompareAugust 27, 2025 07:29
@onurtemizkan
onurtemizkan marked this pull request as ready for review August 27, 2025 07:29
cursor[bot]

This comment was marked as outdated.

@onurtemizkan
onurtemizkanforce-pushed the onur/react-router-multiple-name-updates branch from 1d2839b to 8507984CompareAugust 27, 2025 08:16

CopilotAI 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.

Pull Request Overview

This PR refactors the React Router v6/v7 compatibility utilities to prevent multiple navigation span name updates and fix incorrect transaction names for lazy routes.

  • Refactors the reactrouterv6-compat-utils module into three separate files for better organization
  • Implements tracking to prevent duplicate navigation span name updates during navigation
  • Fixes transaction naming issues that occurred when navigating between lazy routes

Reviewed Changes

Copilot reviewed 16 out of 16 changed files in this pull request and generated 4 comments.

Show a summary per file
FileDescription
packages/react/test/reactrouterv6-compat-utils.test.tsxRemoves entire test file as functionality moved to new modules
packages/react/test/reactrouter-cross-usage.test.tsxRemoves assertions expecting multiple updateName calls since they're now prevented
packages/react/test/reactrouter-compat-utils/utils.test.tsAdds comprehensive tests for utility functions moved from old module
packages/react/test/reactrouter-compat-utils/lazy-routes.test.tsAdds tests for lazy route handling functionality
packages/react/test/reactrouter-compat-utils/instrumentation.test.tsxAdds tests for instrumentation-specific functionality
packages/react/src/reactrouterv7.tsxUpdates import path to new module structure
packages/react/src/reactrouterv6.tsxUpdates import path to new module structure
packages/react/src/reactrouter-compat-utils/utils.tsNew utility functions module with core router utilities
packages/react/src/reactrouter-compat-utils/lazy-routes.tsxNew module for lazy route handling functionality
packages/react/src/reactrouter-compat-utils/instrumentation.tsxNew main instrumentation module with navigation span tracking
packages/react/src/reactrouter-compat-utils/index.tsNew index file exporting all functionality from sub-modules
dev-packages/e2e-tests/test-applications/react-router-7-lazy-routes/tests/transactions.test.tsAdds tests for navigation between lazy routes
dev-packages/e2e-tests/test-applications/react-router-7-lazy-routes/src/pages/InnerLazyRoutes.tsxAdds navigation link to another lazy route
dev-packages/e2e-tests/test-applications/react-router-7-lazy-routes/src/pages/Index.tsxAdds navigation links to lazy routes
dev-packages/e2e-tests/test-applications/react-router-7-lazy-routes/src/pages/AnotherLazyRoutes.tsxAdds new lazy route component with navigation links
dev-packages/e2e-tests/test-applications/react-router-7-lazy-routes/src/index.tsxAdds another lazy route configuration

Tip: Customize your code reviews with copilot-instructions.md. Create the file or learn how to get started.

Comment threadpackages/react/src/reactrouter-compat-utils/instrumentation.tsx Outdated
Comment threadpackages/react/src/reactrouter-compat-utils/instrumentation.tsx Outdated
Comment threadpackages/react/src/reactrouter-compat-utils/utils.ts Outdated
@onurtemizkan
onurtemizkanforce-pushed the onur/react-router-multiple-name-updates branch from 1431408 to 60a9d7cCompareAugust 27, 2025 09:34

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

Phew big change – Did not review all the tests in detail but looks good 🚀

Comment threadpackages/react/src/reactrouter-compat-utils/instrumentation.tsx Outdated
Comment threadpackages/react/src/reactrouter-compat-utils/lazy-routes.tsx Outdated
Comment threadpackages/react/src/reactrouter-compat-utils/index.ts
@chargomechargome self-assigned this Aug 27, 2025
@chargome

Copy link
Copy Markdown
Member

@onurtemizkan Added some minor things myself so I can release that tomorrow, thanks for the refactor!

@chargome
chargome merged commit 895b385 into developAug 27, 2025
319 of 323 checks passed
@chargome
chargome deleted the onur/react-router-multiple-name-updates branch August 27, 2025 20:35
s1gr1d added a commit that referenced this pull request Sep 9, 2025
Removes recently introduced special-casing lazy-route -> lazy-route
transaction name updates.
This completes the fix in #17438.
E2E tests are updated to replicate a similar case in the reproduction
here: #17417
Also manually tested on the reproduction.
---------
Co-authored-by: Sigrid Huemer <32902192+s1gr1d@users.noreply.github.com>
mergifyBot added a commit to reisene/HulajDusza-serwis that referenced this pull request Sep 29, 2025
![snyk-io[bot]](https://badgen.net/badge/icon/snyk-io%5Bbot%5D/green?label=)
![Contributor](https://badgen.net/badge/icon/Contributor/000000?label=)
[<img width="16" alt="Powered by Pull Request Badge"
src="https://user-images.githubusercontent.com/1393946/111216524-d2bb8e00-85d4-11eb-821b-ed4c00989c02.png">](https://pullrequestbadge.com/?utm_medium=github&utm_source=reisene&utm_campaign=badge_info)<!--
PR-BADGE: PLEASE DO NOT REMOVE THIS COMMENT -->
![snyk-top-banner](https://res.cloudinary.com/snyk/image/upload/r-d/scm-platform/snyk-pull-requests/pr-banner-default.svg)
<h3>Snyk has created this PR to upgrade @sentry/profiling-node from
10.8.0 to 10.9.0.</h3>
:information_source: Keep your dependencies up-to-date. This makes it
easier to fix existing vulnerabilities and to more quickly identify and
fix newly disclosed vulnerabilities when they affect your project.
<hr/>
- The recommended version is **1 version** ahead of your current
version.
- The recommended version was released **22 days ago**.
#### Issues fixed by the recommended upgrade:
| | Issue | Score | Exploit Maturity |
:-------------------------:|:-------------------------|:-------------------------|:-------------------------
![low
severity](https://res.cloudinary.com/snyk/image/upload/r-d/scm-platform/snyk-pull-requests//severity-low.svg
'low severity') | Regular Expression Denial of Service
(ReDoS)<br/>[SNYK-JS-BRACEEXPANSION-9789073](https://snyk.io/vuln/SNYK-JS-BRACEEXPANSION-9789073)
| **57** | Proof of Concept
![low
severity](https://res.cloudinary.com/snyk/image/upload/r-d/scm-platform/snyk-pull-requests//severity-low.svg
'low severity') | Regular Expression Denial of Service
(ReDoS)<br/>[SNYK-JS-BRACEEXPANSION-9789073](https://snyk.io/vuln/SNYK-JS-BRACEEXPANSION-9789073)
| **57** | Proof of Concept
<details>
<summary><b>Release notes</b></summary>
<br/>
<details>
<summary>Package name: <b>@sentry/profiling-node</b></summary>
<ul>
<li>
<b>10.9.0</b> - <a
href="https://redirect.github.com/getsentry/sentry-javascript/releases/tag/10.9.0">2025-09-03</a></br><h3>Important
Changes</h3>
<ul>
<li><strong>feat(node): Update <code>httpIntegration</code> handling of
incoming requests (<a
href="https://redirect.github.com/getsentry/sentry-javascript/pull/17371"
data-hovercard-type="pull_request"
data-hovercard-url="/getsentry/sentry-javascript/pull/17371/hovercard">#17371</a>)</strong></li>
</ul>
<p>This version updates the handling of the Node SDK of incoming
requests. Instead of relying on @ opentelemetry/instrumentation-http, we
now handle incoming request instrumentation internally, ensuring that we
can optimize performance as much as possible and avoid interop
problems.</p>
<p>This change should not affect you, unless you're relying on very
in-depth implementation details. Importantly, this also drops the
<code>_experimentalConfig</code> option of the integration - this will
no longer do anything.<br>
Finally, you can still pass
<code>instrumentation.{requestHook,responseHook,applyCustomAttributesOnSpan}</code>
options, but they are deprecated and will be removed in v11. Instead,
you can use the new <code>incomingRequestSpanHook</code> configuration
option if you want to adjust the incoming request span.</p>
<h3>Other Changes</h3>
<ul>
<li>feat(browser): Add replay.feedback CDN bundle (<a
href="https://redirect.github.com/getsentry/sentry-javascript/pull/17496"
data-hovercard-type="pull_request"
data-hovercard-url="/getsentry/sentry-javascript/pull/17496/hovercard">#17496</a>)</li>
<li>feat(browser): Export <code>sendFeedback</code> from CDN bundles (<a
href="https://redirect.github.com/getsentry/sentry-javascript/pull/17495"
data-hovercard-type="pull_request"
data-hovercard-url="/getsentry/sentry-javascript/pull/17495/hovercard">#17495</a>)</li>
<li>fix(astro): Ensure span name from <code>beforeStartSpan</code> isn't
overwritten (<a
href="https://redirect.github.com/getsentry/sentry-javascript/pull/17500"
data-hovercard-type="pull_request"
data-hovercard-url="/getsentry/sentry-javascript/pull/17500/hovercard">#17500</a>)</li>
<li>fix(browser): Ensure source is set correctly when updating span name
in-place in <code>beforeStartSpan</code> (<a
href="https://redirect.github.com/getsentry/sentry-javascript/pull/17501"
data-hovercard-type="pull_request"
data-hovercard-url="/getsentry/sentry-javascript/pull/17501/hovercard">#17501</a>)</li>
<li>fix(core): Only set template attributes on logs if parameters exist
(<a
href="https://redirect.github.com/getsentry/sentry-javascript/pull/17480"
data-hovercard-type="pull_request"
data-hovercard-url="/getsentry/sentry-javascript/pull/17480/hovercard">#17480</a>)</li>
<li>fix(nextjs): Fix parameterization for root catchall routes (<a
href="https://redirect.github.com/getsentry/sentry-javascript/pull/17489"
data-hovercard-type="pull_request"
data-hovercard-url="/getsentry/sentry-javascript/pull/17489/hovercard">#17489</a>)</li>
<li>fix(node-core): Shut down OTel TraceProvider when calling
<code>Sentry.close()</code> (<a
href="https://redirect.github.com/getsentry/sentry-javascript/pull/17499"
data-hovercard-type="pull_request"
data-hovercard-url="/getsentry/sentry-javascript/pull/17499/hovercard">#17499</a>)</li>
</ul>
<details>
<summary> <strong>Internal Changes</strong> </summary>
<ul>
<li>chore: Add <code>changelog</code> script back to package.json (<a
href="https://redirect.github.com/getsentry/sentry-javascript/pull/17517"
data-hovercard-type="pull_request"
data-hovercard-url="/getsentry/sentry-javascript/pull/17517/hovercard">#17517</a>)</li>
<li>chore: Ensure prettier is run on all files (<a
href="https://redirect.github.com/getsentry/sentry-javascript/pull/17497"
data-hovercard-type="pull_request"
data-hovercard-url="/getsentry/sentry-javascript/pull/17497/hovercard">#17497</a>)</li>
<li>chore: Ignore prettier commit for git blame (<a
href="https://redirect.github.com/getsentry/sentry-javascript/pull/17498"
data-hovercard-type="pull_request"
data-hovercard-url="/getsentry/sentry-javascript/pull/17498/hovercard">#17498</a>)</li>
<li>chore: Remove experimental from Nuxt SDK package description (<a
href="https://redirect.github.com/getsentry/sentry-javascript/pull/17483"
data-hovercard-type="pull_request"
data-hovercard-url="/getsentry/sentry-javascript/pull/17483/hovercard">#17483</a>)</li>
<li>ci: Capture overhead in node app (<a
href="https://redirect.github.com/getsentry/sentry-javascript/pull/17420"
data-hovercard-type="pull_request"
data-hovercard-url="/getsentry/sentry-javascript/pull/17420/hovercard">#17420</a>)</li>
<li>ci: Ensure we fail on cancelled jobs (<a
href="https://redirect.github.com/getsentry/sentry-javascript/pull/17506"
data-hovercard-type="pull_request"
data-hovercard-url="/getsentry/sentry-javascript/pull/17506/hovercard">#17506</a>)</li>
<li>ci(deps): bump actions/checkout from 4 to 5 (<a
href="https://redirect.github.com/getsentry/sentry-javascript/pull/17505"
data-hovercard-type="pull_request"
data-hovercard-url="/getsentry/sentry-javascript/pull/17505/hovercard">#17505</a>)</li>
<li>ci(deps): bump actions/create-github-app-token from 2.0.6 to 2.1.1
(<a
href="https://redirect.github.com/getsentry/sentry-javascript/pull/17504"
data-hovercard-type="pull_request"
data-hovercard-url="/getsentry/sentry-javascript/pull/17504/hovercard">#17504</a>)</li>
<li>test(aws): Improve reliability on CI (<a
href="https://redirect.github.com/getsentry/sentry-javascript/pull/17502"
data-hovercard-type="pull_request"
data-hovercard-url="/getsentry/sentry-javascript/pull/17502/hovercard">#17502</a>)</li>
</ul>
</details>
<h2>Bundle size 📦</h2>
<table>
<thead>
<tr>
<th>Path</th>
<th>Size</th>
</tr>
</thead>
<tbody>
<tr>
<td>@ sentry/browser</td>
<td>23.59 KB</td>
</tr>
<tr>
<td>@ sentry/browser - with treeshaking flags</td>
<td>22.2 KB</td>
</tr>
<tr>
<td>@ sentry/browser (incl. Tracing)</td>
<td>38.93 KB</td>
</tr>
<tr>
<td>@ sentry/browser (incl. Tracing, Replay)</td>
<td>76.4 KB</td>
</tr>
<tr>
<td>@ sentry/browser (incl. Tracing, Replay) - with treeshaking
flags</td>
<td>66.43 KB</td>
</tr>
<tr>
<td>@ sentry/browser (incl. Tracing, Replay with Canvas)</td>
<td>80.97 KB</td>
</tr>
<tr>
<td>@ sentry/browser (incl. Tracing, Replay, Feedback)</td>
<td>92.81 KB</td>
</tr>
<tr>
<td>@ sentry/browser (incl. Feedback)</td>
<td>39.88 KB</td>
</tr>
<tr>
<td>@ sentry/browser (incl. sendFeedback)</td>
<td>28.13 KB</td>
</tr>
<tr>
<td>@ sentry/browser (incl. FeedbackAsync)</td>
<td>32.92 KB</td>
</tr>
<tr>
<td>@ sentry/react</td>
<td>25.27 KB</td>
</tr>
<tr>
<td>@ sentry/react (incl. Tracing)</td>
<td>40.91 KB</td>
</tr>
<tr>
<td>@ sentry/vue</td>
<td>27.97 KB</td>
</tr>
<tr>
<td>@ sentry/vue (incl. Tracing)</td>
<td>40.72 KB</td>
</tr>
<tr>
<td>@ sentry/svelte</td>
<td>23.62 KB</td>
</tr>
<tr>
<td>CDN Bundle</td>
<td>25.06 KB</td>
</tr>
<tr>
<td>CDN Bundle (incl. Tracing)</td>
<td>38.82 KB</td>
</tr>
<tr>
<td>CDN Bundle (incl. Tracing, Replay)</td>
<td>74.25 KB</td>
</tr>
<tr>
<td>CDN Bundle (incl. Tracing, Replay, Feedback)</td>
<td>79.56 KB</td>
</tr>
<tr>
<td>CDN Bundle - uncompressed</td>
<td>73.2 KB</td>
</tr>
<tr>
<td>CDN Bundle (incl. Tracing) - uncompressed</td>
<td>114.83 KB</td>
</tr>
<tr>
<td>CDN Bundle (incl. Tracing, Replay) - uncompressed</td>
<td>227.23 KB</td>
</tr>
<tr>
<td>CDN Bundle (incl. Tracing, Replay, Feedback) - uncompressed</td>
<td>239.56 KB</td>
</tr>
<tr>
<td>@ sentry/nextjs (client)</td>
<td>42.86 KB</td>
</tr>
<tr>
<td>@ sentry/sveltekit (client)</td>
<td>39.38 KB</td>
</tr>
<tr>
<td>@ sentry/node-core</td>
<td>48.45 KB</td>
</tr>
<tr>
<td>@ sentry/node</td>
<td>146.74 KB</td>
</tr>
<tr>
<td>@ sentry/node - without tracing</td>
<td>90.02 KB</td>
</tr>
<tr>
<td>@ sentry/aws-serverless</td>
<td>103.01 KB</td>
</tr>
</tbody>
</table>
</li>
<li>
<b>10.8.0</b> - <a
href="https://redirect.github.com/getsentry/sentry-javascript/releases/tag/10.8.0">2025-08-29</a></br><h3>Important
Changes</h3>
<ul>
<li>
<p><strong>feat(sveltekit): Add Compatibility for builtin SvelteKit
Tracing (<a
href="https://redirect.github.com/getsentry/sentry-javascript/pull/17423"
data-hovercard-type="pull_request"
data-hovercard-url="/getsentry/sentry-javascript/pull/17423/hovercard">#17423</a>)</strong></p>
<p>This release makes the <code>@ sentry/sveltekit</code> SDK compatible
with SvelteKit's native <a
href="https://svelte.dev/docs/kit/observability"
rel="nofollow">observability support</a> introduced in SvelteKit version
<code>2.31.0</code>.<br>
If you enable both, instrumentation and tracing, the SDK will now
initialize early enough to set up additional instrumentation like
database queries and it will pick up spans emitted from SvelteKit.</p>
<p>We will follow up with docs how to set up the SDK soon.<br>
For now, If you're on SvelteKit version <code>2.31.0</code> or newer,
you can easily opt into the new feature:</p>
<ol>
<li>
<p>Enable <a href="https://svelte.dev/docs/kit/observability"
rel="nofollow">experimental tracing and instrumentation support</a> in
<code>svelte.config.js</code>:</p>
</li>
<li>
<p>Move your <code>Sentry.init()</code> call from
<code>src/hooks.server.(js|ts)</code> to the new
<code>instrumentation.server.(js|ts)</code> file:</p>
<div class="highlight highlight-source-ts notranslate position-relative
overflow-auto" data-snippet-clipboard-copy-content="//
instrumentation.server.ts
import * as Sentry from '@ sentry/sveltekit';
Sentry.init({
dsn: '...',
// rest of your config
});"><pre><span class="pl-c">// instrumentation.server.ts</span>
<span class="pl-k">import</span> <span class="pl-c1">*</span> <span
class="pl-k">as</span> <span class="pl-v">Sentry</span> <span
class="pl-k">from</span> <span class="pl-s">'@
sentry/sveltekit'</span><span class="pl-kos">;</span>
<span class="pl-v">Sentry</span><span class="pl-kos">.</span><span
class="pl-en">init</span><span class="pl-kos">(</span><span
class="pl-kos">{</span>
<span class="pl-c1">dsn</span>: <span class="pl-s">'...'</span><span
class="pl-kos">,</span>
<span class="pl-c">// rest of your config</span>
<span class="pl-kos">}</span><span class="pl-kos">)</span><span
class="pl-kos">;</span></pre></div>
<p>The rest of your Sentry config in <code>hooks.server.ts</code>
(<code>sentryHandle</code> and <code>handleErrorWithSentry</code>)
should stay the same.</p>
</li>
</ol>
<p>If you prefer to stay on the hooks-file based config for now, the SDK
will continue to work as previously.</p>
<p>Thanks to the Svelte team and <a class="user-mention notranslate"
data-hovercard-type="user"
data-hovercard-url="/users/elliott-with-the-longest-name-on-github/hovercard"
data-octo-click="hovercard-link-click"
data-octo-dimensions="link_type:self"
href="https://redirect.github.com/elliott-with-the-longest-name-on-github">@
elliott-with-the-longest-name-on-github</a> for implementing
observability support and for reviewing our PR!</p>
</li>
</ul>
<h3>Other Changes</h3>
<ul>
<li>fix(react): Avoid multiple name updates on navigation spans (<a
href="https://redirect.github.com/getsentry/sentry-javascript/pull/17438"
data-hovercard-type="pull_request"
data-hovercard-url="/getsentry/sentry-javascript/pull/17438/hovercard">#17438</a>)</li>
</ul>
<details>
<summary> <strong>Internal Changes</strong> </summary>
<ul>
<li>test(profiling): Add tests for current state of profiling (<a
href="https://redirect.github.com/getsentry/sentry-javascript/pull/17470"
data-hovercard-type="pull_request"
data-hovercard-url="/getsentry/sentry-javascript/pull/17470/hovercard">#17470</a>)</li>
</ul>
</details>
<h2>Bundle size 📦</h2>
<table>
<thead>
<tr>
<th>Path</th>
<th>Size</th>
</tr>
</thead>
<tbody>
<tr>
<td>@ sentry/browser</td>
<td>23.59 KB</td>
</tr>
<tr>
<td>@ sentry/browser - with treeshaking flags</td>
<td>22.2 KB</td>
</tr>
<tr>
<td>@ sentry/browser (incl. Tracing)</td>
<td>38.94 KB</td>
</tr>
<tr>
<td>@ sentry/browser (incl. Tracing, Replay)</td>
<td>76.4 KB</td>
</tr>
<tr>
<td>@ sentry/browser (incl. Tracing, Replay) - with treeshaking
flags</td>
<td>66.43 KB</td>
</tr>
<tr>
<td>@ sentry/browser (incl. Tracing, Replay with Canvas)</td>
<td>80.97 KB</td>
</tr>
<tr>
<td>@ sentry/browser (incl. Tracing, Replay, Feedback)</td>
<td>92.8 KB</td>
</tr>
<tr>
<td>@ sentry/browser (incl. Feedback)</td>
<td>39.88 KB</td>
</tr>
<tr>
<td>@ sentry/browser (incl. sendFeedback)</td>
<td>28.13 KB</td>
</tr>
<tr>
<td>@ sentry/browser (incl. FeedbackAsync)</td>
<td>32.92 KB</td>
</tr>
<tr>
<td>@ sentry/react</td>
<td>25.27 KB</td>
</tr>
<tr>
<td>@ sentry/react (incl. Tracing)</td>
<td>40.91 KB</td>
</tr>
<tr>
<td>@ sentry/vue</td>
<td>27.97 KB</td>
</tr>
<tr>
<td>@ sentry/vue (incl. Tracing)</td>
<td>40.72 KB</td>
</tr>
<tr>
<td>@ sentry/svelte</td>
<td>23.62 KB</td>
</tr>
<tr>
<td>CDN Bundle</td>
<td>25.06 KB</td>
</tr>
<tr>
<td>CDN Bundle (incl. Tracing)</td>
<td>38.82 KB</td>
</tr>
<tr>
<td>CDN Bundle (incl. Tracing, Replay)</td>
<td>74.24 KB</td>
</tr>
<tr>
<td>CDN Bundle (incl. Tracing, Replay, Feedback)</td>
<td>79.55 KB</td>
</tr>
<tr>
<td>CDN Bundle - uncompressed</td>
<td>73.2 KB</td>
</tr>
<tr>
<td>CDN Bundle (incl. Tracing) - uncompressed</td>
<td>114.83 KB</td>
</tr>
<tr>
<td>CDN Bundle (incl. Tracing, Replay) - uncompressed</td>
<td>227.23 KB</td>
</tr>
<tr>
<td>CDN Bundle (incl. Tracing, Replay, Feedback) - uncompressed</td>
<td>239.53 KB</td>
</tr>
<tr>
<td>@ sentry/nextjs (client)</td>
<td>42.86 KB</td>
</tr>
<tr>
<td>@ sentry/sveltekit (client)</td>
<td>39.38 KB</td>
</tr>
<tr>
<td>@ sentry/node-core</td>
<td>46.87 KB</td>
</tr>
<tr>
<td>@ sentry/node</td>
<td>145.75 KB</td>
</tr>
<tr>
<td>@ sentry/node - without tracing</td>
<td>90.08 KB</td>
</tr>
<tr>
<td>@ sentry/aws-serverless</td>
<td>102.45 KB</td>
</tr>
</tbody>
</table>
</li>
</ul>
from <a
href="https://redirect.github.com/getsentry/sentry-javascript/releases">@sentry/profiling-node
GitHub release notes</a>
</details>
</details>
---
> [!IMPORTANT]
>
> - Check the changes in this PR to ensure they won't cause issues with
your project.
> - This PR was automatically created by Snyk using the credentials of a
real user.
> - Max score is 1000. Note that the real score may have changed since
the PR was raised.
---
**Note:** _You are seeing this because you or someone else with access
to this repository has authorized Snyk to open upgrade PRs._
**For more information:** <img
src="https://api.segment.io/v1/pixel/track?data=eyJ3cml0ZUtleSI6InJyWmxZcEdHY2RyTHZsb0lYd0dUcVg4WkFRTnNCOUEwIiwiYW5vbnltb3VzSWQiOiI2MDhkOWU5ZS04ZDBlLTQ5N2EtYTNkZS1mMTVkYzU1YmNkNTciLCJldmVudCI6IlBSIHZpZXdlZCIsInByb3BlcnRpZXMiOnsicHJJZCI6IjYwOGQ5ZTllLThkMGUtNDk3YS1hM2RlLWYxNWRjNTViY2Q1NyJ9fQ=="
width="0" height="0"/>
> - 🧐 [View latest project
report](https://app.snyk.io/org/reisene/project/55e114f8-489e-4f14-b900-20574b041e59?utm_source&#x3D;github-cloud-app&amp;utm_medium&#x3D;referral&amp;page&#x3D;upgrade-pr)
> - 📜 [Customise PR
templates](https://docs.snyk.io/scan-using-snyk/pull-requests/snyk-fix-pull-or-merge-requests/customize-pr-templates?utm_source=&utm_content=fix-pr-template)
> - 🛠 [Adjust upgrade PR
settings](https://app.snyk.io/org/reisene/project/55e114f8-489e-4f14-b900-20574b041e59/settings/integration?utm_source&#x3D;github-cloud-app&amp;utm_medium&#x3D;referral&amp;page&#x3D;upgrade-pr)
> - 🔕 [Ignore this dependency or unsubscribe from future upgrade
PRs](https://app.snyk.io/org/reisene/project/55e114f8-489e-4f14-b900-20574b041e59/settings/integration?pkg&#x3D;@sentry/profiling-node&amp;utm_source&#x3D;github-cloud-app&amp;utm_medium&#x3D;referral&amp;page&#x3D;upgrade-pr#auto-dep-upgrades)
[//]: #
'snyk:metadata:{"customTemplate":{"variablesUsed":[],"fieldsUsed":[]},"dependencies":[{"name":"@sentry/profiling-node","from":"10.8.0","to":"10.9.0"}],"env":"prod","hasFixes":true,"isBreakingChange":false,"isMajorUpgrade":false,"issuesToFix":["SNYK-JS-BRACEEXPANSION-9789073","SNYK-JS-BRACEEXPANSION-9789073"],"prId":"608d9e9e-8d0e-497a-a3de-f15dc55bcd57","prPublicId":"608d9e9e-8d0e-497a-a3de-f15dc55bcd57","packageManager":"npm","priorityScoreList":[57],"projectPublicId":"55e114f8-489e-4f14-b900-20574b041e59","projectUrl":"https://app.snyk.io/org/reisene/project/55e114f8-489e-4f14-b900-20574b041e59?utm_source=github-cloud-app&utm_medium=referral&page=upgrade-pr","prType":"upgrade","templateFieldSources":{"branchName":"default","commitMessage":"default","description":"default","title":"default"},"templateVariants":["priorityScore"],"type":"auto","upgrade":["SNYK-JS-BRACEEXPANSION-9789073","SNYK-JS-BRACEEXPANSION-9789073"],"upgradeInfo":{"versionsDiff":1,"publishedDate":"2025-09-03T12:59:52.227Z"},"vulns":["SNYK-JS-BRACEEXPANSION-9789073","SNYK-JS-BRACEEXPANSION-9789073"]}'
onurtemizkan added a commit that referenced this pull request Feb 10, 2026
…es (#19086)
This PR will resolve the core reason for the series of fixes / handling
for automatic lazy-route resolution for a while.
Related: #18898,
#18881,
#18346,
#18155,
#18098,
#17962,
#17867,
#17438,
#17277
The core issue we have been trying to tackle is not having access to the
complete route hierarchy when asynchronously loaded lazy routes are
used. React Router provides a route manifest that we can use while
matching parameterized transaction names with routes in all cases except
this lazy-routes pattern.
This problem has been discussed on React Router:
- remix-run/react-router#11113
While this has been
[addressed](remix-run/react-router#11626) for
Remix / React Router (Framework Mode), it's still not available in
Library Mode. The manifest contains the lazily-loaded route, only when
it's navigated to. While waiting for navigation, our transactions can be
dropped for several reasons, such as user behaviour like switching tabs
(`document.hidden` guard), hitting timeouts like `idleTimeout`, and
potentially other reasons. This results in incomplete transaction naming
with leftover wildcards, which caused broken aggregation on the Sentry
dashboard.
The series of attempts to fix this while keeping automatic route
discovery has been prone to race conditions and required special-case
handling of each edge case scenario, also requiring a considerable
amount of internal logic, affecting our readability and performance. At
the end, all failed in giving completely robust and deterministic
results on the customers' side.
This PR proposes a new option: `lazyRouteManifest` specifically for lazy
routes. This will let us have initial information about the route
hierarchy. So we can assign correct parameterized transaction names
without needing to wait for navigated state.
It's a static array of routes in parameterized format (needs to be
maintained by the users on route hierarchy updates) like:
```ts
Sentry.reactRouterV7BrowserTracingIntegration({
// ...
enableAsyncRouteHandlers: true
lazyRouteManifest: [
'/',
'/pricing',
'/features',
'/login',
'/signup',
'/forgot-password',
'/reset-password/:token',
'/org/:orgSlug',
'/org/:orgSlug/dashboard',
'/org/:orgSlug/projects',
'/org/:orgSlug/projects/:projectId',
'/org/:orgSlug/projects/:projectId/settings',
'/org/:orgSlug/projects/:projectId/issues',
'/org/:orgSlug/projects/:projectId/issues/:issueId',
'/org/:orgSlug/team',
'/org/:orgSlug/team/:memberId',
'/org/:orgSlug/settings',
'/org/:orgSlug/billing',
'/admin',
'/admin/users',
'/admin/users/:userId',
'/admin/orgs',
'/admin/orgs/:orgId',
],
})
```
- This will only be active when `enableAsyncRouteHandlers` is set to
`true`
- To match URLs with given routes, we mimic React Router's own
implementation.
- When this is not provided or fails, it falls back to the current
behaviour
- This manifest is primarily for lazy routes, but the users can also add
their non-lazy routes here for convenience or consistency.
- Also added E2E tests that will fail when (if at some point) React
Router manifests include the lazy routes before navigation, so we'll be
aware and plan depending on that manifest instead.
- We can do a cleanup for the race-condition / edge-case handling part
of the code in a follow-up PR.
Closes#19090 (added automatically)
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.

3 participants

@onurtemizkan@chargome
, '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

fix(react): Avoid multiple name updates on navigation spans - #17438

Merged
chargome merged 16 commits into
developfrom
onur/react-router-multiple-name-updates
Aug 27, 2025
Merged

fix(react): Avoid multiple name updates on navigation spans#17438
chargome merged 16 commits into
developfrom
onur/react-router-multiple-name-updates

Conversation

@onurtemizkan

@onurtemizkanonurtemizkan commented Aug 21, 2025

Copy link
Copy Markdown
Contributor

This patch prevents name updates on navigation spans from being applied more than once.

This was fine and allowed for cross-usage of different instrumentation ways (such as instrumenting useRoutes and createBrowserRouter together), and didn't create any issues. But after adding support for lazy routes, it led to incorrect transaction names, especially when there's a navigation between two lazily-loaded routes.

While on it, I also had to do some refactoring to keep the code readable and maintainable, so now reactrouterv6-compat-utils is separated into 3 source files (instrumentation, common utils, and lazy routes specific functionality).

@onurtemizkan
onurtemizkanforce-pushed the onur/react-router-multiple-name-updates branch 4 times, most recently from aea2217 to 57c8b22CompareAugust 22, 2025 13:13
@github-actions

github-actionsBot commented Aug 22, 2025

Copy link
Copy Markdown
Contributor

size-limit report 📦

PathSize% ChangeChange
@sentry/browser24.16 kB--
@sentry/browser - with treeshaking flags22.73 kB--
@sentry/browser (incl. Tracing)39.87 kB--
@sentry/browser (incl. Tracing, Replay)78.23 kB--
@sentry/browser (incl. Tracing, Replay) - with treeshaking flags68.02 kB--
@sentry/browser (incl. Tracing, Replay with Canvas)82.91 kB--
@sentry/browser (incl. Tracing, Replay, Feedback)95.03 kB--
@sentry/browser (incl. Feedback)40.83 kB--
@sentry/browser (incl. sendFeedback)28.81 kB--
@sentry/browser (incl. FeedbackAsync)33.7 kB--
@sentry/react25.88 kB--
@sentry/react (incl. Tracing)41.89 kB+0.06%+23 B 🔺
@sentry/vue28.64 kB--
@sentry/vue (incl. Tracing)41.69 kB--
@sentry/svelte24.18 kB--
CDN Bundle25.66 kB--
CDN Bundle (incl. Tracing)39.75 kB--
CDN Bundle (incl. Tracing, Replay)76.03 kB--
CDN Bundle (incl. Tracing, Replay, Feedback)81.46 kB--
CDN Bundle - uncompressed74.96 kB--
CDN Bundle (incl. Tracing) - uncompressed117.59 kB--
CDN Bundle (incl. Tracing, Replay) - uncompressed232.68 kB--
CDN Bundle (incl. Tracing, Replay, Feedback) - uncompressed245.28 kB--
@sentry/nextjs (client)43.89 kB--
@sentry/sveltekit (client)40.32 kB--
@sentry/node-core47.99 kB-0.01%-1 B 🔽
@sentry/node149.25 kB--
@sentry/node - without tracing92.24 kB--
@sentry/aws-serverless104.91 kB+0.01%+1 B 🔺

View base workflow run

@onurtemizkan
onurtemizkanforce-pushed the onur/react-router-multiple-name-updates branch 4 times, most recently from 0e679dc to 27c5da6CompareAugust 27, 2025 00:18
@onurtemizkan
onurtemizkanforce-pushed the onur/react-router-multiple-name-updates branch from 8da7c27 to 453f5c6CompareAugust 27, 2025 07:29
@onurtemizkan
onurtemizkan marked this pull request as ready for review August 27, 2025 07:29
cursor[bot]

This comment was marked as outdated.

@onurtemizkan
onurtemizkanforce-pushed the onur/react-router-multiple-name-updates branch from 1d2839b to 8507984CompareAugust 27, 2025 08:16

CopilotAI 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.

Pull Request Overview

This PR refactors the React Router v6/v7 compatibility utilities to prevent multiple navigation span name updates and fix incorrect transaction names for lazy routes.

  • Refactors the reactrouterv6-compat-utils module into three separate files for better organization
  • Implements tracking to prevent duplicate navigation span name updates during navigation
  • Fixes transaction naming issues that occurred when navigating between lazy routes

Reviewed Changes

Copilot reviewed 16 out of 16 changed files in this pull request and generated 4 comments.

Show a summary per file
FileDescription
packages/react/test/reactrouterv6-compat-utils.test.tsxRemoves entire test file as functionality moved to new modules
packages/react/test/reactrouter-cross-usage.test.tsxRemoves assertions expecting multiple updateName calls since they're now prevented
packages/react/test/reactrouter-compat-utils/utils.test.tsAdds comprehensive tests for utility functions moved from old module
packages/react/test/reactrouter-compat-utils/lazy-routes.test.tsAdds tests for lazy route handling functionality
packages/react/test/reactrouter-compat-utils/instrumentation.test.tsxAdds tests for instrumentation-specific functionality
packages/react/src/reactrouterv7.tsxUpdates import path to new module structure
packages/react/src/reactrouterv6.tsxUpdates import path to new module structure
packages/react/src/reactrouter-compat-utils/utils.tsNew utility functions module with core router utilities
packages/react/src/reactrouter-compat-utils/lazy-routes.tsxNew module for lazy route handling functionality
packages/react/src/reactrouter-compat-utils/instrumentation.tsxNew main instrumentation module with navigation span tracking
packages/react/src/reactrouter-compat-utils/index.tsNew index file exporting all functionality from sub-modules
dev-packages/e2e-tests/test-applications/react-router-7-lazy-routes/tests/transactions.test.tsAdds tests for navigation between lazy routes
dev-packages/e2e-tests/test-applications/react-router-7-lazy-routes/src/pages/InnerLazyRoutes.tsxAdds navigation link to another lazy route
dev-packages/e2e-tests/test-applications/react-router-7-lazy-routes/src/pages/Index.tsxAdds navigation links to lazy routes
dev-packages/e2e-tests/test-applications/react-router-7-lazy-routes/src/pages/AnotherLazyRoutes.tsxAdds new lazy route component with navigation links
dev-packages/e2e-tests/test-applications/react-router-7-lazy-routes/src/index.tsxAdds another lazy route configuration

Tip: Customize your code reviews with copilot-instructions.md. Create the file or learn how to get started.

Comment threadpackages/react/src/reactrouter-compat-utils/instrumentation.tsx Outdated
Comment threadpackages/react/src/reactrouter-compat-utils/instrumentation.tsx Outdated
Comment threadpackages/react/src/reactrouter-compat-utils/utils.ts Outdated
@onurtemizkan
onurtemizkanforce-pushed the onur/react-router-multiple-name-updates branch from 1431408 to 60a9d7cCompareAugust 27, 2025 09:34

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

Phew big change – Did not review all the tests in detail but looks good 🚀

Comment threadpackages/react/src/reactrouter-compat-utils/instrumentation.tsx Outdated
Comment threadpackages/react/src/reactrouter-compat-utils/lazy-routes.tsx Outdated
Comment threadpackages/react/src/reactrouter-compat-utils/index.ts
@chargomechargome self-assigned this Aug 27, 2025
@chargome

Copy link
Copy Markdown
Member

@onurtemizkan Added some minor things myself so I can release that tomorrow, thanks for the refactor!

@chargome
chargome merged commit 895b385 into developAug 27, 2025
319 of 323 checks passed
@chargome
chargome deleted the onur/react-router-multiple-name-updates branch August 27, 2025 20:35
s1gr1d added a commit that referenced this pull request Sep 9, 2025
Removes recently introduced special-casing lazy-route -> lazy-route
transaction name updates.
This completes the fix in #17438.
E2E tests are updated to replicate a similar case in the reproduction
here: #17417
Also manually tested on the reproduction.
---------
Co-authored-by: Sigrid Huemer <32902192+s1gr1d@users.noreply.github.com>
mergifyBot added a commit to reisene/HulajDusza-serwis that referenced this pull request Sep 29, 2025
![snyk-io[bot]](https://badgen.net/badge/icon/snyk-io%5Bbot%5D/green?label=)
![Contributor](https://badgen.net/badge/icon/Contributor/000000?label=)
[<img width="16" alt="Powered by Pull Request Badge"
src="https://user-images.githubusercontent.com/1393946/111216524-d2bb8e00-85d4-11eb-821b-ed4c00989c02.png">](https://pullrequestbadge.com/?utm_medium=github&utm_source=reisene&utm_campaign=badge_info)<!--
PR-BADGE: PLEASE DO NOT REMOVE THIS COMMENT -->
![snyk-top-banner](https://res.cloudinary.com/snyk/image/upload/r-d/scm-platform/snyk-pull-requests/pr-banner-default.svg)
<h3>Snyk has created this PR to upgrade @sentry/profiling-node from
10.8.0 to 10.9.0.</h3>
:information_source: Keep your dependencies up-to-date. This makes it
easier to fix existing vulnerabilities and to more quickly identify and
fix newly disclosed vulnerabilities when they affect your project.
<hr/>
- The recommended version is **1 version** ahead of your current
version.
- The recommended version was released **22 days ago**.
#### Issues fixed by the recommended upgrade:
| | Issue | Score | Exploit Maturity |
:-------------------------:|:-------------------------|:-------------------------|:-------------------------
![low
severity](https://res.cloudinary.com/snyk/image/upload/r-d/scm-platform/snyk-pull-requests//severity-low.svg
'low severity') | Regular Expression Denial of Service
(ReDoS)<br/>[SNYK-JS-BRACEEXPANSION-9789073](https://snyk.io/vuln/SNYK-JS-BRACEEXPANSION-9789073)
| **57** | Proof of Concept
![low
severity](https://res.cloudinary.com/snyk/image/upload/r-d/scm-platform/snyk-pull-requests//severity-low.svg
'low severity') | Regular Expression Denial of Service
(ReDoS)<br/>[SNYK-JS-BRACEEXPANSION-9789073](https://snyk.io/vuln/SNYK-JS-BRACEEXPANSION-9789073)
| **57** | Proof of Concept
<details>
<summary><b>Release notes</b></summary>
<br/>
<details>
<summary>Package name: <b>@sentry/profiling-node</b></summary>
<ul>
<li>
<b>10.9.0</b> - <a
href="https://redirect.github.com/getsentry/sentry-javascript/releases/tag/10.9.0">2025-09-03</a></br><h3>Important
Changes</h3>
<ul>
<li><strong>feat(node): Update <code>httpIntegration</code> handling of
incoming requests (<a
href="https://redirect.github.com/getsentry/sentry-javascript/pull/17371"
data-hovercard-type="pull_request"
data-hovercard-url="/getsentry/sentry-javascript/pull/17371/hovercard">#17371</a>)</strong></li>
</ul>
<p>This version updates the handling of the Node SDK of incoming
requests. Instead of relying on @ opentelemetry/instrumentation-http, we
now handle incoming request instrumentation internally, ensuring that we
can optimize performance as much as possible and avoid interop
problems.</p>
<p>This change should not affect you, unless you're relying on very
in-depth implementation details. Importantly, this also drops the
<code>_experimentalConfig</code> option of the integration - this will
no longer do anything.<br>
Finally, you can still pass
<code>instrumentation.{requestHook,responseHook,applyCustomAttributesOnSpan}</code>
options, but they are deprecated and will be removed in v11. Instead,
you can use the new <code>incomingRequestSpanHook</code> configuration
option if you want to adjust the incoming request span.</p>
<h3>Other Changes</h3>
<ul>
<li>feat(browser): Add replay.feedback CDN bundle (<a
href="https://redirect.github.com/getsentry/sentry-javascript/pull/17496"
data-hovercard-type="pull_request"
data-hovercard-url="/getsentry/sentry-javascript/pull/17496/hovercard">#17496</a>)</li>
<li>feat(browser): Export <code>sendFeedback</code> from CDN bundles (<a
href="https://redirect.github.com/getsentry/sentry-javascript/pull/17495"
data-hovercard-type="pull_request"
data-hovercard-url="/getsentry/sentry-javascript/pull/17495/hovercard">#17495</a>)</li>
<li>fix(astro): Ensure span name from <code>beforeStartSpan</code> isn't
overwritten (<a
href="https://redirect.github.com/getsentry/sentry-javascript/pull/17500"
data-hovercard-type="pull_request"
data-hovercard-url="/getsentry/sentry-javascript/pull/17500/hovercard">#17500</a>)</li>
<li>fix(browser): Ensure source is set correctly when updating span name
in-place in <code>beforeStartSpan</code> (<a
href="https://redirect.github.com/getsentry/sentry-javascript/pull/17501"
data-hovercard-type="pull_request"
data-hovercard-url="/getsentry/sentry-javascript/pull/17501/hovercard">#17501</a>)</li>
<li>fix(core): Only set template attributes on logs if parameters exist
(<a
href="https://redirect.github.com/getsentry/sentry-javascript/pull/17480"
data-hovercard-type="pull_request"
data-hovercard-url="/getsentry/sentry-javascript/pull/17480/hovercard">#17480</a>)</li>
<li>fix(nextjs): Fix parameterization for root catchall routes (<a
href="https://redirect.github.com/getsentry/sentry-javascript/pull/17489"
data-hovercard-type="pull_request"
data-hovercard-url="/getsentry/sentry-javascript/pull/17489/hovercard">#17489</a>)</li>
<li>fix(node-core): Shut down OTel TraceProvider when calling
<code>Sentry.close()</code> (<a
href="https://redirect.github.com/getsentry/sentry-javascript/pull/17499"
data-hovercard-type="pull_request"
data-hovercard-url="/getsentry/sentry-javascript/pull/17499/hovercard">#17499</a>)</li>
</ul>
<details>
<summary> <strong>Internal Changes</strong> </summary>
<ul>
<li>chore: Add <code>changelog</code> script back to package.json (<a
href="https://redirect.github.com/getsentry/sentry-javascript/pull/17517"
data-hovercard-type="pull_request"
data-hovercard-url="/getsentry/sentry-javascript/pull/17517/hovercard">#17517</a>)</li>
<li>chore: Ensure prettier is run on all files (<a
href="https://redirect.github.com/getsentry/sentry-javascript/pull/17497"
data-hovercard-type="pull_request"
data-hovercard-url="/getsentry/sentry-javascript/pull/17497/hovercard">#17497</a>)</li>
<li>chore: Ignore prettier commit for git blame (<a
href="https://redirect.github.com/getsentry/sentry-javascript/pull/17498"
data-hovercard-type="pull_request"
data-hovercard-url="/getsentry/sentry-javascript/pull/17498/hovercard">#17498</a>)</li>
<li>chore: Remove experimental from Nuxt SDK package description (<a
href="https://redirect.github.com/getsentry/sentry-javascript/pull/17483"
data-hovercard-type="pull_request"
data-hovercard-url="/getsentry/sentry-javascript/pull/17483/hovercard">#17483</a>)</li>
<li>ci: Capture overhead in node app (<a
href="https://redirect.github.com/getsentry/sentry-javascript/pull/17420"
data-hovercard-type="pull_request"
data-hovercard-url="/getsentry/sentry-javascript/pull/17420/hovercard">#17420</a>)</li>
<li>ci: Ensure we fail on cancelled jobs (<a
href="https://redirect.github.com/getsentry/sentry-javascript/pull/17506"
data-hovercard-type="pull_request"
data-hovercard-url="/getsentry/sentry-javascript/pull/17506/hovercard">#17506</a>)</li>
<li>ci(deps): bump actions/checkout from 4 to 5 (<a
href="https://redirect.github.com/getsentry/sentry-javascript/pull/17505"
data-hovercard-type="pull_request"
data-hovercard-url="/getsentry/sentry-javascript/pull/17505/hovercard">#17505</a>)</li>
<li>ci(deps): bump actions/create-github-app-token from 2.0.6 to 2.1.1
(<a
href="https://redirect.github.com/getsentry/sentry-javascript/pull/17504"
data-hovercard-type="pull_request"
data-hovercard-url="/getsentry/sentry-javascript/pull/17504/hovercard">#17504</a>)</li>
<li>test(aws): Improve reliability on CI (<a
href="https://redirect.github.com/getsentry/sentry-javascript/pull/17502"
data-hovercard-type="pull_request"
data-hovercard-url="/getsentry/sentry-javascript/pull/17502/hovercard">#17502</a>)</li>
</ul>
</details>
<h2>Bundle size 📦</h2>
<table>
<thead>
<tr>
<th>Path</th>
<th>Size</th>
</tr>
</thead>
<tbody>
<tr>
<td>@ sentry/browser</td>
<td>23.59 KB</td>
</tr>
<tr>
<td>@ sentry/browser - with treeshaking flags</td>
<td>22.2 KB</td>
</tr>
<tr>
<td>@ sentry/browser (incl. Tracing)</td>
<td>38.93 KB</td>
</tr>
<tr>
<td>@ sentry/browser (incl. Tracing, Replay)</td>
<td>76.4 KB</td>
</tr>
<tr>
<td>@ sentry/browser (incl. Tracing, Replay) - with treeshaking
flags</td>
<td>66.43 KB</td>
</tr>
<tr>
<td>@ sentry/browser (incl. Tracing, Replay with Canvas)</td>
<td>80.97 KB</td>
</tr>
<tr>
<td>@ sentry/browser (incl. Tracing, Replay, Feedback)</td>
<td>92.81 KB</td>
</tr>
<tr>
<td>@ sentry/browser (incl. Feedback)</td>
<td>39.88 KB</td>
</tr>
<tr>
<td>@ sentry/browser (incl. sendFeedback)</td>
<td>28.13 KB</td>
</tr>
<tr>
<td>@ sentry/browser (incl. FeedbackAsync)</td>
<td>32.92 KB</td>
</tr>
<tr>
<td>@ sentry/react</td>
<td>25.27 KB</td>
</tr>
<tr>
<td>@ sentry/react (incl. Tracing)</td>
<td>40.91 KB</td>
</tr>
<tr>
<td>@ sentry/vue</td>
<td>27.97 KB</td>
</tr>
<tr>
<td>@ sentry/vue (incl. Tracing)</td>
<td>40.72 KB</td>
</tr>
<tr>
<td>@ sentry/svelte</td>
<td>23.62 KB</td>
</tr>
<tr>
<td>CDN Bundle</td>
<td>25.06 KB</td>
</tr>
<tr>
<td>CDN Bundle (incl. Tracing)</td>
<td>38.82 KB</td>
</tr>
<tr>
<td>CDN Bundle (incl. Tracing, Replay)</td>
<td>74.25 KB</td>
</tr>
<tr>
<td>CDN Bundle (incl. Tracing, Replay, Feedback)</td>
<td>79.56 KB</td>
</tr>
<tr>
<td>CDN Bundle - uncompressed</td>
<td>73.2 KB</td>
</tr>
<tr>
<td>CDN Bundle (incl. Tracing) - uncompressed</td>
<td>114.83 KB</td>
</tr>
<tr>
<td>CDN Bundle (incl. Tracing, Replay) - uncompressed</td>
<td>227.23 KB</td>
</tr>
<tr>
<td>CDN Bundle (incl. Tracing, Replay, Feedback) - uncompressed</td>
<td>239.56 KB</td>
</tr>
<tr>
<td>@ sentry/nextjs (client)</td>
<td>42.86 KB</td>
</tr>
<tr>
<td>@ sentry/sveltekit (client)</td>
<td>39.38 KB</td>
</tr>
<tr>
<td>@ sentry/node-core</td>
<td>48.45 KB</td>
</tr>
<tr>
<td>@ sentry/node</td>
<td>146.74 KB</td>
</tr>
<tr>
<td>@ sentry/node - without tracing</td>
<td>90.02 KB</td>
</tr>
<tr>
<td>@ sentry/aws-serverless</td>
<td>103.01 KB</td>
</tr>
</tbody>
</table>
</li>
<li>
<b>10.8.0</b> - <a
href="https://redirect.github.com/getsentry/sentry-javascript/releases/tag/10.8.0">2025-08-29</a></br><h3>Important
Changes</h3>
<ul>
<li>
<p><strong>feat(sveltekit): Add Compatibility for builtin SvelteKit
Tracing (<a
href="https://redirect.github.com/getsentry/sentry-javascript/pull/17423"
data-hovercard-type="pull_request"
data-hovercard-url="/getsentry/sentry-javascript/pull/17423/hovercard">#17423</a>)</strong></p>
<p>This release makes the <code>@ sentry/sveltekit</code> SDK compatible
with SvelteKit's native <a
href="https://svelte.dev/docs/kit/observability"
rel="nofollow">observability support</a> introduced in SvelteKit version
<code>2.31.0</code>.<br>
If you enable both, instrumentation and tracing, the SDK will now
initialize early enough to set up additional instrumentation like
database queries and it will pick up spans emitted from SvelteKit.</p>
<p>We will follow up with docs how to set up the SDK soon.<br>
For now, If you're on SvelteKit version <code>2.31.0</code> or newer,
you can easily opt into the new feature:</p>
<ol>
<li>
<p>Enable <a href="https://svelte.dev/docs/kit/observability"
rel="nofollow">experimental tracing and instrumentation support</a> in
<code>svelte.config.js</code>:</p>
</li>
<li>
<p>Move your <code>Sentry.init()</code> call from
<code>src/hooks.server.(js|ts)</code> to the new
<code>instrumentation.server.(js|ts)</code> file:</p>
<div class="highlight highlight-source-ts notranslate position-relative
overflow-auto" data-snippet-clipboard-copy-content="//
instrumentation.server.ts
import * as Sentry from '@ sentry/sveltekit';
Sentry.init({
dsn: '...',
// rest of your config
});"><pre><span class="pl-c">// instrumentation.server.ts</span>
<span class="pl-k">import</span> <span class="pl-c1">*</span> <span
class="pl-k">as</span> <span class="pl-v">Sentry</span> <span
class="pl-k">from</span> <span class="pl-s">'@
sentry/sveltekit'</span><span class="pl-kos">;</span>
<span class="pl-v">Sentry</span><span class="pl-kos">.</span><span
class="pl-en">init</span><span class="pl-kos">(</span><span
class="pl-kos">{</span>
<span class="pl-c1">dsn</span>: <span class="pl-s">'...'</span><span
class="pl-kos">,</span>
<span class="pl-c">// rest of your config</span>
<span class="pl-kos">}</span><span class="pl-kos">)</span><span
class="pl-kos">;</span></pre></div>
<p>The rest of your Sentry config in <code>hooks.server.ts</code>
(<code>sentryHandle</code> and <code>handleErrorWithSentry</code>)
should stay the same.</p>
</li>
</ol>
<p>If you prefer to stay on the hooks-file based config for now, the SDK
will continue to work as previously.</p>
<p>Thanks to the Svelte team and <a class="user-mention notranslate"
data-hovercard-type="user"
data-hovercard-url="/users/elliott-with-the-longest-name-on-github/hovercard"
data-octo-click="hovercard-link-click"
data-octo-dimensions="link_type:self"
href="https://redirect.github.com/elliott-with-the-longest-name-on-github">@
elliott-with-the-longest-name-on-github</a> for implementing
observability support and for reviewing our PR!</p>
</li>
</ul>
<h3>Other Changes</h3>
<ul>
<li>fix(react): Avoid multiple name updates on navigation spans (<a
href="https://redirect.github.com/getsentry/sentry-javascript/pull/17438"
data-hovercard-type="pull_request"
data-hovercard-url="/getsentry/sentry-javascript/pull/17438/hovercard">#17438</a>)</li>
</ul>
<details>
<summary> <strong>Internal Changes</strong> </summary>
<ul>
<li>test(profiling): Add tests for current state of profiling (<a
href="https://redirect.github.com/getsentry/sentry-javascript/pull/17470"
data-hovercard-type="pull_request"
data-hovercard-url="/getsentry/sentry-javascript/pull/17470/hovercard">#17470</a>)</li>
</ul>
</details>
<h2>Bundle size 📦</h2>
<table>
<thead>
<tr>
<th>Path</th>
<th>Size</th>
</tr>
</thead>
<tbody>
<tr>
<td>@ sentry/browser</td>
<td>23.59 KB</td>
</tr>
<tr>
<td>@ sentry/browser - with treeshaking flags</td>
<td>22.2 KB</td>
</tr>
<tr>
<td>@ sentry/browser (incl. Tracing)</td>
<td>38.94 KB</td>
</tr>
<tr>
<td>@ sentry/browser (incl. Tracing, Replay)</td>
<td>76.4 KB</td>
</tr>
<tr>
<td>@ sentry/browser (incl. Tracing, Replay) - with treeshaking
flags</td>
<td>66.43 KB</td>
</tr>
<tr>
<td>@ sentry/browser (incl. Tracing, Replay with Canvas)</td>
<td>80.97 KB</td>
</tr>
<tr>
<td>@ sentry/browser (incl. Tracing, Replay, Feedback)</td>
<td>92.8 KB</td>
</tr>
<tr>
<td>@ sentry/browser (incl. Feedback)</td>
<td>39.88 KB</td>
</tr>
<tr>
<td>@ sentry/browser (incl. sendFeedback)</td>
<td>28.13 KB</td>
</tr>
<tr>
<td>@ sentry/browser (incl. FeedbackAsync)</td>
<td>32.92 KB</td>
</tr>
<tr>
<td>@ sentry/react</td>
<td>25.27 KB</td>
</tr>
<tr>
<td>@ sentry/react (incl. Tracing)</td>
<td>40.91 KB</td>
</tr>
<tr>
<td>@ sentry/vue</td>
<td>27.97 KB</td>
</tr>
<tr>
<td>@ sentry/vue (incl. Tracing)</td>
<td>40.72 KB</td>
</tr>
<tr>
<td>@ sentry/svelte</td>
<td>23.62 KB</td>
</tr>
<tr>
<td>CDN Bundle</td>
<td>25.06 KB</td>
</tr>
<tr>
<td>CDN Bundle (incl. Tracing)</td>
<td>38.82 KB</td>
</tr>
<tr>
<td>CDN Bundle (incl. Tracing, Replay)</td>
<td>74.24 KB</td>
</tr>
<tr>
<td>CDN Bundle (incl. Tracing, Replay, Feedback)</td>
<td>79.55 KB</td>
</tr>
<tr>
<td>CDN Bundle - uncompressed</td>
<td>73.2 KB</td>
</tr>
<tr>
<td>CDN Bundle (incl. Tracing) - uncompressed</td>
<td>114.83 KB</td>
</tr>
<tr>
<td>CDN Bundle (incl. Tracing, Replay) - uncompressed</td>
<td>227.23 KB</td>
</tr>
<tr>
<td>CDN Bundle (incl. Tracing, Replay, Feedback) - uncompressed</td>
<td>239.53 KB</td>
</tr>
<tr>
<td>@ sentry/nextjs (client)</td>
<td>42.86 KB</td>
</tr>
<tr>
<td>@ sentry/sveltekit (client)</td>
<td>39.38 KB</td>
</tr>
<tr>
<td>@ sentry/node-core</td>
<td>46.87 KB</td>
</tr>
<tr>
<td>@ sentry/node</td>
<td>145.75 KB</td>
</tr>
<tr>
<td>@ sentry/node - without tracing</td>
<td>90.08 KB</td>
</tr>
<tr>
<td>@ sentry/aws-serverless</td>
<td>102.45 KB</td>
</tr>
</tbody>
</table>
</li>
</ul>
from <a
href="https://redirect.github.com/getsentry/sentry-javascript/releases">@sentry/profiling-node
GitHub release notes</a>
</details>
</details>
---
> [!IMPORTANT]
>
> - Check the changes in this PR to ensure they won't cause issues with
your project.
> - This PR was automatically created by Snyk using the credentials of a
real user.
> - Max score is 1000. Note that the real score may have changed since
the PR was raised.
---
**Note:** _You are seeing this because you or someone else with access
to this repository has authorized Snyk to open upgrade PRs._
**For more information:** <img
src="https://api.segment.io/v1/pixel/track?data=eyJ3cml0ZUtleSI6InJyWmxZcEdHY2RyTHZsb0lYd0dUcVg4WkFRTnNCOUEwIiwiYW5vbnltb3VzSWQiOiI2MDhkOWU5ZS04ZDBlLTQ5N2EtYTNkZS1mMTVkYzU1YmNkNTciLCJldmVudCI6IlBSIHZpZXdlZCIsInByb3BlcnRpZXMiOnsicHJJZCI6IjYwOGQ5ZTllLThkMGUtNDk3YS1hM2RlLWYxNWRjNTViY2Q1NyJ9fQ=="
width="0" height="0"/>
> - 🧐 [View latest project
report](https://app.snyk.io/org/reisene/project/55e114f8-489e-4f14-b900-20574b041e59?utm_source&#x3D;github-cloud-app&amp;utm_medium&#x3D;referral&amp;page&#x3D;upgrade-pr)
> - 📜 [Customise PR
templates](https://docs.snyk.io/scan-using-snyk/pull-requests/snyk-fix-pull-or-merge-requests/customize-pr-templates?utm_source=&utm_content=fix-pr-template)
> - 🛠 [Adjust upgrade PR
settings](https://app.snyk.io/org/reisene/project/55e114f8-489e-4f14-b900-20574b041e59/settings/integration?utm_source&#x3D;github-cloud-app&amp;utm_medium&#x3D;referral&amp;page&#x3D;upgrade-pr)
> - 🔕 [Ignore this dependency or unsubscribe from future upgrade
PRs](https://app.snyk.io/org/reisene/project/55e114f8-489e-4f14-b900-20574b041e59/settings/integration?pkg&#x3D;@sentry/profiling-node&amp;utm_source&#x3D;github-cloud-app&amp;utm_medium&#x3D;referral&amp;page&#x3D;upgrade-pr#auto-dep-upgrades)
[//]: #
'snyk:metadata:{"customTemplate":{"variablesUsed":[],"fieldsUsed":[]},"dependencies":[{"name":"@sentry/profiling-node","from":"10.8.0","to":"10.9.0"}],"env":"prod","hasFixes":true,"isBreakingChange":false,"isMajorUpgrade":false,"issuesToFix":["SNYK-JS-BRACEEXPANSION-9789073","SNYK-JS-BRACEEXPANSION-9789073"],"prId":"608d9e9e-8d0e-497a-a3de-f15dc55bcd57","prPublicId":"608d9e9e-8d0e-497a-a3de-f15dc55bcd57","packageManager":"npm","priorityScoreList":[57],"projectPublicId":"55e114f8-489e-4f14-b900-20574b041e59","projectUrl":"https://app.snyk.io/org/reisene/project/55e114f8-489e-4f14-b900-20574b041e59?utm_source=github-cloud-app&utm_medium=referral&page=upgrade-pr","prType":"upgrade","templateFieldSources":{"branchName":"default","commitMessage":"default","description":"default","title":"default"},"templateVariants":["priorityScore"],"type":"auto","upgrade":["SNYK-JS-BRACEEXPANSION-9789073","SNYK-JS-BRACEEXPANSION-9789073"],"upgradeInfo":{"versionsDiff":1,"publishedDate":"2025-09-03T12:59:52.227Z"},"vulns":["SNYK-JS-BRACEEXPANSION-9789073","SNYK-JS-BRACEEXPANSION-9789073"]}'
onurtemizkan added a commit that referenced this pull request Feb 10, 2026
…es (#19086)
This PR will resolve the core reason for the series of fixes / handling
for automatic lazy-route resolution for a while.
Related: #18898,
#18881,
#18346,
#18155,
#18098,
#17962,
#17867,
#17438,
#17277
The core issue we have been trying to tackle is not having access to the
complete route hierarchy when asynchronously loaded lazy routes are
used. React Router provides a route manifest that we can use while
matching parameterized transaction names with routes in all cases except
this lazy-routes pattern.
This problem has been discussed on React Router:
- remix-run/react-router#11113
While this has been
[addressed](remix-run/react-router#11626) for
Remix / React Router (Framework Mode), it's still not available in
Library Mode. The manifest contains the lazily-loaded route, only when
it's navigated to. While waiting for navigation, our transactions can be
dropped for several reasons, such as user behaviour like switching tabs
(`document.hidden` guard), hitting timeouts like `idleTimeout`, and
potentially other reasons. This results in incomplete transaction naming
with leftover wildcards, which caused broken aggregation on the Sentry
dashboard.
The series of attempts to fix this while keeping automatic route
discovery has been prone to race conditions and required special-case
handling of each edge case scenario, also requiring a considerable
amount of internal logic, affecting our readability and performance. At
the end, all failed in giving completely robust and deterministic
results on the customers' side.
This PR proposes a new option: `lazyRouteManifest` specifically for lazy
routes. This will let us have initial information about the route
hierarchy. So we can assign correct parameterized transaction names
without needing to wait for navigated state.
It's a static array of routes in parameterized format (needs to be
maintained by the users on route hierarchy updates) like:
```ts
Sentry.reactRouterV7BrowserTracingIntegration({
// ...
enableAsyncRouteHandlers: true
lazyRouteManifest: [
'/',
'/pricing',
'/features',
'/login',
'/signup',
'/forgot-password',
'/reset-password/:token',
'/org/:orgSlug',
'/org/:orgSlug/dashboard',
'/org/:orgSlug/projects',
'/org/:orgSlug/projects/:projectId',
'/org/:orgSlug/projects/:projectId/settings',
'/org/:orgSlug/projects/:projectId/issues',
'/org/:orgSlug/projects/:projectId/issues/:issueId',
'/org/:orgSlug/team',
'/org/:orgSlug/team/:memberId',
'/org/:orgSlug/settings',
'/org/:orgSlug/billing',
'/admin',
'/admin/users',
'/admin/users/:userId',
'/admin/orgs',
'/admin/orgs/:orgId',
],
})
```
- This will only be active when `enableAsyncRouteHandlers` is set to
`true`
- To match URLs with given routes, we mimic React Router's own
implementation.
- When this is not provided or fails, it falls back to the current
behaviour
- This manifest is primarily for lazy routes, but the users can also add
their non-lazy routes here for convenience or consistency.
- Also added E2E tests that will fail when (if at some point) React
Router manifests include the lazy routes before navigation, so we'll be
aware and plan depending on that manifest instead.
- We can do a cleanup for the race-condition / edge-case handling part
of the code in a follow-up PR.
Closes#19090 (added automatically)
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.

3 participants

@onurtemizkan@chargome
, '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

fix(react): Avoid multiple name updates on navigation spans - #17438

Merged
chargome merged 16 commits into
developfrom
onur/react-router-multiple-name-updates
Aug 27, 2025
Merged

fix(react): Avoid multiple name updates on navigation spans#17438
chargome merged 16 commits into
developfrom
onur/react-router-multiple-name-updates

Conversation

@onurtemizkan

@onurtemizkanonurtemizkan commented Aug 21, 2025

Copy link
Copy Markdown
Contributor

This patch prevents name updates on navigation spans from being applied more than once.

This was fine and allowed for cross-usage of different instrumentation ways (such as instrumenting useRoutes and createBrowserRouter together), and didn't create any issues. But after adding support for lazy routes, it led to incorrect transaction names, especially when there's a navigation between two lazily-loaded routes.

While on it, I also had to do some refactoring to keep the code readable and maintainable, so now reactrouterv6-compat-utils is separated into 3 source files (instrumentation, common utils, and lazy routes specific functionality).

@onurtemizkan
onurtemizkanforce-pushed the onur/react-router-multiple-name-updates branch 4 times, most recently from aea2217 to 57c8b22CompareAugust 22, 2025 13:13
@github-actions

github-actionsBot commented Aug 22, 2025

Copy link
Copy Markdown
Contributor

size-limit report 📦

PathSize% ChangeChange
@sentry/browser24.16 kB--
@sentry/browser - with treeshaking flags22.73 kB--
@sentry/browser (incl. Tracing)39.87 kB--
@sentry/browser (incl. Tracing, Replay)78.23 kB--
@sentry/browser (incl. Tracing, Replay) - with treeshaking flags68.02 kB--
@sentry/browser (incl. Tracing, Replay with Canvas)82.91 kB--
@sentry/browser (incl. Tracing, Replay, Feedback)95.03 kB--
@sentry/browser (incl. Feedback)40.83 kB--
@sentry/browser (incl. sendFeedback)28.81 kB--
@sentry/browser (incl. FeedbackAsync)33.7 kB--
@sentry/react25.88 kB--
@sentry/react (incl. Tracing)41.89 kB+0.06%+23 B 🔺
@sentry/vue28.64 kB--
@sentry/vue (incl. Tracing)41.69 kB--
@sentry/svelte24.18 kB--
CDN Bundle25.66 kB--
CDN Bundle (incl. Tracing)39.75 kB--
CDN Bundle (incl. Tracing, Replay)76.03 kB--
CDN Bundle (incl. Tracing, Replay, Feedback)81.46 kB--
CDN Bundle - uncompressed74.96 kB--
CDN Bundle (incl. Tracing) - uncompressed117.59 kB--
CDN Bundle (incl. Tracing, Replay) - uncompressed232.68 kB--
CDN Bundle (incl. Tracing, Replay, Feedback) - uncompressed245.28 kB--
@sentry/nextjs (client)43.89 kB--
@sentry/sveltekit (client)40.32 kB--
@sentry/node-core47.99 kB-0.01%-1 B 🔽
@sentry/node149.25 kB--
@sentry/node - without tracing92.24 kB--
@sentry/aws-serverless104.91 kB+0.01%+1 B 🔺

View base workflow run

@onurtemizkan
onurtemizkanforce-pushed the onur/react-router-multiple-name-updates branch 4 times, most recently from 0e679dc to 27c5da6CompareAugust 27, 2025 00:18
@onurtemizkan
onurtemizkanforce-pushed the onur/react-router-multiple-name-updates branch from 8da7c27 to 453f5c6CompareAugust 27, 2025 07:29
@onurtemizkan
onurtemizkan marked this pull request as ready for review August 27, 2025 07:29
cursor[bot]

This comment was marked as outdated.

@onurtemizkan
onurtemizkanforce-pushed the onur/react-router-multiple-name-updates branch from 1d2839b to 8507984CompareAugust 27, 2025 08:16

CopilotAI 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.

Pull Request Overview

This PR refactors the React Router v6/v7 compatibility utilities to prevent multiple navigation span name updates and fix incorrect transaction names for lazy routes.

  • Refactors the reactrouterv6-compat-utils module into three separate files for better organization
  • Implements tracking to prevent duplicate navigation span name updates during navigation
  • Fixes transaction naming issues that occurred when navigating between lazy routes

Reviewed Changes

Copilot reviewed 16 out of 16 changed files in this pull request and generated 4 comments.

Show a summary per file
FileDescription
packages/react/test/reactrouterv6-compat-utils.test.tsxRemoves entire test file as functionality moved to new modules
packages/react/test/reactrouter-cross-usage.test.tsxRemoves assertions expecting multiple updateName calls since they're now prevented
packages/react/test/reactrouter-compat-utils/utils.test.tsAdds comprehensive tests for utility functions moved from old module
packages/react/test/reactrouter-compat-utils/lazy-routes.test.tsAdds tests for lazy route handling functionality
packages/react/test/reactrouter-compat-utils/instrumentation.test.tsxAdds tests for instrumentation-specific functionality
packages/react/src/reactrouterv7.tsxUpdates import path to new module structure
packages/react/src/reactrouterv6.tsxUpdates import path to new module structure
packages/react/src/reactrouter-compat-utils/utils.tsNew utility functions module with core router utilities
packages/react/src/reactrouter-compat-utils/lazy-routes.tsxNew module for lazy route handling functionality
packages/react/src/reactrouter-compat-utils/instrumentation.tsxNew main instrumentation module with navigation span tracking
packages/react/src/reactrouter-compat-utils/index.tsNew index file exporting all functionality from sub-modules
dev-packages/e2e-tests/test-applications/react-router-7-lazy-routes/tests/transactions.test.tsAdds tests for navigation between lazy routes
dev-packages/e2e-tests/test-applications/react-router-7-lazy-routes/src/pages/InnerLazyRoutes.tsxAdds navigation link to another lazy route
dev-packages/e2e-tests/test-applications/react-router-7-lazy-routes/src/pages/Index.tsxAdds navigation links to lazy routes
dev-packages/e2e-tests/test-applications/react-router-7-lazy-routes/src/pages/AnotherLazyRoutes.tsxAdds new lazy route component with navigation links
dev-packages/e2e-tests/test-applications/react-router-7-lazy-routes/src/index.tsxAdds another lazy route configuration

Tip: Customize your code reviews with copilot-instructions.md. Create the file or learn how to get started.

Comment threadpackages/react/src/reactrouter-compat-utils/instrumentation.tsx Outdated
Comment threadpackages/react/src/reactrouter-compat-utils/instrumentation.tsx Outdated
Comment threadpackages/react/src/reactrouter-compat-utils/utils.ts Outdated
@onurtemizkan
onurtemizkanforce-pushed the onur/react-router-multiple-name-updates branch from 1431408 to 60a9d7cCompareAugust 27, 2025 09:34

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

Phew big change – Did not review all the tests in detail but looks good 🚀

Comment threadpackages/react/src/reactrouter-compat-utils/instrumentation.tsx Outdated
Comment threadpackages/react/src/reactrouter-compat-utils/lazy-routes.tsx Outdated
Comment threadpackages/react/src/reactrouter-compat-utils/index.ts
@chargomechargome self-assigned this Aug 27, 2025
@chargome

Copy link
Copy Markdown
Member

@onurtemizkan Added some minor things myself so I can release that tomorrow, thanks for the refactor!

@chargome
chargome merged commit 895b385 into developAug 27, 2025
319 of 323 checks passed
@chargome
chargome deleted the onur/react-router-multiple-name-updates branch August 27, 2025 20:35
s1gr1d added a commit that referenced this pull request Sep 9, 2025
Removes recently introduced special-casing lazy-route -> lazy-route
transaction name updates.
This completes the fix in #17438.
E2E tests are updated to replicate a similar case in the reproduction
here: #17417
Also manually tested on the reproduction.
---------
Co-authored-by: Sigrid Huemer <32902192+s1gr1d@users.noreply.github.com>
mergifyBot added a commit to reisene/HulajDusza-serwis that referenced this pull request Sep 29, 2025
![snyk-io[bot]](https://badgen.net/badge/icon/snyk-io%5Bbot%5D/green?label=)
![Contributor](https://badgen.net/badge/icon/Contributor/000000?label=)
[<img width="16" alt="Powered by Pull Request Badge"
src="https://user-images.githubusercontent.com/1393946/111216524-d2bb8e00-85d4-11eb-821b-ed4c00989c02.png">](https://pullrequestbadge.com/?utm_medium=github&utm_source=reisene&utm_campaign=badge_info)<!--
PR-BADGE: PLEASE DO NOT REMOVE THIS COMMENT -->
![snyk-top-banner](https://res.cloudinary.com/snyk/image/upload/r-d/scm-platform/snyk-pull-requests/pr-banner-default.svg)
<h3>Snyk has created this PR to upgrade @sentry/profiling-node from
10.8.0 to 10.9.0.</h3>
:information_source: Keep your dependencies up-to-date. This makes it
easier to fix existing vulnerabilities and to more quickly identify and
fix newly disclosed vulnerabilities when they affect your project.
<hr/>
- The recommended version is **1 version** ahead of your current
version.
- The recommended version was released **22 days ago**.
#### Issues fixed by the recommended upgrade:
| | Issue | Score | Exploit Maturity |
:-------------------------:|:-------------------------|:-------------------------|:-------------------------
![low
severity](https://res.cloudinary.com/snyk/image/upload/r-d/scm-platform/snyk-pull-requests//severity-low.svg
'low severity') | Regular Expression Denial of Service
(ReDoS)<br/>[SNYK-JS-BRACEEXPANSION-9789073](https://snyk.io/vuln/SNYK-JS-BRACEEXPANSION-9789073)
| **57** | Proof of Concept
![low
severity](https://res.cloudinary.com/snyk/image/upload/r-d/scm-platform/snyk-pull-requests//severity-low.svg
'low severity') | Regular Expression Denial of Service
(ReDoS)<br/>[SNYK-JS-BRACEEXPANSION-9789073](https://snyk.io/vuln/SNYK-JS-BRACEEXPANSION-9789073)
| **57** | Proof of Concept
<details>
<summary><b>Release notes</b></summary>
<br/>
<details>
<summary>Package name: <b>@sentry/profiling-node</b></summary>
<ul>
<li>
<b>10.9.0</b> - <a
href="https://redirect.github.com/getsentry/sentry-javascript/releases/tag/10.9.0">2025-09-03</a></br><h3>Important
Changes</h3>
<ul>
<li><strong>feat(node): Update <code>httpIntegration</code> handling of
incoming requests (<a
href="https://redirect.github.com/getsentry/sentry-javascript/pull/17371"
data-hovercard-type="pull_request"
data-hovercard-url="/getsentry/sentry-javascript/pull/17371/hovercard">#17371</a>)</strong></li>
</ul>
<p>This version updates the handling of the Node SDK of incoming
requests. Instead of relying on @ opentelemetry/instrumentation-http, we
now handle incoming request instrumentation internally, ensuring that we
can optimize performance as much as possible and avoid interop
problems.</p>
<p>This change should not affect you, unless you're relying on very
in-depth implementation details. Importantly, this also drops the
<code>_experimentalConfig</code> option of the integration - this will
no longer do anything.<br>
Finally, you can still pass
<code>instrumentation.{requestHook,responseHook,applyCustomAttributesOnSpan}</code>
options, but they are deprecated and will be removed in v11. Instead,
you can use the new <code>incomingRequestSpanHook</code> configuration
option if you want to adjust the incoming request span.</p>
<h3>Other Changes</h3>
<ul>
<li>feat(browser): Add replay.feedback CDN bundle (<a
href="https://redirect.github.com/getsentry/sentry-javascript/pull/17496"
data-hovercard-type="pull_request"
data-hovercard-url="/getsentry/sentry-javascript/pull/17496/hovercard">#17496</a>)</li>
<li>feat(browser): Export <code>sendFeedback</code> from CDN bundles (<a
href="https://redirect.github.com/getsentry/sentry-javascript/pull/17495"
data-hovercard-type="pull_request"
data-hovercard-url="/getsentry/sentry-javascript/pull/17495/hovercard">#17495</a>)</li>
<li>fix(astro): Ensure span name from <code>beforeStartSpan</code> isn't
overwritten (<a
href="https://redirect.github.com/getsentry/sentry-javascript/pull/17500"
data-hovercard-type="pull_request"
data-hovercard-url="/getsentry/sentry-javascript/pull/17500/hovercard">#17500</a>)</li>
<li>fix(browser): Ensure source is set correctly when updating span name
in-place in <code>beforeStartSpan</code> (<a
href="https://redirect.github.com/getsentry/sentry-javascript/pull/17501"
data-hovercard-type="pull_request"
data-hovercard-url="/getsentry/sentry-javascript/pull/17501/hovercard">#17501</a>)</li>
<li>fix(core): Only set template attributes on logs if parameters exist
(<a
href="https://redirect.github.com/getsentry/sentry-javascript/pull/17480"
data-hovercard-type="pull_request"
data-hovercard-url="/getsentry/sentry-javascript/pull/17480/hovercard">#17480</a>)</li>
<li>fix(nextjs): Fix parameterization for root catchall routes (<a
href="https://redirect.github.com/getsentry/sentry-javascript/pull/17489"
data-hovercard-type="pull_request"
data-hovercard-url="/getsentry/sentry-javascript/pull/17489/hovercard">#17489</a>)</li>
<li>fix(node-core): Shut down OTel TraceProvider when calling
<code>Sentry.close()</code> (<a
href="https://redirect.github.com/getsentry/sentry-javascript/pull/17499"
data-hovercard-type="pull_request"
data-hovercard-url="/getsentry/sentry-javascript/pull/17499/hovercard">#17499</a>)</li>
</ul>
<details>
<summary> <strong>Internal Changes</strong> </summary>
<ul>
<li>chore: Add <code>changelog</code> script back to package.json (<a
href="https://redirect.github.com/getsentry/sentry-javascript/pull/17517"
data-hovercard-type="pull_request"
data-hovercard-url="/getsentry/sentry-javascript/pull/17517/hovercard">#17517</a>)</li>
<li>chore: Ensure prettier is run on all files (<a
href="https://redirect.github.com/getsentry/sentry-javascript/pull/17497"
data-hovercard-type="pull_request"
data-hovercard-url="/getsentry/sentry-javascript/pull/17497/hovercard">#17497</a>)</li>
<li>chore: Ignore prettier commit for git blame (<a
href="https://redirect.github.com/getsentry/sentry-javascript/pull/17498"
data-hovercard-type="pull_request"
data-hovercard-url="/getsentry/sentry-javascript/pull/17498/hovercard">#17498</a>)</li>
<li>chore: Remove experimental from Nuxt SDK package description (<a
href="https://redirect.github.com/getsentry/sentry-javascript/pull/17483"
data-hovercard-type="pull_request"
data-hovercard-url="/getsentry/sentry-javascript/pull/17483/hovercard">#17483</a>)</li>
<li>ci: Capture overhead in node app (<a
href="https://redirect.github.com/getsentry/sentry-javascript/pull/17420"
data-hovercard-type="pull_request"
data-hovercard-url="/getsentry/sentry-javascript/pull/17420/hovercard">#17420</a>)</li>
<li>ci: Ensure we fail on cancelled jobs (<a
href="https://redirect.github.com/getsentry/sentry-javascript/pull/17506"
data-hovercard-type="pull_request"
data-hovercard-url="/getsentry/sentry-javascript/pull/17506/hovercard">#17506</a>)</li>
<li>ci(deps): bump actions/checkout from 4 to 5 (<a
href="https://redirect.github.com/getsentry/sentry-javascript/pull/17505"
data-hovercard-type="pull_request"
data-hovercard-url="/getsentry/sentry-javascript/pull/17505/hovercard">#17505</a>)</li>
<li>ci(deps): bump actions/create-github-app-token from 2.0.6 to 2.1.1
(<a
href="https://redirect.github.com/getsentry/sentry-javascript/pull/17504"
data-hovercard-type="pull_request"
data-hovercard-url="/getsentry/sentry-javascript/pull/17504/hovercard">#17504</a>)</li>
<li>test(aws): Improve reliability on CI (<a
href="https://redirect.github.com/getsentry/sentry-javascript/pull/17502"
data-hovercard-type="pull_request"
data-hovercard-url="/getsentry/sentry-javascript/pull/17502/hovercard">#17502</a>)</li>
</ul>
</details>
<h2>Bundle size 📦</h2>
<table>
<thead>
<tr>
<th>Path</th>
<th>Size</th>
</tr>
</thead>
<tbody>
<tr>
<td>@ sentry/browser</td>
<td>23.59 KB</td>
</tr>
<tr>
<td>@ sentry/browser - with treeshaking flags</td>
<td>22.2 KB</td>
</tr>
<tr>
<td>@ sentry/browser (incl. Tracing)</td>
<td>38.93 KB</td>
</tr>
<tr>
<td>@ sentry/browser (incl. Tracing, Replay)</td>
<td>76.4 KB</td>
</tr>
<tr>
<td>@ sentry/browser (incl. Tracing, Replay) - with treeshaking
flags</td>
<td>66.43 KB</td>
</tr>
<tr>
<td>@ sentry/browser (incl. Tracing, Replay with Canvas)</td>
<td>80.97 KB</td>
</tr>
<tr>
<td>@ sentry/browser (incl. Tracing, Replay, Feedback)</td>
<td>92.81 KB</td>
</tr>
<tr>
<td>@ sentry/browser (incl. Feedback)</td>
<td>39.88 KB</td>
</tr>
<tr>
<td>@ sentry/browser (incl. sendFeedback)</td>
<td>28.13 KB</td>
</tr>
<tr>
<td>@ sentry/browser (incl. FeedbackAsync)</td>
<td>32.92 KB</td>
</tr>
<tr>
<td>@ sentry/react</td>
<td>25.27 KB</td>
</tr>
<tr>
<td>@ sentry/react (incl. Tracing)</td>
<td>40.91 KB</td>
</tr>
<tr>
<td>@ sentry/vue</td>
<td>27.97 KB</td>
</tr>
<tr>
<td>@ sentry/vue (incl. Tracing)</td>
<td>40.72 KB</td>
</tr>
<tr>
<td>@ sentry/svelte</td>
<td>23.62 KB</td>
</tr>
<tr>
<td>CDN Bundle</td>
<td>25.06 KB</td>
</tr>
<tr>
<td>CDN Bundle (incl. Tracing)</td>
<td>38.82 KB</td>
</tr>
<tr>
<td>CDN Bundle (incl. Tracing, Replay)</td>
<td>74.25 KB</td>
</tr>
<tr>
<td>CDN Bundle (incl. Tracing, Replay, Feedback)</td>
<td>79.56 KB</td>
</tr>
<tr>
<td>CDN Bundle - uncompressed</td>
<td>73.2 KB</td>
</tr>
<tr>
<td>CDN Bundle (incl. Tracing) - uncompressed</td>
<td>114.83 KB</td>
</tr>
<tr>
<td>CDN Bundle (incl. Tracing, Replay) - uncompressed</td>
<td>227.23 KB</td>
</tr>
<tr>
<td>CDN Bundle (incl. Tracing, Replay, Feedback) - uncompressed</td>
<td>239.56 KB</td>
</tr>
<tr>
<td>@ sentry/nextjs (client)</td>
<td>42.86 KB</td>
</tr>
<tr>
<td>@ sentry/sveltekit (client)</td>
<td>39.38 KB</td>
</tr>
<tr>
<td>@ sentry/node-core</td>
<td>48.45 KB</td>
</tr>
<tr>
<td>@ sentry/node</td>
<td>146.74 KB</td>
</tr>
<tr>
<td>@ sentry/node - without tracing</td>
<td>90.02 KB</td>
</tr>
<tr>
<td>@ sentry/aws-serverless</td>
<td>103.01 KB</td>
</tr>
</tbody>
</table>
</li>
<li>
<b>10.8.0</b> - <a
href="https://redirect.github.com/getsentry/sentry-javascript/releases/tag/10.8.0">2025-08-29</a></br><h3>Important
Changes</h3>
<ul>
<li>
<p><strong>feat(sveltekit): Add Compatibility for builtin SvelteKit
Tracing (<a
href="https://redirect.github.com/getsentry/sentry-javascript/pull/17423"
data-hovercard-type="pull_request"
data-hovercard-url="/getsentry/sentry-javascript/pull/17423/hovercard">#17423</a>)</strong></p>
<p>This release makes the <code>@ sentry/sveltekit</code> SDK compatible
with SvelteKit's native <a
href="https://svelte.dev/docs/kit/observability"
rel="nofollow">observability support</a> introduced in SvelteKit version
<code>2.31.0</code>.<br>
If you enable both, instrumentation and tracing, the SDK will now
initialize early enough to set up additional instrumentation like
database queries and it will pick up spans emitted from SvelteKit.</p>
<p>We will follow up with docs how to set up the SDK soon.<br>
For now, If you're on SvelteKit version <code>2.31.0</code> or newer,
you can easily opt into the new feature:</p>
<ol>
<li>
<p>Enable <a href="https://svelte.dev/docs/kit/observability"
rel="nofollow">experimental tracing and instrumentation support</a> in
<code>svelte.config.js</code>:</p>
</li>
<li>
<p>Move your <code>Sentry.init()</code> call from
<code>src/hooks.server.(js|ts)</code> to the new
<code>instrumentation.server.(js|ts)</code> file:</p>
<div class="highlight highlight-source-ts notranslate position-relative
overflow-auto" data-snippet-clipboard-copy-content="//
instrumentation.server.ts
import * as Sentry from '@ sentry/sveltekit';
Sentry.init({
dsn: '...',
// rest of your config
});"><pre><span class="pl-c">// instrumentation.server.ts</span>
<span class="pl-k">import</span> <span class="pl-c1">*</span> <span
class="pl-k">as</span> <span class="pl-v">Sentry</span> <span
class="pl-k">from</span> <span class="pl-s">'@
sentry/sveltekit'</span><span class="pl-kos">;</span>
<span class="pl-v">Sentry</span><span class="pl-kos">.</span><span
class="pl-en">init</span><span class="pl-kos">(</span><span
class="pl-kos">{</span>
<span class="pl-c1">dsn</span>: <span class="pl-s">'...'</span><span
class="pl-kos">,</span>
<span class="pl-c">// rest of your config</span>
<span class="pl-kos">}</span><span class="pl-kos">)</span><span
class="pl-kos">;</span></pre></div>
<p>The rest of your Sentry config in <code>hooks.server.ts</code>
(<code>sentryHandle</code> and <code>handleErrorWithSentry</code>)
should stay the same.</p>
</li>
</ol>
<p>If you prefer to stay on the hooks-file based config for now, the SDK
will continue to work as previously.</p>
<p>Thanks to the Svelte team and <a class="user-mention notranslate"
data-hovercard-type="user"
data-hovercard-url="/users/elliott-with-the-longest-name-on-github/hovercard"
data-octo-click="hovercard-link-click"
data-octo-dimensions="link_type:self"
href="https://redirect.github.com/elliott-with-the-longest-name-on-github">@
elliott-with-the-longest-name-on-github</a> for implementing
observability support and for reviewing our PR!</p>
</li>
</ul>
<h3>Other Changes</h3>
<ul>
<li>fix(react): Avoid multiple name updates on navigation spans (<a
href="https://redirect.github.com/getsentry/sentry-javascript/pull/17438"
data-hovercard-type="pull_request"
data-hovercard-url="/getsentry/sentry-javascript/pull/17438/hovercard">#17438</a>)</li>
</ul>
<details>
<summary> <strong>Internal Changes</strong> </summary>
<ul>
<li>test(profiling): Add tests for current state of profiling (<a
href="https://redirect.github.com/getsentry/sentry-javascript/pull/17470"
data-hovercard-type="pull_request"
data-hovercard-url="/getsentry/sentry-javascript/pull/17470/hovercard">#17470</a>)</li>
</ul>
</details>
<h2>Bundle size 📦</h2>
<table>
<thead>
<tr>
<th>Path</th>
<th>Size</th>
</tr>
</thead>
<tbody>
<tr>
<td>@ sentry/browser</td>
<td>23.59 KB</td>
</tr>
<tr>
<td>@ sentry/browser - with treeshaking flags</td>
<td>22.2 KB</td>
</tr>
<tr>
<td>@ sentry/browser (incl. Tracing)</td>
<td>38.94 KB</td>
</tr>
<tr>
<td>@ sentry/browser (incl. Tracing, Replay)</td>
<td>76.4 KB</td>
</tr>
<tr>
<td>@ sentry/browser (incl. Tracing, Replay) - with treeshaking
flags</td>
<td>66.43 KB</td>
</tr>
<tr>
<td>@ sentry/browser (incl. Tracing, Replay with Canvas)</td>
<td>80.97 KB</td>
</tr>
<tr>
<td>@ sentry/browser (incl. Tracing, Replay, Feedback)</td>
<td>92.8 KB</td>
</tr>
<tr>
<td>@ sentry/browser (incl. Feedback)</td>
<td>39.88 KB</td>
</tr>
<tr>
<td>@ sentry/browser (incl. sendFeedback)</td>
<td>28.13 KB</td>
</tr>
<tr>
<td>@ sentry/browser (incl. FeedbackAsync)</td>
<td>32.92 KB</td>
</tr>
<tr>
<td>@ sentry/react</td>
<td>25.27 KB</td>
</tr>
<tr>
<td>@ sentry/react (incl. Tracing)</td>
<td>40.91 KB</td>
</tr>
<tr>
<td>@ sentry/vue</td>
<td>27.97 KB</td>
</tr>
<tr>
<td>@ sentry/vue (incl. Tracing)</td>
<td>40.72 KB</td>
</tr>
<tr>
<td>@ sentry/svelte</td>
<td>23.62 KB</td>
</tr>
<tr>
<td>CDN Bundle</td>
<td>25.06 KB</td>
</tr>
<tr>
<td>CDN Bundle (incl. Tracing)</td>
<td>38.82 KB</td>
</tr>
<tr>
<td>CDN Bundle (incl. Tracing, Replay)</td>
<td>74.24 KB</td>
</tr>
<tr>
<td>CDN Bundle (incl. Tracing, Replay, Feedback)</td>
<td>79.55 KB</td>
</tr>
<tr>
<td>CDN Bundle - uncompressed</td>
<td>73.2 KB</td>
</tr>
<tr>
<td>CDN Bundle (incl. Tracing) - uncompressed</td>
<td>114.83 KB</td>
</tr>
<tr>
<td>CDN Bundle (incl. Tracing, Replay) - uncompressed</td>
<td>227.23 KB</td>
</tr>
<tr>
<td>CDN Bundle (incl. Tracing, Replay, Feedback) - uncompressed</td>
<td>239.53 KB</td>
</tr>
<tr>
<td>@ sentry/nextjs (client)</td>
<td>42.86 KB</td>
</tr>
<tr>
<td>@ sentry/sveltekit (client)</td>
<td>39.38 KB</td>
</tr>
<tr>
<td>@ sentry/node-core</td>
<td>46.87 KB</td>
</tr>
<tr>
<td>@ sentry/node</td>
<td>145.75 KB</td>
</tr>
<tr>
<td>@ sentry/node - without tracing</td>
<td>90.08 KB</td>
</tr>
<tr>
<td>@ sentry/aws-serverless</td>
<td>102.45 KB</td>
</tr>
</tbody>
</table>
</li>
</ul>
from <a
href="https://redirect.github.com/getsentry/sentry-javascript/releases">@sentry/profiling-node
GitHub release notes</a>
</details>
</details>
---
> [!IMPORTANT]
>
> - Check the changes in this PR to ensure they won't cause issues with
your project.
> - This PR was automatically created by Snyk using the credentials of a
real user.
> - Max score is 1000. Note that the real score may have changed since
the PR was raised.
---
**Note:** _You are seeing this because you or someone else with access
to this repository has authorized Snyk to open upgrade PRs._
**For more information:** <img
src="https://api.segment.io/v1/pixel/track?data=eyJ3cml0ZUtleSI6InJyWmxZcEdHY2RyTHZsb0lYd0dUcVg4WkFRTnNCOUEwIiwiYW5vbnltb3VzSWQiOiI2MDhkOWU5ZS04ZDBlLTQ5N2EtYTNkZS1mMTVkYzU1YmNkNTciLCJldmVudCI6IlBSIHZpZXdlZCIsInByb3BlcnRpZXMiOnsicHJJZCI6IjYwOGQ5ZTllLThkMGUtNDk3YS1hM2RlLWYxNWRjNTViY2Q1NyJ9fQ=="
width="0" height="0"/>
> - 🧐 [View latest project
report](https://app.snyk.io/org/reisene/project/55e114f8-489e-4f14-b900-20574b041e59?utm_source&#x3D;github-cloud-app&amp;utm_medium&#x3D;referral&amp;page&#x3D;upgrade-pr)
> - 📜 [Customise PR
templates](https://docs.snyk.io/scan-using-snyk/pull-requests/snyk-fix-pull-or-merge-requests/customize-pr-templates?utm_source=&utm_content=fix-pr-template)
> - 🛠 [Adjust upgrade PR
settings](https://app.snyk.io/org/reisene/project/55e114f8-489e-4f14-b900-20574b041e59/settings/integration?utm_source&#x3D;github-cloud-app&amp;utm_medium&#x3D;referral&amp;page&#x3D;upgrade-pr)
> - 🔕 [Ignore this dependency or unsubscribe from future upgrade
PRs](https://app.snyk.io/org/reisene/project/55e114f8-489e-4f14-b900-20574b041e59/settings/integration?pkg&#x3D;@sentry/profiling-node&amp;utm_source&#x3D;github-cloud-app&amp;utm_medium&#x3D;referral&amp;page&#x3D;upgrade-pr#auto-dep-upgrades)
[//]: #
'snyk:metadata:{"customTemplate":{"variablesUsed":[],"fieldsUsed":[]},"dependencies":[{"name":"@sentry/profiling-node","from":"10.8.0","to":"10.9.0"}],"env":"prod","hasFixes":true,"isBreakingChange":false,"isMajorUpgrade":false,"issuesToFix":["SNYK-JS-BRACEEXPANSION-9789073","SNYK-JS-BRACEEXPANSION-9789073"],"prId":"608d9e9e-8d0e-497a-a3de-f15dc55bcd57","prPublicId":"608d9e9e-8d0e-497a-a3de-f15dc55bcd57","packageManager":"npm","priorityScoreList":[57],"projectPublicId":"55e114f8-489e-4f14-b900-20574b041e59","projectUrl":"https://app.snyk.io/org/reisene/project/55e114f8-489e-4f14-b900-20574b041e59?utm_source=github-cloud-app&utm_medium=referral&page=upgrade-pr","prType":"upgrade","templateFieldSources":{"branchName":"default","commitMessage":"default","description":"default","title":"default"},"templateVariants":["priorityScore"],"type":"auto","upgrade":["SNYK-JS-BRACEEXPANSION-9789073","SNYK-JS-BRACEEXPANSION-9789073"],"upgradeInfo":{"versionsDiff":1,"publishedDate":"2025-09-03T12:59:52.227Z"},"vulns":["SNYK-JS-BRACEEXPANSION-9789073","SNYK-JS-BRACEEXPANSION-9789073"]}'
onurtemizkan added a commit that referenced this pull request Feb 10, 2026
…es (#19086)
This PR will resolve the core reason for the series of fixes / handling
for automatic lazy-route resolution for a while.
Related: #18898,
#18881,
#18346,
#18155,
#18098,
#17962,
#17867,
#17438,
#17277
The core issue we have been trying to tackle is not having access to the
complete route hierarchy when asynchronously loaded lazy routes are
used. React Router provides a route manifest that we can use while
matching parameterized transaction names with routes in all cases except
this lazy-routes pattern.
This problem has been discussed on React Router:
- remix-run/react-router#11113
While this has been
[addressed](remix-run/react-router#11626) for
Remix / React Router (Framework Mode), it's still not available in
Library Mode. The manifest contains the lazily-loaded route, only when
it's navigated to. While waiting for navigation, our transactions can be
dropped for several reasons, such as user behaviour like switching tabs
(`document.hidden` guard), hitting timeouts like `idleTimeout`, and
potentially other reasons. This results in incomplete transaction naming
with leftover wildcards, which caused broken aggregation on the Sentry
dashboard.
The series of attempts to fix this while keeping automatic route
discovery has been prone to race conditions and required special-case
handling of each edge case scenario, also requiring a considerable
amount of internal logic, affecting our readability and performance. At
the end, all failed in giving completely robust and deterministic
results on the customers' side.
This PR proposes a new option: `lazyRouteManifest` specifically for lazy
routes. This will let us have initial information about the route
hierarchy. So we can assign correct parameterized transaction names
without needing to wait for navigated state.
It's a static array of routes in parameterized format (needs to be
maintained by the users on route hierarchy updates) like:
```ts
Sentry.reactRouterV7BrowserTracingIntegration({
// ...
enableAsyncRouteHandlers: true
lazyRouteManifest: [
'/',
'/pricing',
'/features',
'/login',
'/signup',
'/forgot-password',
'/reset-password/:token',
'/org/:orgSlug',
'/org/:orgSlug/dashboard',
'/org/:orgSlug/projects',
'/org/:orgSlug/projects/:projectId',
'/org/:orgSlug/projects/:projectId/settings',
'/org/:orgSlug/projects/:projectId/issues',
'/org/:orgSlug/projects/:projectId/issues/:issueId',
'/org/:orgSlug/team',
'/org/:orgSlug/team/:memberId',
'/org/:orgSlug/settings',
'/org/:orgSlug/billing',
'/admin',
'/admin/users',
'/admin/users/:userId',
'/admin/orgs',
'/admin/orgs/:orgId',
],
})
```
- This will only be active when `enableAsyncRouteHandlers` is set to
`true`
- To match URLs with given routes, we mimic React Router's own
implementation.
- When this is not provided or fails, it falls back to the current
behaviour
- This manifest is primarily for lazy routes, but the users can also add
their non-lazy routes here for convenience or consistency.
- Also added E2E tests that will fail when (if at some point) React
Router manifests include the lazy routes before navigation, so we'll be
aware and plan depending on that manifest instead.
- We can do a cleanup for the race-condition / edge-case handling part
of the code in a follow-up PR.
Closes#19090 (added automatically)
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.

3 participants

@onurtemizkan@chargome
, '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

fix(react): Avoid multiple name updates on navigation spans - #17438

Merged
chargome merged 16 commits into
developfrom
onur/react-router-multiple-name-updates
Aug 27, 2025
Merged

fix(react): Avoid multiple name updates on navigation spans#17438
chargome merged 16 commits into
developfrom
onur/react-router-multiple-name-updates

Conversation

@onurtemizkan

@onurtemizkanonurtemizkan commented Aug 21, 2025

Copy link
Copy Markdown
Contributor

This patch prevents name updates on navigation spans from being applied more than once.

This was fine and allowed for cross-usage of different instrumentation ways (such as instrumenting useRoutes and createBrowserRouter together), and didn't create any issues. But after adding support for lazy routes, it led to incorrect transaction names, especially when there's a navigation between two lazily-loaded routes.

While on it, I also had to do some refactoring to keep the code readable and maintainable, so now reactrouterv6-compat-utils is separated into 3 source files (instrumentation, common utils, and lazy routes specific functionality).

@onurtemizkan
onurtemizkanforce-pushed the onur/react-router-multiple-name-updates branch 4 times, most recently from aea2217 to 57c8b22CompareAugust 22, 2025 13:13
@github-actions

github-actionsBot commented Aug 22, 2025

Copy link
Copy Markdown
Contributor

size-limit report 📦

PathSize% ChangeChange
@sentry/browser24.16 kB--
@sentry/browser - with treeshaking flags22.73 kB--
@sentry/browser (incl. Tracing)39.87 kB--
@sentry/browser (incl. Tracing, Replay)78.23 kB--
@sentry/browser (incl. Tracing, Replay) - with treeshaking flags68.02 kB--
@sentry/browser (incl. Tracing, Replay with Canvas)82.91 kB--
@sentry/browser (incl. Tracing, Replay, Feedback)95.03 kB--
@sentry/browser (incl. Feedback)40.83 kB--
@sentry/browser (incl. sendFeedback)28.81 kB--
@sentry/browser (incl. FeedbackAsync)33.7 kB--
@sentry/react25.88 kB--
@sentry/react (incl. Tracing)41.89 kB+0.06%+23 B 🔺
@sentry/vue28.64 kB--
@sentry/vue (incl. Tracing)41.69 kB--
@sentry/svelte24.18 kB--
CDN Bundle25.66 kB--
CDN Bundle (incl. Tracing)39.75 kB--
CDN Bundle (incl. Tracing, Replay)76.03 kB--
CDN Bundle (incl. Tracing, Replay, Feedback)81.46 kB--
CDN Bundle - uncompressed74.96 kB--
CDN Bundle (incl. Tracing) - uncompressed117.59 kB--
CDN Bundle (incl. Tracing, Replay) - uncompressed232.68 kB--
CDN Bundle (incl. Tracing, Replay, Feedback) - uncompressed245.28 kB--
@sentry/nextjs (client)43.89 kB--
@sentry/sveltekit (client)40.32 kB--
@sentry/node-core47.99 kB-0.01%-1 B 🔽
@sentry/node149.25 kB--
@sentry/node - without tracing92.24 kB--
@sentry/aws-serverless104.91 kB+0.01%+1 B 🔺

View base workflow run

@onurtemizkan
onurtemizkanforce-pushed the onur/react-router-multiple-name-updates branch 4 times, most recently from 0e679dc to 27c5da6CompareAugust 27, 2025 00:18
@onurtemizkan
onurtemizkanforce-pushed the onur/react-router-multiple-name-updates branch from 8da7c27 to 453f5c6CompareAugust 27, 2025 07:29
@onurtemizkan
onurtemizkan marked this pull request as ready for review August 27, 2025 07:29
cursor[bot]

This comment was marked as outdated.

@onurtemizkan
onurtemizkanforce-pushed the onur/react-router-multiple-name-updates branch from 1d2839b to 8507984CompareAugust 27, 2025 08:16

CopilotAI 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.

Pull Request Overview

This PR refactors the React Router v6/v7 compatibility utilities to prevent multiple navigation span name updates and fix incorrect transaction names for lazy routes.

  • Refactors the reactrouterv6-compat-utils module into three separate files for better organization
  • Implements tracking to prevent duplicate navigation span name updates during navigation
  • Fixes transaction naming issues that occurred when navigating between lazy routes

Reviewed Changes

Copilot reviewed 16 out of 16 changed files in this pull request and generated 4 comments.

Show a summary per file
FileDescription
packages/react/test/reactrouterv6-compat-utils.test.tsxRemoves entire test file as functionality moved to new modules
packages/react/test/reactrouter-cross-usage.test.tsxRemoves assertions expecting multiple updateName calls since they're now prevented
packages/react/test/reactrouter-compat-utils/utils.test.tsAdds comprehensive tests for utility functions moved from old module
packages/react/test/reactrouter-compat-utils/lazy-routes.test.tsAdds tests for lazy route handling functionality
packages/react/test/reactrouter-compat-utils/instrumentation.test.tsxAdds tests for instrumentation-specific functionality
packages/react/src/reactrouterv7.tsxUpdates import path to new module structure
packages/react/src/reactrouterv6.tsxUpdates import path to new module structure
packages/react/src/reactrouter-compat-utils/utils.tsNew utility functions module with core router utilities
packages/react/src/reactrouter-compat-utils/lazy-routes.tsxNew module for lazy route handling functionality
packages/react/src/reactrouter-compat-utils/instrumentation.tsxNew main instrumentation module with navigation span tracking
packages/react/src/reactrouter-compat-utils/index.tsNew index file exporting all functionality from sub-modules
dev-packages/e2e-tests/test-applications/react-router-7-lazy-routes/tests/transactions.test.tsAdds tests for navigation between lazy routes
dev-packages/e2e-tests/test-applications/react-router-7-lazy-routes/src/pages/InnerLazyRoutes.tsxAdds navigation link to another lazy route
dev-packages/e2e-tests/test-applications/react-router-7-lazy-routes/src/pages/Index.tsxAdds navigation links to lazy routes
dev-packages/e2e-tests/test-applications/react-router-7-lazy-routes/src/pages/AnotherLazyRoutes.tsxAdds new lazy route component with navigation links
dev-packages/e2e-tests/test-applications/react-router-7-lazy-routes/src/index.tsxAdds another lazy route configuration

Tip: Customize your code reviews with copilot-instructions.md. Create the file or learn how to get started.

Comment threadpackages/react/src/reactrouter-compat-utils/instrumentation.tsx Outdated
Comment threadpackages/react/src/reactrouter-compat-utils/instrumentation.tsx Outdated
Comment threadpackages/react/src/reactrouter-compat-utils/utils.ts Outdated
@onurtemizkan
onurtemizkanforce-pushed the onur/react-router-multiple-name-updates branch from 1431408 to 60a9d7cCompareAugust 27, 2025 09:34

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

Phew big change – Did not review all the tests in detail but looks good 🚀

Comment threadpackages/react/src/reactrouter-compat-utils/instrumentation.tsx Outdated
Comment threadpackages/react/src/reactrouter-compat-utils/lazy-routes.tsx Outdated
Comment threadpackages/react/src/reactrouter-compat-utils/index.ts
@chargomechargome self-assigned this Aug 27, 2025
@chargome

Copy link
Copy Markdown
Member

@onurtemizkan Added some minor things myself so I can release that tomorrow, thanks for the refactor!

@chargome
chargome merged commit 895b385 into developAug 27, 2025
319 of 323 checks passed
@chargome
chargome deleted the onur/react-router-multiple-name-updates branch August 27, 2025 20:35
s1gr1d added a commit that referenced this pull request Sep 9, 2025
Removes recently introduced special-casing lazy-route -> lazy-route
transaction name updates.
This completes the fix in #17438.
E2E tests are updated to replicate a similar case in the reproduction
here: #17417
Also manually tested on the reproduction.
---------
Co-authored-by: Sigrid Huemer <32902192+s1gr1d@users.noreply.github.com>
mergifyBot added a commit to reisene/HulajDusza-serwis that referenced this pull request Sep 29, 2025
![snyk-io[bot]](https://badgen.net/badge/icon/snyk-io%5Bbot%5D/green?label=)
![Contributor](https://badgen.net/badge/icon/Contributor/000000?label=)
[<img width="16" alt="Powered by Pull Request Badge"
src="https://user-images.githubusercontent.com/1393946/111216524-d2bb8e00-85d4-11eb-821b-ed4c00989c02.png">](https://pullrequestbadge.com/?utm_medium=github&utm_source=reisene&utm_campaign=badge_info)<!--
PR-BADGE: PLEASE DO NOT REMOVE THIS COMMENT -->
![snyk-top-banner](https://res.cloudinary.com/snyk/image/upload/r-d/scm-platform/snyk-pull-requests/pr-banner-default.svg)
<h3>Snyk has created this PR to upgrade @sentry/profiling-node from
10.8.0 to 10.9.0.</h3>
:information_source: Keep your dependencies up-to-date. This makes it
easier to fix existing vulnerabilities and to more quickly identify and
fix newly disclosed vulnerabilities when they affect your project.
<hr/>
- The recommended version is **1 version** ahead of your current
version.
- The recommended version was released **22 days ago**.
#### Issues fixed by the recommended upgrade:
| | Issue | Score | Exploit Maturity |
:-------------------------:|:-------------------------|:-------------------------|:-------------------------
![low
severity](https://res.cloudinary.com/snyk/image/upload/r-d/scm-platform/snyk-pull-requests//severity-low.svg
'low severity') | Regular Expression Denial of Service
(ReDoS)<br/>[SNYK-JS-BRACEEXPANSION-9789073](https://snyk.io/vuln/SNYK-JS-BRACEEXPANSION-9789073)
| **57** | Proof of Concept
![low
severity](https://res.cloudinary.com/snyk/image/upload/r-d/scm-platform/snyk-pull-requests//severity-low.svg
'low severity') | Regular Expression Denial of Service
(ReDoS)<br/>[SNYK-JS-BRACEEXPANSION-9789073](https://snyk.io/vuln/SNYK-JS-BRACEEXPANSION-9789073)
| **57** | Proof of Concept
<details>
<summary><b>Release notes</b></summary>
<br/>
<details>
<summary>Package name: <b>@sentry/profiling-node</b></summary>
<ul>
<li>
<b>10.9.0</b> - <a
href="https://redirect.github.com/getsentry/sentry-javascript/releases/tag/10.9.0">2025-09-03</a></br><h3>Important
Changes</h3>
<ul>
<li><strong>feat(node): Update <code>httpIntegration</code> handling of
incoming requests (<a
href="https://redirect.github.com/getsentry/sentry-javascript/pull/17371"
data-hovercard-type="pull_request"
data-hovercard-url="/getsentry/sentry-javascript/pull/17371/hovercard">#17371</a>)</strong></li>
</ul>
<p>This version updates the handling of the Node SDK of incoming
requests. Instead of relying on @ opentelemetry/instrumentation-http, we
now handle incoming request instrumentation internally, ensuring that we
can optimize performance as much as possible and avoid interop
problems.</p>
<p>This change should not affect you, unless you're relying on very
in-depth implementation details. Importantly, this also drops the
<code>_experimentalConfig</code> option of the integration - this will
no longer do anything.<br>
Finally, you can still pass
<code>instrumentation.{requestHook,responseHook,applyCustomAttributesOnSpan}</code>
options, but they are deprecated and will be removed in v11. Instead,
you can use the new <code>incomingRequestSpanHook</code> configuration
option if you want to adjust the incoming request span.</p>
<h3>Other Changes</h3>
<ul>
<li>feat(browser): Add replay.feedback CDN bundle (<a
href="https://redirect.github.com/getsentry/sentry-javascript/pull/17496"
data-hovercard-type="pull_request"
data-hovercard-url="/getsentry/sentry-javascript/pull/17496/hovercard">#17496</a>)</li>
<li>feat(browser): Export <code>sendFeedback</code> from CDN bundles (<a
href="https://redirect.github.com/getsentry/sentry-javascript/pull/17495"
data-hovercard-type="pull_request"
data-hovercard-url="/getsentry/sentry-javascript/pull/17495/hovercard">#17495</a>)</li>
<li>fix(astro): Ensure span name from <code>beforeStartSpan</code> isn't
overwritten (<a
href="https://redirect.github.com/getsentry/sentry-javascript/pull/17500"
data-hovercard-type="pull_request"
data-hovercard-url="/getsentry/sentry-javascript/pull/17500/hovercard">#17500</a>)</li>
<li>fix(browser): Ensure source is set correctly when updating span name
in-place in <code>beforeStartSpan</code> (<a
href="https://redirect.github.com/getsentry/sentry-javascript/pull/17501"
data-hovercard-type="pull_request"
data-hovercard-url="/getsentry/sentry-javascript/pull/17501/hovercard">#17501</a>)</li>
<li>fix(core): Only set template attributes on logs if parameters exist
(<a
href="https://redirect.github.com/getsentry/sentry-javascript/pull/17480"
data-hovercard-type="pull_request"
data-hovercard-url="/getsentry/sentry-javascript/pull/17480/hovercard">#17480</a>)</li>
<li>fix(nextjs): Fix parameterization for root catchall routes (<a
href="https://redirect.github.com/getsentry/sentry-javascript/pull/17489"
data-hovercard-type="pull_request"
data-hovercard-url="/getsentry/sentry-javascript/pull/17489/hovercard">#17489</a>)</li>
<li>fix(node-core): Shut down OTel TraceProvider when calling
<code>Sentry.close()</code> (<a
href="https://redirect.github.com/getsentry/sentry-javascript/pull/17499"
data-hovercard-type="pull_request"
data-hovercard-url="/getsentry/sentry-javascript/pull/17499/hovercard">#17499</a>)</li>
</ul>
<details>
<summary> <strong>Internal Changes</strong> </summary>
<ul>
<li>chore: Add <code>changelog</code> script back to package.json (<a
href="https://redirect.github.com/getsentry/sentry-javascript/pull/17517"
data-hovercard-type="pull_request"
data-hovercard-url="/getsentry/sentry-javascript/pull/17517/hovercard">#17517</a>)</li>
<li>chore: Ensure prettier is run on all files (<a
href="https://redirect.github.com/getsentry/sentry-javascript/pull/17497"
data-hovercard-type="pull_request"
data-hovercard-url="/getsentry/sentry-javascript/pull/17497/hovercard">#17497</a>)</li>
<li>chore: Ignore prettier commit for git blame (<a
href="https://redirect.github.com/getsentry/sentry-javascript/pull/17498"
data-hovercard-type="pull_request"
data-hovercard-url="/getsentry/sentry-javascript/pull/17498/hovercard">#17498</a>)</li>
<li>chore: Remove experimental from Nuxt SDK package description (<a
href="https://redirect.github.com/getsentry/sentry-javascript/pull/17483"
data-hovercard-type="pull_request"
data-hovercard-url="/getsentry/sentry-javascript/pull/17483/hovercard">#17483</a>)</li>
<li>ci: Capture overhead in node app (<a
href="https://redirect.github.com/getsentry/sentry-javascript/pull/17420"
data-hovercard-type="pull_request"
data-hovercard-url="/getsentry/sentry-javascript/pull/17420/hovercard">#17420</a>)</li>
<li>ci: Ensure we fail on cancelled jobs (<a
href="https://redirect.github.com/getsentry/sentry-javascript/pull/17506"
data-hovercard-type="pull_request"
data-hovercard-url="/getsentry/sentry-javascript/pull/17506/hovercard">#17506</a>)</li>
<li>ci(deps): bump actions/checkout from 4 to 5 (<a
href="https://redirect.github.com/getsentry/sentry-javascript/pull/17505"
data-hovercard-type="pull_request"
data-hovercard-url="/getsentry/sentry-javascript/pull/17505/hovercard">#17505</a>)</li>
<li>ci(deps): bump actions/create-github-app-token from 2.0.6 to 2.1.1
(<a
href="https://redirect.github.com/getsentry/sentry-javascript/pull/17504"
data-hovercard-type="pull_request"
data-hovercard-url="/getsentry/sentry-javascript/pull/17504/hovercard">#17504</a>)</li>
<li>test(aws): Improve reliability on CI (<a
href="https://redirect.github.com/getsentry/sentry-javascript/pull/17502"
data-hovercard-type="pull_request"
data-hovercard-url="/getsentry/sentry-javascript/pull/17502/hovercard">#17502</a>)</li>
</ul>
</details>
<h2>Bundle size 📦</h2>
<table>
<thead>
<tr>
<th>Path</th>
<th>Size</th>
</tr>
</thead>
<tbody>
<tr>
<td>@ sentry/browser</td>
<td>23.59 KB</td>
</tr>
<tr>
<td>@ sentry/browser - with treeshaking flags</td>
<td>22.2 KB</td>
</tr>
<tr>
<td>@ sentry/browser (incl. Tracing)</td>
<td>38.93 KB</td>
</tr>
<tr>
<td>@ sentry/browser (incl. Tracing, Replay)</td>
<td>76.4 KB</td>
</tr>
<tr>
<td>@ sentry/browser (incl. Tracing, Replay) - with treeshaking
flags</td>
<td>66.43 KB</td>
</tr>
<tr>
<td>@ sentry/browser (incl. Tracing, Replay with Canvas)</td>
<td>80.97 KB</td>
</tr>
<tr>
<td>@ sentry/browser (incl. Tracing, Replay, Feedback)</td>
<td>92.81 KB</td>
</tr>
<tr>
<td>@ sentry/browser (incl. Feedback)</td>
<td>39.88 KB</td>
</tr>
<tr>
<td>@ sentry/browser (incl. sendFeedback)</td>
<td>28.13 KB</td>
</tr>
<tr>
<td>@ sentry/browser (incl. FeedbackAsync)</td>
<td>32.92 KB</td>
</tr>
<tr>
<td>@ sentry/react</td>
<td>25.27 KB</td>
</tr>
<tr>
<td>@ sentry/react (incl. Tracing)</td>
<td>40.91 KB</td>
</tr>
<tr>
<td>@ sentry/vue</td>
<td>27.97 KB</td>
</tr>
<tr>
<td>@ sentry/vue (incl. Tracing)</td>
<td>40.72 KB</td>
</tr>
<tr>
<td>@ sentry/svelte</td>
<td>23.62 KB</td>
</tr>
<tr>
<td>CDN Bundle</td>
<td>25.06 KB</td>
</tr>
<tr>
<td>CDN Bundle (incl. Tracing)</td>
<td>38.82 KB</td>
</tr>
<tr>
<td>CDN Bundle (incl. Tracing, Replay)</td>
<td>74.25 KB</td>
</tr>
<tr>
<td>CDN Bundle (incl. Tracing, Replay, Feedback)</td>
<td>79.56 KB</td>
</tr>
<tr>
<td>CDN Bundle - uncompressed</td>
<td>73.2 KB</td>
</tr>
<tr>
<td>CDN Bundle (incl. Tracing) - uncompressed</td>
<td>114.83 KB</td>
</tr>
<tr>
<td>CDN Bundle (incl. Tracing, Replay) - uncompressed</td>
<td>227.23 KB</td>
</tr>
<tr>
<td>CDN Bundle (incl. Tracing, Replay, Feedback) - uncompressed</td>
<td>239.56 KB</td>
</tr>
<tr>
<td>@ sentry/nextjs (client)</td>
<td>42.86 KB</td>
</tr>
<tr>
<td>@ sentry/sveltekit (client)</td>
<td>39.38 KB</td>
</tr>
<tr>
<td>@ sentry/node-core</td>
<td>48.45 KB</td>
</tr>
<tr>
<td>@ sentry/node</td>
<td>146.74 KB</td>
</tr>
<tr>
<td>@ sentry/node - without tracing</td>
<td>90.02 KB</td>
</tr>
<tr>
<td>@ sentry/aws-serverless</td>
<td>103.01 KB</td>
</tr>
</tbody>
</table>
</li>
<li>
<b>10.8.0</b> - <a
href="https://redirect.github.com/getsentry/sentry-javascript/releases/tag/10.8.0">2025-08-29</a></br><h3>Important
Changes</h3>
<ul>
<li>
<p><strong>feat(sveltekit): Add Compatibility for builtin SvelteKit
Tracing (<a
href="https://redirect.github.com/getsentry/sentry-javascript/pull/17423"
data-hovercard-type="pull_request"
data-hovercard-url="/getsentry/sentry-javascript/pull/17423/hovercard">#17423</a>)</strong></p>
<p>This release makes the <code>@ sentry/sveltekit</code> SDK compatible
with SvelteKit's native <a
href="https://svelte.dev/docs/kit/observability"
rel="nofollow">observability support</a> introduced in SvelteKit version
<code>2.31.0</code>.<br>
If you enable both, instrumentation and tracing, the SDK will now
initialize early enough to set up additional instrumentation like
database queries and it will pick up spans emitted from SvelteKit.</p>
<p>We will follow up with docs how to set up the SDK soon.<br>
For now, If you're on SvelteKit version <code>2.31.0</code> or newer,
you can easily opt into the new feature:</p>
<ol>
<li>
<p>Enable <a href="https://svelte.dev/docs/kit/observability"
rel="nofollow">experimental tracing and instrumentation support</a> in
<code>svelte.config.js</code>:</p>
</li>
<li>
<p>Move your <code>Sentry.init()</code> call from
<code>src/hooks.server.(js|ts)</code> to the new
<code>instrumentation.server.(js|ts)</code> file:</p>
<div class="highlight highlight-source-ts notranslate position-relative
overflow-auto" data-snippet-clipboard-copy-content="//
instrumentation.server.ts
import * as Sentry from '@ sentry/sveltekit';
Sentry.init({
dsn: '...',
// rest of your config
});"><pre><span class="pl-c">// instrumentation.server.ts</span>
<span class="pl-k">import</span> <span class="pl-c1">*</span> <span
class="pl-k">as</span> <span class="pl-v">Sentry</span> <span
class="pl-k">from</span> <span class="pl-s">'@
sentry/sveltekit'</span><span class="pl-kos">;</span>
<span class="pl-v">Sentry</span><span class="pl-kos">.</span><span
class="pl-en">init</span><span class="pl-kos">(</span><span
class="pl-kos">{</span>
<span class="pl-c1">dsn</span>: <span class="pl-s">'...'</span><span
class="pl-kos">,</span>
<span class="pl-c">// rest of your config</span>
<span class="pl-kos">}</span><span class="pl-kos">)</span><span
class="pl-kos">;</span></pre></div>
<p>The rest of your Sentry config in <code>hooks.server.ts</code>
(<code>sentryHandle</code> and <code>handleErrorWithSentry</code>)
should stay the same.</p>
</li>
</ol>
<p>If you prefer to stay on the hooks-file based config for now, the SDK
will continue to work as previously.</p>
<p>Thanks to the Svelte team and <a class="user-mention notranslate"
data-hovercard-type="user"
data-hovercard-url="/users/elliott-with-the-longest-name-on-github/hovercard"
data-octo-click="hovercard-link-click"
data-octo-dimensions="link_type:self"
href="https://redirect.github.com/elliott-with-the-longest-name-on-github">@
elliott-with-the-longest-name-on-github</a> for implementing
observability support and for reviewing our PR!</p>
</li>
</ul>
<h3>Other Changes</h3>
<ul>
<li>fix(react): Avoid multiple name updates on navigation spans (<a
href="https://redirect.github.com/getsentry/sentry-javascript/pull/17438"
data-hovercard-type="pull_request"
data-hovercard-url="/getsentry/sentry-javascript/pull/17438/hovercard">#17438</a>)</li>
</ul>
<details>
<summary> <strong>Internal Changes</strong> </summary>
<ul>
<li>test(profiling): Add tests for current state of profiling (<a
href="https://redirect.github.com/getsentry/sentry-javascript/pull/17470"
data-hovercard-type="pull_request"
data-hovercard-url="/getsentry/sentry-javascript/pull/17470/hovercard">#17470</a>)</li>
</ul>
</details>
<h2>Bundle size 📦</h2>
<table>
<thead>
<tr>
<th>Path</th>
<th>Size</th>
</tr>
</thead>
<tbody>
<tr>
<td>@ sentry/browser</td>
<td>23.59 KB</td>
</tr>
<tr>
<td>@ sentry/browser - with treeshaking flags</td>
<td>22.2 KB</td>
</tr>
<tr>
<td>@ sentry/browser (incl. Tracing)</td>
<td>38.94 KB</td>
</tr>
<tr>
<td>@ sentry/browser (incl. Tracing, Replay)</td>
<td>76.4 KB</td>
</tr>
<tr>
<td>@ sentry/browser (incl. Tracing, Replay) - with treeshaking
flags</td>
<td>66.43 KB</td>
</tr>
<tr>
<td>@ sentry/browser (incl. Tracing, Replay with Canvas)</td>
<td>80.97 KB</td>
</tr>
<tr>
<td>@ sentry/browser (incl. Tracing, Replay, Feedback)</td>
<td>92.8 KB</td>
</tr>
<tr>
<td>@ sentry/browser (incl. Feedback)</td>
<td>39.88 KB</td>
</tr>
<tr>
<td>@ sentry/browser (incl. sendFeedback)</td>
<td>28.13 KB</td>
</tr>
<tr>
<td>@ sentry/browser (incl. FeedbackAsync)</td>
<td>32.92 KB</td>
</tr>
<tr>
<td>@ sentry/react</td>
<td>25.27 KB</td>
</tr>
<tr>
<td>@ sentry/react (incl. Tracing)</td>
<td>40.91 KB</td>
</tr>
<tr>
<td>@ sentry/vue</td>
<td>27.97 KB</td>
</tr>
<tr>
<td>@ sentry/vue (incl. Tracing)</td>
<td>40.72 KB</td>
</tr>
<tr>
<td>@ sentry/svelte</td>
<td>23.62 KB</td>
</tr>
<tr>
<td>CDN Bundle</td>
<td>25.06 KB</td>
</tr>
<tr>
<td>CDN Bundle (incl. Tracing)</td>
<td>38.82 KB</td>
</tr>
<tr>
<td>CDN Bundle (incl. Tracing, Replay)</td>
<td>74.24 KB</td>
</tr>
<tr>
<td>CDN Bundle (incl. Tracing, Replay, Feedback)</td>
<td>79.55 KB</td>
</tr>
<tr>
<td>CDN Bundle - uncompressed</td>
<td>73.2 KB</td>
</tr>
<tr>
<td>CDN Bundle (incl. Tracing) - uncompressed</td>
<td>114.83 KB</td>
</tr>
<tr>
<td>CDN Bundle (incl. Tracing, Replay) - uncompressed</td>
<td>227.23 KB</td>
</tr>
<tr>
<td>CDN Bundle (incl. Tracing, Replay, Feedback) - uncompressed</td>
<td>239.53 KB</td>
</tr>
<tr>
<td>@ sentry/nextjs (client)</td>
<td>42.86 KB</td>
</tr>
<tr>
<td>@ sentry/sveltekit (client)</td>
<td>39.38 KB</td>
</tr>
<tr>
<td>@ sentry/node-core</td>
<td>46.87 KB</td>
</tr>
<tr>
<td>@ sentry/node</td>
<td>145.75 KB</td>
</tr>
<tr>
<td>@ sentry/node - without tracing</td>
<td>90.08 KB</td>
</tr>
<tr>
<td>@ sentry/aws-serverless</td>
<td>102.45 KB</td>
</tr>
</tbody>
</table>
</li>
</ul>
from <a
href="https://redirect.github.com/getsentry/sentry-javascript/releases">@sentry/profiling-node
GitHub release notes</a>
</details>
</details>
---
> [!IMPORTANT]
>
> - Check the changes in this PR to ensure they won't cause issues with
your project.
> - This PR was automatically created by Snyk using the credentials of a
real user.
> - Max score is 1000. Note that the real score may have changed since
the PR was raised.
---
**Note:** _You are seeing this because you or someone else with access
to this repository has authorized Snyk to open upgrade PRs._
**For more information:** <img
src="https://api.segment.io/v1/pixel/track?data=eyJ3cml0ZUtleSI6InJyWmxZcEdHY2RyTHZsb0lYd0dUcVg4WkFRTnNCOUEwIiwiYW5vbnltb3VzSWQiOiI2MDhkOWU5ZS04ZDBlLTQ5N2EtYTNkZS1mMTVkYzU1YmNkNTciLCJldmVudCI6IlBSIHZpZXdlZCIsInByb3BlcnRpZXMiOnsicHJJZCI6IjYwOGQ5ZTllLThkMGUtNDk3YS1hM2RlLWYxNWRjNTViY2Q1NyJ9fQ=="
width="0" height="0"/>
> - 🧐 [View latest project
report](https://app.snyk.io/org/reisene/project/55e114f8-489e-4f14-b900-20574b041e59?utm_source&#x3D;github-cloud-app&amp;utm_medium&#x3D;referral&amp;page&#x3D;upgrade-pr)
> - 📜 [Customise PR
templates](https://docs.snyk.io/scan-using-snyk/pull-requests/snyk-fix-pull-or-merge-requests/customize-pr-templates?utm_source=&utm_content=fix-pr-template)
> - 🛠 [Adjust upgrade PR
settings](https://app.snyk.io/org/reisene/project/55e114f8-489e-4f14-b900-20574b041e59/settings/integration?utm_source&#x3D;github-cloud-app&amp;utm_medium&#x3D;referral&amp;page&#x3D;upgrade-pr)
> - 🔕 [Ignore this dependency or unsubscribe from future upgrade
PRs](https://app.snyk.io/org/reisene/project/55e114f8-489e-4f14-b900-20574b041e59/settings/integration?pkg&#x3D;@sentry/profiling-node&amp;utm_source&#x3D;github-cloud-app&amp;utm_medium&#x3D;referral&amp;page&#x3D;upgrade-pr#auto-dep-upgrades)
[//]: #
'snyk:metadata:{"customTemplate":{"variablesUsed":[],"fieldsUsed":[]},"dependencies":[{"name":"@sentry/profiling-node","from":"10.8.0","to":"10.9.0"}],"env":"prod","hasFixes":true,"isBreakingChange":false,"isMajorUpgrade":false,"issuesToFix":["SNYK-JS-BRACEEXPANSION-9789073","SNYK-JS-BRACEEXPANSION-9789073"],"prId":"608d9e9e-8d0e-497a-a3de-f15dc55bcd57","prPublicId":"608d9e9e-8d0e-497a-a3de-f15dc55bcd57","packageManager":"npm","priorityScoreList":[57],"projectPublicId":"55e114f8-489e-4f14-b900-20574b041e59","projectUrl":"https://app.snyk.io/org/reisene/project/55e114f8-489e-4f14-b900-20574b041e59?utm_source=github-cloud-app&utm_medium=referral&page=upgrade-pr","prType":"upgrade","templateFieldSources":{"branchName":"default","commitMessage":"default","description":"default","title":"default"},"templateVariants":["priorityScore"],"type":"auto","upgrade":["SNYK-JS-BRACEEXPANSION-9789073","SNYK-JS-BRACEEXPANSION-9789073"],"upgradeInfo":{"versionsDiff":1,"publishedDate":"2025-09-03T12:59:52.227Z"},"vulns":["SNYK-JS-BRACEEXPANSION-9789073","SNYK-JS-BRACEEXPANSION-9789073"]}'
onurtemizkan added a commit that referenced this pull request Feb 10, 2026
…es (#19086)
This PR will resolve the core reason for the series of fixes / handling
for automatic lazy-route resolution for a while.
Related: #18898,
#18881,
#18346,
#18155,
#18098,
#17962,
#17867,
#17438,
#17277
The core issue we have been trying to tackle is not having access to the
complete route hierarchy when asynchronously loaded lazy routes are
used. React Router provides a route manifest that we can use while
matching parameterized transaction names with routes in all cases except
this lazy-routes pattern.
This problem has been discussed on React Router:
- remix-run/react-router#11113
While this has been
[addressed](remix-run/react-router#11626) for
Remix / React Router (Framework Mode), it's still not available in
Library Mode. The manifest contains the lazily-loaded route, only when
it's navigated to. While waiting for navigation, our transactions can be
dropped for several reasons, such as user behaviour like switching tabs
(`document.hidden` guard), hitting timeouts like `idleTimeout`, and
potentially other reasons. This results in incomplete transaction naming
with leftover wildcards, which caused broken aggregation on the Sentry
dashboard.
The series of attempts to fix this while keeping automatic route
discovery has been prone to race conditions and required special-case
handling of each edge case scenario, also requiring a considerable
amount of internal logic, affecting our readability and performance. At
the end, all failed in giving completely robust and deterministic
results on the customers' side.
This PR proposes a new option: `lazyRouteManifest` specifically for lazy
routes. This will let us have initial information about the route
hierarchy. So we can assign correct parameterized transaction names
without needing to wait for navigated state.
It's a static array of routes in parameterized format (needs to be
maintained by the users on route hierarchy updates) like:
```ts
Sentry.reactRouterV7BrowserTracingIntegration({
// ...
enableAsyncRouteHandlers: true
lazyRouteManifest: [
'/',
'/pricing',
'/features',
'/login',
'/signup',
'/forgot-password',
'/reset-password/:token',
'/org/:orgSlug',
'/org/:orgSlug/dashboard',
'/org/:orgSlug/projects',
'/org/:orgSlug/projects/:projectId',
'/org/:orgSlug/projects/:projectId/settings',
'/org/:orgSlug/projects/:projectId/issues',
'/org/:orgSlug/projects/:projectId/issues/:issueId',
'/org/:orgSlug/team',
'/org/:orgSlug/team/:memberId',
'/org/:orgSlug/settings',
'/org/:orgSlug/billing',
'/admin',
'/admin/users',
'/admin/users/:userId',
'/admin/orgs',
'/admin/orgs/:orgId',
],
})
```
- This will only be active when `enableAsyncRouteHandlers` is set to
`true`
- To match URLs with given routes, we mimic React Router's own
implementation.
- When this is not provided or fails, it falls back to the current
behaviour
- This manifest is primarily for lazy routes, but the users can also add
their non-lazy routes here for convenience or consistency.
- Also added E2E tests that will fail when (if at some point) React
Router manifests include the lazy routes before navigation, so we'll be
aware and plan depending on that manifest instead.
- We can do a cleanup for the race-condition / edge-case handling part
of the code in a follow-up PR.
Closes#19090 (added automatically)
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.

3 participants

@onurtemizkan@chargome
, '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

fix(react): Avoid multiple name updates on navigation spans - #17438

Merged
chargome merged 16 commits into
developfrom
onur/react-router-multiple-name-updates
Aug 27, 2025
Merged

fix(react): Avoid multiple name updates on navigation spans#17438
chargome merged 16 commits into
developfrom
onur/react-router-multiple-name-updates

Conversation

@onurtemizkan

@onurtemizkanonurtemizkan commented Aug 21, 2025

Copy link
Copy Markdown
Contributor

This patch prevents name updates on navigation spans from being applied more than once.

This was fine and allowed for cross-usage of different instrumentation ways (such as instrumenting useRoutes and createBrowserRouter together), and didn't create any issues. But after adding support for lazy routes, it led to incorrect transaction names, especially when there's a navigation between two lazily-loaded routes.

While on it, I also had to do some refactoring to keep the code readable and maintainable, so now reactrouterv6-compat-utils is separated into 3 source files (instrumentation, common utils, and lazy routes specific functionality).

@onurtemizkan
onurtemizkanforce-pushed the onur/react-router-multiple-name-updates branch 4 times, most recently from aea2217 to 57c8b22CompareAugust 22, 2025 13:13
@github-actions

github-actionsBot commented Aug 22, 2025

Copy link
Copy Markdown
Contributor

size-limit report 📦

PathSize% ChangeChange
@sentry/browser24.16 kB--
@sentry/browser - with treeshaking flags22.73 kB--
@sentry/browser (incl. Tracing)39.87 kB--
@sentry/browser (incl. Tracing, Replay)78.23 kB--
@sentry/browser (incl. Tracing, Replay) - with treeshaking flags68.02 kB--
@sentry/browser (incl. Tracing, Replay with Canvas)82.91 kB--
@sentry/browser (incl. Tracing, Replay, Feedback)95.03 kB--
@sentry/browser (incl. Feedback)40.83 kB--
@sentry/browser (incl. sendFeedback)28.81 kB--
@sentry/browser (incl. FeedbackAsync)33.7 kB--
@sentry/react25.88 kB--
@sentry/react (incl. Tracing)41.89 kB+0.06%+23 B 🔺
@sentry/vue28.64 kB--
@sentry/vue (incl. Tracing)41.69 kB--
@sentry/svelte24.18 kB--
CDN Bundle25.66 kB--
CDN Bundle (incl. Tracing)39.75 kB--
CDN Bundle (incl. Tracing, Replay)76.03 kB--
CDN Bundle (incl. Tracing, Replay, Feedback)81.46 kB--
CDN Bundle - uncompressed74.96 kB--
CDN Bundle (incl. Tracing) - uncompressed117.59 kB--
CDN Bundle (incl. Tracing, Replay) - uncompressed232.68 kB--
CDN Bundle (incl. Tracing, Replay, Feedback) - uncompressed245.28 kB--
@sentry/nextjs (client)43.89 kB--
@sentry/sveltekit (client)40.32 kB--
@sentry/node-core47.99 kB-0.01%-1 B 🔽
@sentry/node149.25 kB--
@sentry/node - without tracing92.24 kB--
@sentry/aws-serverless104.91 kB+0.01%+1 B 🔺

View base workflow run

@onurtemizkan
onurtemizkanforce-pushed the onur/react-router-multiple-name-updates branch 4 times, most recently from 0e679dc to 27c5da6CompareAugust 27, 2025 00:18
@onurtemizkan
onurtemizkanforce-pushed the onur/react-router-multiple-name-updates branch from 8da7c27 to 453f5c6CompareAugust 27, 2025 07:29
@onurtemizkan
onurtemizkan marked this pull request as ready for review August 27, 2025 07:29
cursor[bot]

This comment was marked as outdated.

@onurtemizkan
onurtemizkanforce-pushed the onur/react-router-multiple-name-updates branch from 1d2839b to 8507984CompareAugust 27, 2025 08:16

CopilotAI 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.

Pull Request Overview

This PR refactors the React Router v6/v7 compatibility utilities to prevent multiple navigation span name updates and fix incorrect transaction names for lazy routes.

  • Refactors the reactrouterv6-compat-utils module into three separate files for better organization
  • Implements tracking to prevent duplicate navigation span name updates during navigation
  • Fixes transaction naming issues that occurred when navigating between lazy routes

Reviewed Changes

Copilot reviewed 16 out of 16 changed files in this pull request and generated 4 comments.

Show a summary per file
FileDescription
packages/react/test/reactrouterv6-compat-utils.test.tsxRemoves entire test file as functionality moved to new modules
packages/react/test/reactrouter-cross-usage.test.tsxRemoves assertions expecting multiple updateName calls since they're now prevented
packages/react/test/reactrouter-compat-utils/utils.test.tsAdds comprehensive tests for utility functions moved from old module
packages/react/test/reactrouter-compat-utils/lazy-routes.test.tsAdds tests for lazy route handling functionality
packages/react/test/reactrouter-compat-utils/instrumentation.test.tsxAdds tests for instrumentation-specific functionality
packages/react/src/reactrouterv7.tsxUpdates import path to new module structure
packages/react/src/reactrouterv6.tsxUpdates import path to new module structure
packages/react/src/reactrouter-compat-utils/utils.tsNew utility functions module with core router utilities
packages/react/src/reactrouter-compat-utils/lazy-routes.tsxNew module for lazy route handling functionality
packages/react/src/reactrouter-compat-utils/instrumentation.tsxNew main instrumentation module with navigation span tracking
packages/react/src/reactrouter-compat-utils/index.tsNew index file exporting all functionality from sub-modules
dev-packages/e2e-tests/test-applications/react-router-7-lazy-routes/tests/transactions.test.tsAdds tests for navigation between lazy routes
dev-packages/e2e-tests/test-applications/react-router-7-lazy-routes/src/pages/InnerLazyRoutes.tsxAdds navigation link to another lazy route
dev-packages/e2e-tests/test-applications/react-router-7-lazy-routes/src/pages/Index.tsxAdds navigation links to lazy routes
dev-packages/e2e-tests/test-applications/react-router-7-lazy-routes/src/pages/AnotherLazyRoutes.tsxAdds new lazy route component with navigation links
dev-packages/e2e-tests/test-applications/react-router-7-lazy-routes/src/index.tsxAdds another lazy route configuration

Tip: Customize your code reviews with copilot-instructions.md. Create the file or learn how to get started.

Comment threadpackages/react/src/reactrouter-compat-utils/instrumentation.tsx Outdated
Comment threadpackages/react/src/reactrouter-compat-utils/instrumentation.tsx Outdated
Comment threadpackages/react/src/reactrouter-compat-utils/utils.ts Outdated
@onurtemizkan
onurtemizkanforce-pushed the onur/react-router-multiple-name-updates branch from 1431408 to 60a9d7cCompareAugust 27, 2025 09:34

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

Phew big change – Did not review all the tests in detail but looks good 🚀

Comment threadpackages/react/src/reactrouter-compat-utils/instrumentation.tsx Outdated
Comment threadpackages/react/src/reactrouter-compat-utils/lazy-routes.tsx Outdated
Comment threadpackages/react/src/reactrouter-compat-utils/index.ts
@chargomechargome self-assigned this Aug 27, 2025
@chargome

Copy link
Copy Markdown
Member

@onurtemizkan Added some minor things myself so I can release that tomorrow, thanks for the refactor!

@chargome
chargome merged commit 895b385 into developAug 27, 2025
319 of 323 checks passed
@chargome
chargome deleted the onur/react-router-multiple-name-updates branch August 27, 2025 20:35
s1gr1d added a commit that referenced this pull request Sep 9, 2025
Removes recently introduced special-casing lazy-route -> lazy-route
transaction name updates.
This completes the fix in #17438.
E2E tests are updated to replicate a similar case in the reproduction
here: #17417
Also manually tested on the reproduction.
---------
Co-authored-by: Sigrid Huemer <32902192+s1gr1d@users.noreply.github.com>
mergifyBot added a commit to reisene/HulajDusza-serwis that referenced this pull request Sep 29, 2025
![snyk-io[bot]](https://badgen.net/badge/icon/snyk-io%5Bbot%5D/green?label=)
![Contributor](https://badgen.net/badge/icon/Contributor/000000?label=)
[<img width="16" alt="Powered by Pull Request Badge"
src="https://user-images.githubusercontent.com/1393946/111216524-d2bb8e00-85d4-11eb-821b-ed4c00989c02.png">](https://pullrequestbadge.com/?utm_medium=github&utm_source=reisene&utm_campaign=badge_info)<!--
PR-BADGE: PLEASE DO NOT REMOVE THIS COMMENT -->
![snyk-top-banner](https://res.cloudinary.com/snyk/image/upload/r-d/scm-platform/snyk-pull-requests/pr-banner-default.svg)
<h3>Snyk has created this PR to upgrade @sentry/profiling-node from
10.8.0 to 10.9.0.</h3>
:information_source: Keep your dependencies up-to-date. This makes it
easier to fix existing vulnerabilities and to more quickly identify and
fix newly disclosed vulnerabilities when they affect your project.
<hr/>
- The recommended version is **1 version** ahead of your current
version.
- The recommended version was released **22 days ago**.
#### Issues fixed by the recommended upgrade:
| | Issue | Score | Exploit Maturity |
:-------------------------:|:-------------------------|:-------------------------|:-------------------------
![low
severity](https://res.cloudinary.com/snyk/image/upload/r-d/scm-platform/snyk-pull-requests//severity-low.svg
'low severity') | Regular Expression Denial of Service
(ReDoS)<br/>[SNYK-JS-BRACEEXPANSION-9789073](https://snyk.io/vuln/SNYK-JS-BRACEEXPANSION-9789073)
| **57** | Proof of Concept
![low
severity](https://res.cloudinary.com/snyk/image/upload/r-d/scm-platform/snyk-pull-requests//severity-low.svg
'low severity') | Regular Expression Denial of Service
(ReDoS)<br/>[SNYK-JS-BRACEEXPANSION-9789073](https://snyk.io/vuln/SNYK-JS-BRACEEXPANSION-9789073)
| **57** | Proof of Concept
<details>
<summary><b>Release notes</b></summary>
<br/>
<details>
<summary>Package name: <b>@sentry/profiling-node</b></summary>
<ul>
<li>
<b>10.9.0</b> - <a
href="https://redirect.github.com/getsentry/sentry-javascript/releases/tag/10.9.0">2025-09-03</a></br><h3>Important
Changes</h3>
<ul>
<li><strong>feat(node): Update <code>httpIntegration</code> handling of
incoming requests (<a
href="https://redirect.github.com/getsentry/sentry-javascript/pull/17371"
data-hovercard-type="pull_request"
data-hovercard-url="/getsentry/sentry-javascript/pull/17371/hovercard">#17371</a>)</strong></li>
</ul>
<p>This version updates the handling of the Node SDK of incoming
requests. Instead of relying on @ opentelemetry/instrumentation-http, we
now handle incoming request instrumentation internally, ensuring that we
can optimize performance as much as possible and avoid interop
problems.</p>
<p>This change should not affect you, unless you're relying on very
in-depth implementation details. Importantly, this also drops the
<code>_experimentalConfig</code> option of the integration - this will
no longer do anything.<br>
Finally, you can still pass
<code>instrumentation.{requestHook,responseHook,applyCustomAttributesOnSpan}</code>
options, but they are deprecated and will be removed in v11. Instead,
you can use the new <code>incomingRequestSpanHook</code> configuration
option if you want to adjust the incoming request span.</p>
<h3>Other Changes</h3>
<ul>
<li>feat(browser): Add replay.feedback CDN bundle (<a
href="https://redirect.github.com/getsentry/sentry-javascript/pull/17496"
data-hovercard-type="pull_request"
data-hovercard-url="/getsentry/sentry-javascript/pull/17496/hovercard">#17496</a>)</li>
<li>feat(browser): Export <code>sendFeedback</code> from CDN bundles (<a
href="https://redirect.github.com/getsentry/sentry-javascript/pull/17495"
data-hovercard-type="pull_request"
data-hovercard-url="/getsentry/sentry-javascript/pull/17495/hovercard">#17495</a>)</li>
<li>fix(astro): Ensure span name from <code>beforeStartSpan</code> isn't
overwritten (<a
href="https://redirect.github.com/getsentry/sentry-javascript/pull/17500"
data-hovercard-type="pull_request"
data-hovercard-url="/getsentry/sentry-javascript/pull/17500/hovercard">#17500</a>)</li>
<li>fix(browser): Ensure source is set correctly when updating span name
in-place in <code>beforeStartSpan</code> (<a
href="https://redirect.github.com/getsentry/sentry-javascript/pull/17501"
data-hovercard-type="pull_request"
data-hovercard-url="/getsentry/sentry-javascript/pull/17501/hovercard">#17501</a>)</li>
<li>fix(core): Only set template attributes on logs if parameters exist
(<a
href="https://redirect.github.com/getsentry/sentry-javascript/pull/17480"
data-hovercard-type="pull_request"
data-hovercard-url="/getsentry/sentry-javascript/pull/17480/hovercard">#17480</a>)</li>
<li>fix(nextjs): Fix parameterization for root catchall routes (<a
href="https://redirect.github.com/getsentry/sentry-javascript/pull/17489"
data-hovercard-type="pull_request"
data-hovercard-url="/getsentry/sentry-javascript/pull/17489/hovercard">#17489</a>)</li>
<li>fix(node-core): Shut down OTel TraceProvider when calling
<code>Sentry.close()</code> (<a
href="https://redirect.github.com/getsentry/sentry-javascript/pull/17499"
data-hovercard-type="pull_request"
data-hovercard-url="/getsentry/sentry-javascript/pull/17499/hovercard">#17499</a>)</li>
</ul>
<details>
<summary> <strong>Internal Changes</strong> </summary>
<ul>
<li>chore: Add <code>changelog</code> script back to package.json (<a
href="https://redirect.github.com/getsentry/sentry-javascript/pull/17517"
data-hovercard-type="pull_request"
data-hovercard-url="/getsentry/sentry-javascript/pull/17517/hovercard">#17517</a>)</li>
<li>chore: Ensure prettier is run on all files (<a
href="https://redirect.github.com/getsentry/sentry-javascript/pull/17497"
data-hovercard-type="pull_request"
data-hovercard-url="/getsentry/sentry-javascript/pull/17497/hovercard">#17497</a>)</li>
<li>chore: Ignore prettier commit for git blame (<a
href="https://redirect.github.com/getsentry/sentry-javascript/pull/17498"
data-hovercard-type="pull_request"
data-hovercard-url="/getsentry/sentry-javascript/pull/17498/hovercard">#17498</a>)</li>
<li>chore: Remove experimental from Nuxt SDK package description (<a
href="https://redirect.github.com/getsentry/sentry-javascript/pull/17483"
data-hovercard-type="pull_request"
data-hovercard-url="/getsentry/sentry-javascript/pull/17483/hovercard">#17483</a>)</li>
<li>ci: Capture overhead in node app (<a
href="https://redirect.github.com/getsentry/sentry-javascript/pull/17420"
data-hovercard-type="pull_request"
data-hovercard-url="/getsentry/sentry-javascript/pull/17420/hovercard">#17420</a>)</li>
<li>ci: Ensure we fail on cancelled jobs (<a
href="https://redirect.github.com/getsentry/sentry-javascript/pull/17506"
data-hovercard-type="pull_request"
data-hovercard-url="/getsentry/sentry-javascript/pull/17506/hovercard">#17506</a>)</li>
<li>ci(deps): bump actions/checkout from 4 to 5 (<a
href="https://redirect.github.com/getsentry/sentry-javascript/pull/17505"
data-hovercard-type="pull_request"
data-hovercard-url="/getsentry/sentry-javascript/pull/17505/hovercard">#17505</a>)</li>
<li>ci(deps): bump actions/create-github-app-token from 2.0.6 to 2.1.1
(<a
href="https://redirect.github.com/getsentry/sentry-javascript/pull/17504"
data-hovercard-type="pull_request"
data-hovercard-url="/getsentry/sentry-javascript/pull/17504/hovercard">#17504</a>)</li>
<li>test(aws): Improve reliability on CI (<a
href="https://redirect.github.com/getsentry/sentry-javascript/pull/17502"
data-hovercard-type="pull_request"
data-hovercard-url="/getsentry/sentry-javascript/pull/17502/hovercard">#17502</a>)</li>
</ul>
</details>
<h2>Bundle size 📦</h2>
<table>
<thead>
<tr>
<th>Path</th>
<th>Size</th>
</tr>
</thead>
<tbody>
<tr>
<td>@ sentry/browser</td>
<td>23.59 KB</td>
</tr>
<tr>
<td>@ sentry/browser - with treeshaking flags</td>
<td>22.2 KB</td>
</tr>
<tr>
<td>@ sentry/browser (incl. Tracing)</td>
<td>38.93 KB</td>
</tr>
<tr>
<td>@ sentry/browser (incl. Tracing, Replay)</td>
<td>76.4 KB</td>
</tr>
<tr>
<td>@ sentry/browser (incl. Tracing, Replay) - with treeshaking
flags</td>
<td>66.43 KB</td>
</tr>
<tr>
<td>@ sentry/browser (incl. Tracing, Replay with Canvas)</td>
<td>80.97 KB</td>
</tr>
<tr>
<td>@ sentry/browser (incl. Tracing, Replay, Feedback)</td>
<td>92.81 KB</td>
</tr>
<tr>
<td>@ sentry/browser (incl. Feedback)</td>
<td>39.88 KB</td>
</tr>
<tr>
<td>@ sentry/browser (incl. sendFeedback)</td>
<td>28.13 KB</td>
</tr>
<tr>
<td>@ sentry/browser (incl. FeedbackAsync)</td>
<td>32.92 KB</td>
</tr>
<tr>
<td>@ sentry/react</td>
<td>25.27 KB</td>
</tr>
<tr>
<td>@ sentry/react (incl. Tracing)</td>
<td>40.91 KB</td>
</tr>
<tr>
<td>@ sentry/vue</td>
<td>27.97 KB</td>
</tr>
<tr>
<td>@ sentry/vue (incl. Tracing)</td>
<td>40.72 KB</td>
</tr>
<tr>
<td>@ sentry/svelte</td>
<td>23.62 KB</td>
</tr>
<tr>
<td>CDN Bundle</td>
<td>25.06 KB</td>
</tr>
<tr>
<td>CDN Bundle (incl. Tracing)</td>
<td>38.82 KB</td>
</tr>
<tr>
<td>CDN Bundle (incl. Tracing, Replay)</td>
<td>74.25 KB</td>
</tr>
<tr>
<td>CDN Bundle (incl. Tracing, Replay, Feedback)</td>
<td>79.56 KB</td>
</tr>
<tr>
<td>CDN Bundle - uncompressed</td>
<td>73.2 KB</td>
</tr>
<tr>
<td>CDN Bundle (incl. Tracing) - uncompressed</td>
<td>114.83 KB</td>
</tr>
<tr>
<td>CDN Bundle (incl. Tracing, Replay) - uncompressed</td>
<td>227.23 KB</td>
</tr>
<tr>
<td>CDN Bundle (incl. Tracing, Replay, Feedback) - uncompressed</td>
<td>239.56 KB</td>
</tr>
<tr>
<td>@ sentry/nextjs (client)</td>
<td>42.86 KB</td>
</tr>
<tr>
<td>@ sentry/sveltekit (client)</td>
<td>39.38 KB</td>
</tr>
<tr>
<td>@ sentry/node-core</td>
<td>48.45 KB</td>
</tr>
<tr>
<td>@ sentry/node</td>
<td>146.74 KB</td>
</tr>
<tr>
<td>@ sentry/node - without tracing</td>
<td>90.02 KB</td>
</tr>
<tr>
<td>@ sentry/aws-serverless</td>
<td>103.01 KB</td>
</tr>
</tbody>
</table>
</li>
<li>
<b>10.8.0</b> - <a
href="https://redirect.github.com/getsentry/sentry-javascript/releases/tag/10.8.0">2025-08-29</a></br><h3>Important
Changes</h3>
<ul>
<li>
<p><strong>feat(sveltekit): Add Compatibility for builtin SvelteKit
Tracing (<a
href="https://redirect.github.com/getsentry/sentry-javascript/pull/17423"
data-hovercard-type="pull_request"
data-hovercard-url="/getsentry/sentry-javascript/pull/17423/hovercard">#17423</a>)</strong></p>
<p>This release makes the <code>@ sentry/sveltekit</code> SDK compatible
with SvelteKit's native <a
href="https://svelte.dev/docs/kit/observability"
rel="nofollow">observability support</a> introduced in SvelteKit version
<code>2.31.0</code>.<br>
If you enable both, instrumentation and tracing, the SDK will now
initialize early enough to set up additional instrumentation like
database queries and it will pick up spans emitted from SvelteKit.</p>
<p>We will follow up with docs how to set up the SDK soon.<br>
For now, If you're on SvelteKit version <code>2.31.0</code> or newer,
you can easily opt into the new feature:</p>
<ol>
<li>
<p>Enable <a href="https://svelte.dev/docs/kit/observability"
rel="nofollow">experimental tracing and instrumentation support</a> in
<code>svelte.config.js</code>:</p>
</li>
<li>
<p>Move your <code>Sentry.init()</code> call from
<code>src/hooks.server.(js|ts)</code> to the new
<code>instrumentation.server.(js|ts)</code> file:</p>
<div class="highlight highlight-source-ts notranslate position-relative
overflow-auto" data-snippet-clipboard-copy-content="//
instrumentation.server.ts
import * as Sentry from '@ sentry/sveltekit';
Sentry.init({
dsn: '...',
// rest of your config
});"><pre><span class="pl-c">// instrumentation.server.ts</span>
<span class="pl-k">import</span> <span class="pl-c1">*</span> <span
class="pl-k">as</span> <span class="pl-v">Sentry</span> <span
class="pl-k">from</span> <span class="pl-s">'@
sentry/sveltekit'</span><span class="pl-kos">;</span>
<span class="pl-v">Sentry</span><span class="pl-kos">.</span><span
class="pl-en">init</span><span class="pl-kos">(</span><span
class="pl-kos">{</span>
<span class="pl-c1">dsn</span>: <span class="pl-s">'...'</span><span
class="pl-kos">,</span>
<span class="pl-c">// rest of your config</span>
<span class="pl-kos">}</span><span class="pl-kos">)</span><span
class="pl-kos">;</span></pre></div>
<p>The rest of your Sentry config in <code>hooks.server.ts</code>
(<code>sentryHandle</code> and <code>handleErrorWithSentry</code>)
should stay the same.</p>
</li>
</ol>
<p>If you prefer to stay on the hooks-file based config for now, the SDK
will continue to work as previously.</p>
<p>Thanks to the Svelte team and <a class="user-mention notranslate"
data-hovercard-type="user"
data-hovercard-url="/users/elliott-with-the-longest-name-on-github/hovercard"
data-octo-click="hovercard-link-click"
data-octo-dimensions="link_type:self"
href="https://redirect.github.com/elliott-with-the-longest-name-on-github">@
elliott-with-the-longest-name-on-github</a> for implementing
observability support and for reviewing our PR!</p>
</li>
</ul>
<h3>Other Changes</h3>
<ul>
<li>fix(react): Avoid multiple name updates on navigation spans (<a
href="https://redirect.github.com/getsentry/sentry-javascript/pull/17438"
data-hovercard-type="pull_request"
data-hovercard-url="/getsentry/sentry-javascript/pull/17438/hovercard">#17438</a>)</li>
</ul>
<details>
<summary> <strong>Internal Changes</strong> </summary>
<ul>
<li>test(profiling): Add tests for current state of profiling (<a
href="https://redirect.github.com/getsentry/sentry-javascript/pull/17470"
data-hovercard-type="pull_request"
data-hovercard-url="/getsentry/sentry-javascript/pull/17470/hovercard">#17470</a>)</li>
</ul>
</details>
<h2>Bundle size 📦</h2>
<table>
<thead>
<tr>
<th>Path</th>
<th>Size</th>
</tr>
</thead>
<tbody>
<tr>
<td>@ sentry/browser</td>
<td>23.59 KB</td>
</tr>
<tr>
<td>@ sentry/browser - with treeshaking flags</td>
<td>22.2 KB</td>
</tr>
<tr>
<td>@ sentry/browser (incl. Tracing)</td>
<td>38.94 KB</td>
</tr>
<tr>
<td>@ sentry/browser (incl. Tracing, Replay)</td>
<td>76.4 KB</td>
</tr>
<tr>
<td>@ sentry/browser (incl. Tracing, Replay) - with treeshaking
flags</td>
<td>66.43 KB</td>
</tr>
<tr>
<td>@ sentry/browser (incl. Tracing, Replay with Canvas)</td>
<td>80.97 KB</td>
</tr>
<tr>
<td>@ sentry/browser (incl. Tracing, Replay, Feedback)</td>
<td>92.8 KB</td>
</tr>
<tr>
<td>@ sentry/browser (incl. Feedback)</td>
<td>39.88 KB</td>
</tr>
<tr>
<td>@ sentry/browser (incl. sendFeedback)</td>
<td>28.13 KB</td>
</tr>
<tr>
<td>@ sentry/browser (incl. FeedbackAsync)</td>
<td>32.92 KB</td>
</tr>
<tr>
<td>@ sentry/react</td>
<td>25.27 KB</td>
</tr>
<tr>
<td>@ sentry/react (incl. Tracing)</td>
<td>40.91 KB</td>
</tr>
<tr>
<td>@ sentry/vue</td>
<td>27.97 KB</td>
</tr>
<tr>
<td>@ sentry/vue (incl. Tracing)</td>
<td>40.72 KB</td>
</tr>
<tr>
<td>@ sentry/svelte</td>
<td>23.62 KB</td>
</tr>
<tr>
<td>CDN Bundle</td>
<td>25.06 KB</td>
</tr>
<tr>
<td>CDN Bundle (incl. Tracing)</td>
<td>38.82 KB</td>
</tr>
<tr>
<td>CDN Bundle (incl. Tracing, Replay)</td>
<td>74.24 KB</td>
</tr>
<tr>
<td>CDN Bundle (incl. Tracing, Replay, Feedback)</td>
<td>79.55 KB</td>
</tr>
<tr>
<td>CDN Bundle - uncompressed</td>
<td>73.2 KB</td>
</tr>
<tr>
<td>CDN Bundle (incl. Tracing) - uncompressed</td>
<td>114.83 KB</td>
</tr>
<tr>
<td>CDN Bundle (incl. Tracing, Replay) - uncompressed</td>
<td>227.23 KB</td>
</tr>
<tr>
<td>CDN Bundle (incl. Tracing, Replay, Feedback) - uncompressed</td>
<td>239.53 KB</td>
</tr>
<tr>
<td>@ sentry/nextjs (client)</td>
<td>42.86 KB</td>
</tr>
<tr>
<td>@ sentry/sveltekit (client)</td>
<td>39.38 KB</td>
</tr>
<tr>
<td>@ sentry/node-core</td>
<td>46.87 KB</td>
</tr>
<tr>
<td>@ sentry/node</td>
<td>145.75 KB</td>
</tr>
<tr>
<td>@ sentry/node - without tracing</td>
<td>90.08 KB</td>
</tr>
<tr>
<td>@ sentry/aws-serverless</td>
<td>102.45 KB</td>
</tr>
</tbody>
</table>
</li>
</ul>
from <a
href="https://redirect.github.com/getsentry/sentry-javascript/releases">@sentry/profiling-node
GitHub release notes</a>
</details>
</details>
---
> [!IMPORTANT]
>
> - Check the changes in this PR to ensure they won't cause issues with
your project.
> - This PR was automatically created by Snyk using the credentials of a
real user.
> - Max score is 1000. Note that the real score may have changed since
the PR was raised.
---
**Note:** _You are seeing this because you or someone else with access
to this repository has authorized Snyk to open upgrade PRs._
**For more information:** <img
src="https://api.segment.io/v1/pixel/track?data=eyJ3cml0ZUtleSI6InJyWmxZcEdHY2RyTHZsb0lYd0dUcVg4WkFRTnNCOUEwIiwiYW5vbnltb3VzSWQiOiI2MDhkOWU5ZS04ZDBlLTQ5N2EtYTNkZS1mMTVkYzU1YmNkNTciLCJldmVudCI6IlBSIHZpZXdlZCIsInByb3BlcnRpZXMiOnsicHJJZCI6IjYwOGQ5ZTllLThkMGUtNDk3YS1hM2RlLWYxNWRjNTViY2Q1NyJ9fQ=="
width="0" height="0"/>
> - 🧐 [View latest project
report](https://app.snyk.io/org/reisene/project/55e114f8-489e-4f14-b900-20574b041e59?utm_source&#x3D;github-cloud-app&amp;utm_medium&#x3D;referral&amp;page&#x3D;upgrade-pr)
> - 📜 [Customise PR
templates](https://docs.snyk.io/scan-using-snyk/pull-requests/snyk-fix-pull-or-merge-requests/customize-pr-templates?utm_source=&utm_content=fix-pr-template)
> - 🛠 [Adjust upgrade PR
settings](https://app.snyk.io/org/reisene/project/55e114f8-489e-4f14-b900-20574b041e59/settings/integration?utm_source&#x3D;github-cloud-app&amp;utm_medium&#x3D;referral&amp;page&#x3D;upgrade-pr)
> - 🔕 [Ignore this dependency or unsubscribe from future upgrade
PRs](https://app.snyk.io/org/reisene/project/55e114f8-489e-4f14-b900-20574b041e59/settings/integration?pkg&#x3D;@sentry/profiling-node&amp;utm_source&#x3D;github-cloud-app&amp;utm_medium&#x3D;referral&amp;page&#x3D;upgrade-pr#auto-dep-upgrades)
[//]: #
'snyk:metadata:{"customTemplate":{"variablesUsed":[],"fieldsUsed":[]},"dependencies":[{"name":"@sentry/profiling-node","from":"10.8.0","to":"10.9.0"}],"env":"prod","hasFixes":true,"isBreakingChange":false,"isMajorUpgrade":false,"issuesToFix":["SNYK-JS-BRACEEXPANSION-9789073","SNYK-JS-BRACEEXPANSION-9789073"],"prId":"608d9e9e-8d0e-497a-a3de-f15dc55bcd57","prPublicId":"608d9e9e-8d0e-497a-a3de-f15dc55bcd57","packageManager":"npm","priorityScoreList":[57],"projectPublicId":"55e114f8-489e-4f14-b900-20574b041e59","projectUrl":"https://app.snyk.io/org/reisene/project/55e114f8-489e-4f14-b900-20574b041e59?utm_source=github-cloud-app&utm_medium=referral&page=upgrade-pr","prType":"upgrade","templateFieldSources":{"branchName":"default","commitMessage":"default","description":"default","title":"default"},"templateVariants":["priorityScore"],"type":"auto","upgrade":["SNYK-JS-BRACEEXPANSION-9789073","SNYK-JS-BRACEEXPANSION-9789073"],"upgradeInfo":{"versionsDiff":1,"publishedDate":"2025-09-03T12:59:52.227Z"},"vulns":["SNYK-JS-BRACEEXPANSION-9789073","SNYK-JS-BRACEEXPANSION-9789073"]}'
onurtemizkan added a commit that referenced this pull request Feb 10, 2026
…es (#19086)
This PR will resolve the core reason for the series of fixes / handling
for automatic lazy-route resolution for a while.
Related: #18898,
#18881,
#18346,
#18155,
#18098,
#17962,
#17867,
#17438,
#17277
The core issue we have been trying to tackle is not having access to the
complete route hierarchy when asynchronously loaded lazy routes are
used. React Router provides a route manifest that we can use while
matching parameterized transaction names with routes in all cases except
this lazy-routes pattern.
This problem has been discussed on React Router:
- remix-run/react-router#11113
While this has been
[addressed](remix-run/react-router#11626) for
Remix / React Router (Framework Mode), it's still not available in
Library Mode. The manifest contains the lazily-loaded route, only when
it's navigated to. While waiting for navigation, our transactions can be
dropped for several reasons, such as user behaviour like switching tabs
(`document.hidden` guard), hitting timeouts like `idleTimeout`, and
potentially other reasons. This results in incomplete transaction naming
with leftover wildcards, which caused broken aggregation on the Sentry
dashboard.
The series of attempts to fix this while keeping automatic route
discovery has been prone to race conditions and required special-case
handling of each edge case scenario, also requiring a considerable
amount of internal logic, affecting our readability and performance. At
the end, all failed in giving completely robust and deterministic
results on the customers' side.
This PR proposes a new option: `lazyRouteManifest` specifically for lazy
routes. This will let us have initial information about the route
hierarchy. So we can assign correct parameterized transaction names
without needing to wait for navigated state.
It's a static array of routes in parameterized format (needs to be
maintained by the users on route hierarchy updates) like:
```ts
Sentry.reactRouterV7BrowserTracingIntegration({
// ...
enableAsyncRouteHandlers: true
lazyRouteManifest: [
'/',
'/pricing',
'/features',
'/login',
'/signup',
'/forgot-password',
'/reset-password/:token',
'/org/:orgSlug',
'/org/:orgSlug/dashboard',
'/org/:orgSlug/projects',
'/org/:orgSlug/projects/:projectId',
'/org/:orgSlug/projects/:projectId/settings',
'/org/:orgSlug/projects/:projectId/issues',
'/org/:orgSlug/projects/:projectId/issues/:issueId',
'/org/:orgSlug/team',
'/org/:orgSlug/team/:memberId',
'/org/:orgSlug/settings',
'/org/:orgSlug/billing',
'/admin',
'/admin/users',
'/admin/users/:userId',
'/admin/orgs',
'/admin/orgs/:orgId',
],
})
```
- This will only be active when `enableAsyncRouteHandlers` is set to
`true`
- To match URLs with given routes, we mimic React Router's own
implementation.
- When this is not provided or fails, it falls back to the current
behaviour
- This manifest is primarily for lazy routes, but the users can also add
their non-lazy routes here for convenience or consistency.
- Also added E2E tests that will fail when (if at some point) React
Router manifests include the lazy routes before navigation, so we'll be
aware and plan depending on that manifest instead.
- We can do a cleanup for the race-condition / edge-case handling part
of the code in a follow-up PR.
Closes#19090 (added automatically)
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.

3 participants

@onurtemizkan@chargome
, '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

fix(react): Avoid multiple name updates on navigation spans - #17438

Merged
chargome merged 16 commits into
developfrom
onur/react-router-multiple-name-updates
Aug 27, 2025
Merged

fix(react): Avoid multiple name updates on navigation spans#17438
chargome merged 16 commits into
developfrom
onur/react-router-multiple-name-updates

Conversation

@onurtemizkan

@onurtemizkanonurtemizkan commented Aug 21, 2025

Copy link
Copy Markdown
Contributor

This patch prevents name updates on navigation spans from being applied more than once.

This was fine and allowed for cross-usage of different instrumentation ways (such as instrumenting useRoutes and createBrowserRouter together), and didn't create any issues. But after adding support for lazy routes, it led to incorrect transaction names, especially when there's a navigation between two lazily-loaded routes.

While on it, I also had to do some refactoring to keep the code readable and maintainable, so now reactrouterv6-compat-utils is separated into 3 source files (instrumentation, common utils, and lazy routes specific functionality).

@onurtemizkan
onurtemizkanforce-pushed the onur/react-router-multiple-name-updates branch 4 times, most recently from aea2217 to 57c8b22CompareAugust 22, 2025 13:13
@github-actions

github-actionsBot commented Aug 22, 2025

Copy link
Copy Markdown
Contributor

size-limit report 📦

PathSize% ChangeChange
@sentry/browser24.16 kB--
@sentry/browser - with treeshaking flags22.73 kB--
@sentry/browser (incl. Tracing)39.87 kB--
@sentry/browser (incl. Tracing, Replay)78.23 kB--
@sentry/browser (incl. Tracing, Replay) - with treeshaking flags68.02 kB--
@sentry/browser (incl. Tracing, Replay with Canvas)82.91 kB--
@sentry/browser (incl. Tracing, Replay, Feedback)95.03 kB--
@sentry/browser (incl. Feedback)40.83 kB--
@sentry/browser (incl. sendFeedback)28.81 kB--
@sentry/browser (incl. FeedbackAsync)33.7 kB--
@sentry/react25.88 kB--
@sentry/react (incl. Tracing)41.89 kB+0.06%+23 B 🔺
@sentry/vue28.64 kB--
@sentry/vue (incl. Tracing)41.69 kB--
@sentry/svelte24.18 kB--
CDN Bundle25.66 kB--
CDN Bundle (incl. Tracing)39.75 kB--
CDN Bundle (incl. Tracing, Replay)76.03 kB--
CDN Bundle (incl. Tracing, Replay, Feedback)81.46 kB--
CDN Bundle - uncompressed74.96 kB--
CDN Bundle (incl. Tracing) - uncompressed117.59 kB--
CDN Bundle (incl. Tracing, Replay) - uncompressed232.68 kB--
CDN Bundle (incl. Tracing, Replay, Feedback) - uncompressed245.28 kB--
@sentry/nextjs (client)43.89 kB--
@sentry/sveltekit (client)40.32 kB--
@sentry/node-core47.99 kB-0.01%-1 B 🔽
@sentry/node149.25 kB--
@sentry/node - without tracing92.24 kB--
@sentry/aws-serverless104.91 kB+0.01%+1 B 🔺

View base workflow run

@onurtemizkan
onurtemizkanforce-pushed the onur/react-router-multiple-name-updates branch 4 times, most recently from 0e679dc to 27c5da6CompareAugust 27, 2025 00:18
@onurtemizkan
onurtemizkanforce-pushed the onur/react-router-multiple-name-updates branch from 8da7c27 to 453f5c6CompareAugust 27, 2025 07:29
@onurtemizkan
onurtemizkan marked this pull request as ready for review August 27, 2025 07:29
cursor[bot]

This comment was marked as outdated.

@onurtemizkan
onurtemizkanforce-pushed the onur/react-router-multiple-name-updates branch from 1d2839b to 8507984CompareAugust 27, 2025 08:16

CopilotAI 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.

Pull Request Overview

This PR refactors the React Router v6/v7 compatibility utilities to prevent multiple navigation span name updates and fix incorrect transaction names for lazy routes.

  • Refactors the reactrouterv6-compat-utils module into three separate files for better organization
  • Implements tracking to prevent duplicate navigation span name updates during navigation
  • Fixes transaction naming issues that occurred when navigating between lazy routes

Reviewed Changes

Copilot reviewed 16 out of 16 changed files in this pull request and generated 4 comments.

Show a summary per file
FileDescription
packages/react/test/reactrouterv6-compat-utils.test.tsxRemoves entire test file as functionality moved to new modules
packages/react/test/reactrouter-cross-usage.test.tsxRemoves assertions expecting multiple updateName calls since they're now prevented
packages/react/test/reactrouter-compat-utils/utils.test.tsAdds comprehensive tests for utility functions moved from old module
packages/react/test/reactrouter-compat-utils/lazy-routes.test.tsAdds tests for lazy route handling functionality
packages/react/test/reactrouter-compat-utils/instrumentation.test.tsxAdds tests for instrumentation-specific functionality
packages/react/src/reactrouterv7.tsxUpdates import path to new module structure
packages/react/src/reactrouterv6.tsxUpdates import path to new module structure
packages/react/src/reactrouter-compat-utils/utils.tsNew utility functions module with core router utilities
packages/react/src/reactrouter-compat-utils/lazy-routes.tsxNew module for lazy route handling functionality
packages/react/src/reactrouter-compat-utils/instrumentation.tsxNew main instrumentation module with navigation span tracking
packages/react/src/reactrouter-compat-utils/index.tsNew index file exporting all functionality from sub-modules
dev-packages/e2e-tests/test-applications/react-router-7-lazy-routes/tests/transactions.test.tsAdds tests for navigation between lazy routes
dev-packages/e2e-tests/test-applications/react-router-7-lazy-routes/src/pages/InnerLazyRoutes.tsxAdds navigation link to another lazy route
dev-packages/e2e-tests/test-applications/react-router-7-lazy-routes/src/pages/Index.tsxAdds navigation links to lazy routes
dev-packages/e2e-tests/test-applications/react-router-7-lazy-routes/src/pages/AnotherLazyRoutes.tsxAdds new lazy route component with navigation links
dev-packages/e2e-tests/test-applications/react-router-7-lazy-routes/src/index.tsxAdds another lazy route configuration

Tip: Customize your code reviews with copilot-instructions.md. Create the file or learn how to get started.

Comment threadpackages/react/src/reactrouter-compat-utils/instrumentation.tsx Outdated
Comment threadpackages/react/src/reactrouter-compat-utils/instrumentation.tsx Outdated
Comment threadpackages/react/src/reactrouter-compat-utils/utils.ts Outdated
@onurtemizkan
onurtemizkanforce-pushed the onur/react-router-multiple-name-updates branch from 1431408 to 60a9d7cCompareAugust 27, 2025 09:34

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

Phew big change – Did not review all the tests in detail but looks good 🚀

Comment threadpackages/react/src/reactrouter-compat-utils/instrumentation.tsx Outdated
Comment threadpackages/react/src/reactrouter-compat-utils/lazy-routes.tsx Outdated
Comment threadpackages/react/src/reactrouter-compat-utils/index.ts
@chargomechargome self-assigned this Aug 27, 2025
@chargome

Copy link
Copy Markdown
Member

@onurtemizkan Added some minor things myself so I can release that tomorrow, thanks for the refactor!

@chargome
chargome merged commit 895b385 into developAug 27, 2025
319 of 323 checks passed
@chargome
chargome deleted the onur/react-router-multiple-name-updates branch August 27, 2025 20:35
s1gr1d added a commit that referenced this pull request Sep 9, 2025
Removes recently introduced special-casing lazy-route -> lazy-route
transaction name updates.
This completes the fix in #17438.
E2E tests are updated to replicate a similar case in the reproduction
here: #17417
Also manually tested on the reproduction.
---------
Co-authored-by: Sigrid Huemer <32902192+s1gr1d@users.noreply.github.com>
mergifyBot added a commit to reisene/HulajDusza-serwis that referenced this pull request Sep 29, 2025
![snyk-io[bot]](https://badgen.net/badge/icon/snyk-io%5Bbot%5D/green?label=)
![Contributor](https://badgen.net/badge/icon/Contributor/000000?label=)
[<img width="16" alt="Powered by Pull Request Badge"
src="https://user-images.githubusercontent.com/1393946/111216524-d2bb8e00-85d4-11eb-821b-ed4c00989c02.png">](https://pullrequestbadge.com/?utm_medium=github&utm_source=reisene&utm_campaign=badge_info)<!--
PR-BADGE: PLEASE DO NOT REMOVE THIS COMMENT -->
![snyk-top-banner](https://res.cloudinary.com/snyk/image/upload/r-d/scm-platform/snyk-pull-requests/pr-banner-default.svg)
<h3>Snyk has created this PR to upgrade @sentry/profiling-node from
10.8.0 to 10.9.0.</h3>
:information_source: Keep your dependencies up-to-date. This makes it
easier to fix existing vulnerabilities and to more quickly identify and
fix newly disclosed vulnerabilities when they affect your project.
<hr/>
- The recommended version is **1 version** ahead of your current
version.
- The recommended version was released **22 days ago**.
#### Issues fixed by the recommended upgrade:
| | Issue | Score | Exploit Maturity |
:-------------------------:|:-------------------------|:-------------------------|:-------------------------
![low
severity](https://res.cloudinary.com/snyk/image/upload/r-d/scm-platform/snyk-pull-requests//severity-low.svg
'low severity') | Regular Expression Denial of Service
(ReDoS)<br/>[SNYK-JS-BRACEEXPANSION-9789073](https://snyk.io/vuln/SNYK-JS-BRACEEXPANSION-9789073)
| **57** | Proof of Concept
![low
severity](https://res.cloudinary.com/snyk/image/upload/r-d/scm-platform/snyk-pull-requests//severity-low.svg
'low severity') | Regular Expression Denial of Service
(ReDoS)<br/>[SNYK-JS-BRACEEXPANSION-9789073](https://snyk.io/vuln/SNYK-JS-BRACEEXPANSION-9789073)
| **57** | Proof of Concept
<details>
<summary><b>Release notes</b></summary>
<br/>
<details>
<summary>Package name: <b>@sentry/profiling-node</b></summary>
<ul>
<li>
<b>10.9.0</b> - <a
href="https://redirect.github.com/getsentry/sentry-javascript/releases/tag/10.9.0">2025-09-03</a></br><h3>Important
Changes</h3>
<ul>
<li><strong>feat(node): Update <code>httpIntegration</code> handling of
incoming requests (<a
href="https://redirect.github.com/getsentry/sentry-javascript/pull/17371"
data-hovercard-type="pull_request"
data-hovercard-url="/getsentry/sentry-javascript/pull/17371/hovercard">#17371</a>)</strong></li>
</ul>
<p>This version updates the handling of the Node SDK of incoming
requests. Instead of relying on @ opentelemetry/instrumentation-http, we
now handle incoming request instrumentation internally, ensuring that we
can optimize performance as much as possible and avoid interop
problems.</p>
<p>This change should not affect you, unless you're relying on very
in-depth implementation details. Importantly, this also drops the
<code>_experimentalConfig</code> option of the integration - this will
no longer do anything.<br>
Finally, you can still pass
<code>instrumentation.{requestHook,responseHook,applyCustomAttributesOnSpan}</code>
options, but they are deprecated and will be removed in v11. Instead,
you can use the new <code>incomingRequestSpanHook</code> configuration
option if you want to adjust the incoming request span.</p>
<h3>Other Changes</h3>
<ul>
<li>feat(browser): Add replay.feedback CDN bundle (<a
href="https://redirect.github.com/getsentry/sentry-javascript/pull/17496"
data-hovercard-type="pull_request"
data-hovercard-url="/getsentry/sentry-javascript/pull/17496/hovercard">#17496</a>)</li>
<li>feat(browser): Export <code>sendFeedback</code> from CDN bundles (<a
href="https://redirect.github.com/getsentry/sentry-javascript/pull/17495"
data-hovercard-type="pull_request"
data-hovercard-url="/getsentry/sentry-javascript/pull/17495/hovercard">#17495</a>)</li>
<li>fix(astro): Ensure span name from <code>beforeStartSpan</code> isn't
overwritten (<a
href="https://redirect.github.com/getsentry/sentry-javascript/pull/17500"
data-hovercard-type="pull_request"
data-hovercard-url="/getsentry/sentry-javascript/pull/17500/hovercard">#17500</a>)</li>
<li>fix(browser): Ensure source is set correctly when updating span name
in-place in <code>beforeStartSpan</code> (<a
href="https://redirect.github.com/getsentry/sentry-javascript/pull/17501"
data-hovercard-type="pull_request"
data-hovercard-url="/getsentry/sentry-javascript/pull/17501/hovercard">#17501</a>)</li>
<li>fix(core): Only set template attributes on logs if parameters exist
(<a
href="https://redirect.github.com/getsentry/sentry-javascript/pull/17480"
data-hovercard-type="pull_request"
data-hovercard-url="/getsentry/sentry-javascript/pull/17480/hovercard">#17480</a>)</li>
<li>fix(nextjs): Fix parameterization for root catchall routes (<a
href="https://redirect.github.com/getsentry/sentry-javascript/pull/17489"
data-hovercard-type="pull_request"
data-hovercard-url="/getsentry/sentry-javascript/pull/17489/hovercard">#17489</a>)</li>
<li>fix(node-core): Shut down OTel TraceProvider when calling
<code>Sentry.close()</code> (<a
href="https://redirect.github.com/getsentry/sentry-javascript/pull/17499"
data-hovercard-type="pull_request"
data-hovercard-url="/getsentry/sentry-javascript/pull/17499/hovercard">#17499</a>)</li>
</ul>
<details>
<summary> <strong>Internal Changes</strong> </summary>
<ul>
<li>chore: Add <code>changelog</code> script back to package.json (<a
href="https://redirect.github.com/getsentry/sentry-javascript/pull/17517"
data-hovercard-type="pull_request"
data-hovercard-url="/getsentry/sentry-javascript/pull/17517/hovercard">#17517</a>)</li>
<li>chore: Ensure prettier is run on all files (<a
href="https://redirect.github.com/getsentry/sentry-javascript/pull/17497"
data-hovercard-type="pull_request"
data-hovercard-url="/getsentry/sentry-javascript/pull/17497/hovercard">#17497</a>)</li>
<li>chore: Ignore prettier commit for git blame (<a
href="https://redirect.github.com/getsentry/sentry-javascript/pull/17498"
data-hovercard-type="pull_request"
data-hovercard-url="/getsentry/sentry-javascript/pull/17498/hovercard">#17498</a>)</li>
<li>chore: Remove experimental from Nuxt SDK package description (<a
href="https://redirect.github.com/getsentry/sentry-javascript/pull/17483"
data-hovercard-type="pull_request"
data-hovercard-url="/getsentry/sentry-javascript/pull/17483/hovercard">#17483</a>)</li>
<li>ci: Capture overhead in node app (<a
href="https://redirect.github.com/getsentry/sentry-javascript/pull/17420"
data-hovercard-type="pull_request"
data-hovercard-url="/getsentry/sentry-javascript/pull/17420/hovercard">#17420</a>)</li>
<li>ci: Ensure we fail on cancelled jobs (<a
href="https://redirect.github.com/getsentry/sentry-javascript/pull/17506"
data-hovercard-type="pull_request"
data-hovercard-url="/getsentry/sentry-javascript/pull/17506/hovercard">#17506</a>)</li>
<li>ci(deps): bump actions/checkout from 4 to 5 (<a
href="https://redirect.github.com/getsentry/sentry-javascript/pull/17505"
data-hovercard-type="pull_request"
data-hovercard-url="/getsentry/sentry-javascript/pull/17505/hovercard">#17505</a>)</li>
<li>ci(deps): bump actions/create-github-app-token from 2.0.6 to 2.1.1
(<a
href="https://redirect.github.com/getsentry/sentry-javascript/pull/17504"
data-hovercard-type="pull_request"
data-hovercard-url="/getsentry/sentry-javascript/pull/17504/hovercard">#17504</a>)</li>
<li>test(aws): Improve reliability on CI (<a
href="https://redirect.github.com/getsentry/sentry-javascript/pull/17502"
data-hovercard-type="pull_request"
data-hovercard-url="/getsentry/sentry-javascript/pull/17502/hovercard">#17502</a>)</li>
</ul>
</details>
<h2>Bundle size 📦</h2>
<table>
<thead>
<tr>
<th>Path</th>
<th>Size</th>
</tr>
</thead>
<tbody>
<tr>
<td>@ sentry/browser</td>
<td>23.59 KB</td>
</tr>
<tr>
<td>@ sentry/browser - with treeshaking flags</td>
<td>22.2 KB</td>
</tr>
<tr>
<td>@ sentry/browser (incl. Tracing)</td>
<td>38.93 KB</td>
</tr>
<tr>
<td>@ sentry/browser (incl. Tracing, Replay)</td>
<td>76.4 KB</td>
</tr>
<tr>
<td>@ sentry/browser (incl. Tracing, Replay) - with treeshaking
flags</td>
<td>66.43 KB</td>
</tr>
<tr>
<td>@ sentry/browser (incl. Tracing, Replay with Canvas)</td>
<td>80.97 KB</td>
</tr>
<tr>
<td>@ sentry/browser (incl. Tracing, Replay, Feedback)</td>
<td>92.81 KB</td>
</tr>
<tr>
<td>@ sentry/browser (incl. Feedback)</td>
<td>39.88 KB</td>
</tr>
<tr>
<td>@ sentry/browser (incl. sendFeedback)</td>
<td>28.13 KB</td>
</tr>
<tr>
<td>@ sentry/browser (incl. FeedbackAsync)</td>
<td>32.92 KB</td>
</tr>
<tr>
<td>@ sentry/react</td>
<td>25.27 KB</td>
</tr>
<tr>
<td>@ sentry/react (incl. Tracing)</td>
<td>40.91 KB</td>
</tr>
<tr>
<td>@ sentry/vue</td>
<td>27.97 KB</td>
</tr>
<tr>
<td>@ sentry/vue (incl. Tracing)</td>
<td>40.72 KB</td>
</tr>
<tr>
<td>@ sentry/svelte</td>
<td>23.62 KB</td>
</tr>
<tr>
<td>CDN Bundle</td>
<td>25.06 KB</td>
</tr>
<tr>
<td>CDN Bundle (incl. Tracing)</td>
<td>38.82 KB</td>
</tr>
<tr>
<td>CDN Bundle (incl. Tracing, Replay)</td>
<td>74.25 KB</td>
</tr>
<tr>
<td>CDN Bundle (incl. Tracing, Replay, Feedback)</td>
<td>79.56 KB</td>
</tr>
<tr>
<td>CDN Bundle - uncompressed</td>
<td>73.2 KB</td>
</tr>
<tr>
<td>CDN Bundle (incl. Tracing) - uncompressed</td>
<td>114.83 KB</td>
</tr>
<tr>
<td>CDN Bundle (incl. Tracing, Replay) - uncompressed</td>
<td>227.23 KB</td>
</tr>
<tr>
<td>CDN Bundle (incl. Tracing, Replay, Feedback) - uncompressed</td>
<td>239.56 KB</td>
</tr>
<tr>
<td>@ sentry/nextjs (client)</td>
<td>42.86 KB</td>
</tr>
<tr>
<td>@ sentry/sveltekit (client)</td>
<td>39.38 KB</td>
</tr>
<tr>
<td>@ sentry/node-core</td>
<td>48.45 KB</td>
</tr>
<tr>
<td>@ sentry/node</td>
<td>146.74 KB</td>
</tr>
<tr>
<td>@ sentry/node - without tracing</td>
<td>90.02 KB</td>
</tr>
<tr>
<td>@ sentry/aws-serverless</td>
<td>103.01 KB</td>
</tr>
</tbody>
</table>
</li>
<li>
<b>10.8.0</b> - <a
href="https://redirect.github.com/getsentry/sentry-javascript/releases/tag/10.8.0">2025-08-29</a></br><h3>Important
Changes</h3>
<ul>
<li>
<p><strong>feat(sveltekit): Add Compatibility for builtin SvelteKit
Tracing (<a
href="https://redirect.github.com/getsentry/sentry-javascript/pull/17423"
data-hovercard-type="pull_request"
data-hovercard-url="/getsentry/sentry-javascript/pull/17423/hovercard">#17423</a>)</strong></p>
<p>This release makes the <code>@ sentry/sveltekit</code> SDK compatible
with SvelteKit's native <a
href="https://svelte.dev/docs/kit/observability"
rel="nofollow">observability support</a> introduced in SvelteKit version
<code>2.31.0</code>.<br>
If you enable both, instrumentation and tracing, the SDK will now
initialize early enough to set up additional instrumentation like
database queries and it will pick up spans emitted from SvelteKit.</p>
<p>We will follow up with docs how to set up the SDK soon.<br>
For now, If you're on SvelteKit version <code>2.31.0</code> or newer,
you can easily opt into the new feature:</p>
<ol>
<li>
<p>Enable <a href="https://svelte.dev/docs/kit/observability"
rel="nofollow">experimental tracing and instrumentation support</a> in
<code>svelte.config.js</code>:</p>
</li>
<li>
<p>Move your <code>Sentry.init()</code> call from
<code>src/hooks.server.(js|ts)</code> to the new
<code>instrumentation.server.(js|ts)</code> file:</p>
<div class="highlight highlight-source-ts notranslate position-relative
overflow-auto" data-snippet-clipboard-copy-content="//
instrumentation.server.ts
import * as Sentry from '@ sentry/sveltekit';
Sentry.init({
dsn: '...',
// rest of your config
});"><pre><span class="pl-c">// instrumentation.server.ts</span>
<span class="pl-k">import</span> <span class="pl-c1">*</span> <span
class="pl-k">as</span> <span class="pl-v">Sentry</span> <span
class="pl-k">from</span> <span class="pl-s">'@
sentry/sveltekit'</span><span class="pl-kos">;</span>
<span class="pl-v">Sentry</span><span class="pl-kos">.</span><span
class="pl-en">init</span><span class="pl-kos">(</span><span
class="pl-kos">{</span>
<span class="pl-c1">dsn</span>: <span class="pl-s">'...'</span><span
class="pl-kos">,</span>
<span class="pl-c">// rest of your config</span>
<span class="pl-kos">}</span><span class="pl-kos">)</span><span
class="pl-kos">;</span></pre></div>
<p>The rest of your Sentry config in <code>hooks.server.ts</code>
(<code>sentryHandle</code> and <code>handleErrorWithSentry</code>)
should stay the same.</p>
</li>
</ol>
<p>If you prefer to stay on the hooks-file based config for now, the SDK
will continue to work as previously.</p>
<p>Thanks to the Svelte team and <a class="user-mention notranslate"
data-hovercard-type="user"
data-hovercard-url="/users/elliott-with-the-longest-name-on-github/hovercard"
data-octo-click="hovercard-link-click"
data-octo-dimensions="link_type:self"
href="https://redirect.github.com/elliott-with-the-longest-name-on-github">@
elliott-with-the-longest-name-on-github</a> for implementing
observability support and for reviewing our PR!</p>
</li>
</ul>
<h3>Other Changes</h3>
<ul>
<li>fix(react): Avoid multiple name updates on navigation spans (<a
href="https://redirect.github.com/getsentry/sentry-javascript/pull/17438"
data-hovercard-type="pull_request"
data-hovercard-url="/getsentry/sentry-javascript/pull/17438/hovercard">#17438</a>)</li>
</ul>
<details>
<summary> <strong>Internal Changes</strong> </summary>
<ul>
<li>test(profiling): Add tests for current state of profiling (<a
href="https://redirect.github.com/getsentry/sentry-javascript/pull/17470"
data-hovercard-type="pull_request"
data-hovercard-url="/getsentry/sentry-javascript/pull/17470/hovercard">#17470</a>)</li>
</ul>
</details>
<h2>Bundle size 📦</h2>
<table>
<thead>
<tr>
<th>Path</th>
<th>Size</th>
</tr>
</thead>
<tbody>
<tr>
<td>@ sentry/browser</td>
<td>23.59 KB</td>
</tr>
<tr>
<td>@ sentry/browser - with treeshaking flags</td>
<td>22.2 KB</td>
</tr>
<tr>
<td>@ sentry/browser (incl. Tracing)</td>
<td>38.94 KB</td>
</tr>
<tr>
<td>@ sentry/browser (incl. Tracing, Replay)</td>
<td>76.4 KB</td>
</tr>
<tr>
<td>@ sentry/browser (incl. Tracing, Replay) - with treeshaking
flags</td>
<td>66.43 KB</td>
</tr>
<tr>
<td>@ sentry/browser (incl. Tracing, Replay with Canvas)</td>
<td>80.97 KB</td>
</tr>
<tr>
<td>@ sentry/browser (incl. Tracing, Replay, Feedback)</td>
<td>92.8 KB</td>
</tr>
<tr>
<td>@ sentry/browser (incl. Feedback)</td>
<td>39.88 KB</td>
</tr>
<tr>
<td>@ sentry/browser (incl. sendFeedback)</td>
<td>28.13 KB</td>
</tr>
<tr>
<td>@ sentry/browser (incl. FeedbackAsync)</td>
<td>32.92 KB</td>
</tr>
<tr>
<td>@ sentry/react</td>
<td>25.27 KB</td>
</tr>
<tr>
<td>@ sentry/react (incl. Tracing)</td>
<td>40.91 KB</td>
</tr>
<tr>
<td>@ sentry/vue</td>
<td>27.97 KB</td>
</tr>
<tr>
<td>@ sentry/vue (incl. Tracing)</td>
<td>40.72 KB</td>
</tr>
<tr>
<td>@ sentry/svelte</td>
<td>23.62 KB</td>
</tr>
<tr>
<td>CDN Bundle</td>
<td>25.06 KB</td>
</tr>
<tr>
<td>CDN Bundle (incl. Tracing)</td>
<td>38.82 KB</td>
</tr>
<tr>
<td>CDN Bundle (incl. Tracing, Replay)</td>
<td>74.24 KB</td>
</tr>
<tr>
<td>CDN Bundle (incl. Tracing, Replay, Feedback)</td>
<td>79.55 KB</td>
</tr>
<tr>
<td>CDN Bundle - uncompressed</td>
<td>73.2 KB</td>
</tr>
<tr>
<td>CDN Bundle (incl. Tracing) - uncompressed</td>
<td>114.83 KB</td>
</tr>
<tr>
<td>CDN Bundle (incl. Tracing, Replay) - uncompressed</td>
<td>227.23 KB</td>
</tr>
<tr>
<td>CDN Bundle (incl. Tracing, Replay, Feedback) - uncompressed</td>
<td>239.53 KB</td>
</tr>
<tr>
<td>@ sentry/nextjs (client)</td>
<td>42.86 KB</td>
</tr>
<tr>
<td>@ sentry/sveltekit (client)</td>
<td>39.38 KB</td>
</tr>
<tr>
<td>@ sentry/node-core</td>
<td>46.87 KB</td>
</tr>
<tr>
<td>@ sentry/node</td>
<td>145.75 KB</td>
</tr>
<tr>
<td>@ sentry/node - without tracing</td>
<td>90.08 KB</td>
</tr>
<tr>
<td>@ sentry/aws-serverless</td>
<td>102.45 KB</td>
</tr>
</tbody>
</table>
</li>
</ul>
from <a
href="https://redirect.github.com/getsentry/sentry-javascript/releases">@sentry/profiling-node
GitHub release notes</a>
</details>
</details>
---
> [!IMPORTANT]
>
> - Check the changes in this PR to ensure they won't cause issues with
your project.
> - This PR was automatically created by Snyk using the credentials of a
real user.
> - Max score is 1000. Note that the real score may have changed since
the PR was raised.
---
**Note:** _You are seeing this because you or someone else with access
to this repository has authorized Snyk to open upgrade PRs._
**For more information:** <img
src="https://api.segment.io/v1/pixel/track?data=eyJ3cml0ZUtleSI6InJyWmxZcEdHY2RyTHZsb0lYd0dUcVg4WkFRTnNCOUEwIiwiYW5vbnltb3VzSWQiOiI2MDhkOWU5ZS04ZDBlLTQ5N2EtYTNkZS1mMTVkYzU1YmNkNTciLCJldmVudCI6IlBSIHZpZXdlZCIsInByb3BlcnRpZXMiOnsicHJJZCI6IjYwOGQ5ZTllLThkMGUtNDk3YS1hM2RlLWYxNWRjNTViY2Q1NyJ9fQ=="
width="0" height="0"/>
> - 🧐 [View latest project
report](https://app.snyk.io/org/reisene/project/55e114f8-489e-4f14-b900-20574b041e59?utm_source&#x3D;github-cloud-app&amp;utm_medium&#x3D;referral&amp;page&#x3D;upgrade-pr)
> - 📜 [Customise PR
templates](https://docs.snyk.io/scan-using-snyk/pull-requests/snyk-fix-pull-or-merge-requests/customize-pr-templates?utm_source=&utm_content=fix-pr-template)
> - 🛠 [Adjust upgrade PR
settings](https://app.snyk.io/org/reisene/project/55e114f8-489e-4f14-b900-20574b041e59/settings/integration?utm_source&#x3D;github-cloud-app&amp;utm_medium&#x3D;referral&amp;page&#x3D;upgrade-pr)
> - 🔕 [Ignore this dependency or unsubscribe from future upgrade
PRs](https://app.snyk.io/org/reisene/project/55e114f8-489e-4f14-b900-20574b041e59/settings/integration?pkg&#x3D;@sentry/profiling-node&amp;utm_source&#x3D;github-cloud-app&amp;utm_medium&#x3D;referral&amp;page&#x3D;upgrade-pr#auto-dep-upgrades)
[//]: #
'snyk:metadata:{"customTemplate":{"variablesUsed":[],"fieldsUsed":[]},"dependencies":[{"name":"@sentry/profiling-node","from":"10.8.0","to":"10.9.0"}],"env":"prod","hasFixes":true,"isBreakingChange":false,"isMajorUpgrade":false,"issuesToFix":["SNYK-JS-BRACEEXPANSION-9789073","SNYK-JS-BRACEEXPANSION-9789073"],"prId":"608d9e9e-8d0e-497a-a3de-f15dc55bcd57","prPublicId":"608d9e9e-8d0e-497a-a3de-f15dc55bcd57","packageManager":"npm","priorityScoreList":[57],"projectPublicId":"55e114f8-489e-4f14-b900-20574b041e59","projectUrl":"https://app.snyk.io/org/reisene/project/55e114f8-489e-4f14-b900-20574b041e59?utm_source=github-cloud-app&utm_medium=referral&page=upgrade-pr","prType":"upgrade","templateFieldSources":{"branchName":"default","commitMessage":"default","description":"default","title":"default"},"templateVariants":["priorityScore"],"type":"auto","upgrade":["SNYK-JS-BRACEEXPANSION-9789073","SNYK-JS-BRACEEXPANSION-9789073"],"upgradeInfo":{"versionsDiff":1,"publishedDate":"2025-09-03T12:59:52.227Z"},"vulns":["SNYK-JS-BRACEEXPANSION-9789073","SNYK-JS-BRACEEXPANSION-9789073"]}'
onurtemizkan added a commit that referenced this pull request Feb 10, 2026
…es (#19086)
This PR will resolve the core reason for the series of fixes / handling
for automatic lazy-route resolution for a while.
Related: #18898,
#18881,
#18346,
#18155,
#18098,
#17962,
#17867,
#17438,
#17277
The core issue we have been trying to tackle is not having access to the
complete route hierarchy when asynchronously loaded lazy routes are
used. React Router provides a route manifest that we can use while
matching parameterized transaction names with routes in all cases except
this lazy-routes pattern.
This problem has been discussed on React Router:
- remix-run/react-router#11113
While this has been
[addressed](remix-run/react-router#11626) for
Remix / React Router (Framework Mode), it's still not available in
Library Mode. The manifest contains the lazily-loaded route, only when
it's navigated to. While waiting for navigation, our transactions can be
dropped for several reasons, such as user behaviour like switching tabs
(`document.hidden` guard), hitting timeouts like `idleTimeout`, and
potentially other reasons. This results in incomplete transaction naming
with leftover wildcards, which caused broken aggregation on the Sentry
dashboard.
The series of attempts to fix this while keeping automatic route
discovery has been prone to race conditions and required special-case
handling of each edge case scenario, also requiring a considerable
amount of internal logic, affecting our readability and performance. At
the end, all failed in giving completely robust and deterministic
results on the customers' side.
This PR proposes a new option: `lazyRouteManifest` specifically for lazy
routes. This will let us have initial information about the route
hierarchy. So we can assign correct parameterized transaction names
without needing to wait for navigated state.
It's a static array of routes in parameterized format (needs to be
maintained by the users on route hierarchy updates) like:
```ts
Sentry.reactRouterV7BrowserTracingIntegration({
// ...
enableAsyncRouteHandlers: true
lazyRouteManifest: [
'/',
'/pricing',
'/features',
'/login',
'/signup',
'/forgot-password',
'/reset-password/:token',
'/org/:orgSlug',
'/org/:orgSlug/dashboard',
'/org/:orgSlug/projects',
'/org/:orgSlug/projects/:projectId',
'/org/:orgSlug/projects/:projectId/settings',
'/org/:orgSlug/projects/:projectId/issues',
'/org/:orgSlug/projects/:projectId/issues/:issueId',
'/org/:orgSlug/team',
'/org/:orgSlug/team/:memberId',
'/org/:orgSlug/settings',
'/org/:orgSlug/billing',
'/admin',
'/admin/users',
'/admin/users/:userId',
'/admin/orgs',
'/admin/orgs/:orgId',
],
})
```
- This will only be active when `enableAsyncRouteHandlers` is set to
`true`
- To match URLs with given routes, we mimic React Router's own
implementation.
- When this is not provided or fails, it falls back to the current
behaviour
- This manifest is primarily for lazy routes, but the users can also add
their non-lazy routes here for convenience or consistency.
- Also added E2E tests that will fail when (if at some point) React
Router manifests include the lazy routes before navigation, so we'll be
aware and plan depending on that manifest instead.
- We can do a cleanup for the race-condition / edge-case handling part
of the code in a follow-up PR.
Closes#19090 (added automatically)
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.

3 participants

@onurtemizkan@chargome