fix(react): Add POP guard for long-running pageload spans

[onurtemizkan]

This resolves the issue that occurs when an extra navigation transaction is created after a prematurely ended pageload transaction in React Router lazy routes.

This apparently occurs when there's a long-running pageload with lazy-routes (after fetching assets, there are multiple potentially long-running API calls happening).

This causes the pageload transaction to prematurely end, even before the fully parameterized transaction name is resolved. The reason is that there can be a POP event emitted, which we subscribe to create a navigation transaction. This ends the ongoing pageload transaction before its name is updated with a resolved parameterized route path, and starts a navigation transaction, which contains the remaining spans that were supposed to be a part of the pageload transaction.

This fix makes sure the initial POP events are not necessarily treated as navigation pointers, which should fix both:

• Duplicate / extra navigation transactions having a part of pageload spans.
• Remaining wildcards in the pageload transaction names

[chargome]

Nice find! Any way we can test this in e2e?

[github-actions]

node-overhead report 🧳

Note: This is a synthetic benchmark with a minimal express app and does not necessarily reflect the real-world performance impact in an application.

Scenario	Requests/s	% of Baseline	Prev. Requests/s	Change %
GET Baseline	9,373	-	8,903	+5%
GET With Sentry	1,378	15%	1,367	+1%
GET With Sentry (error only)	6,233	66%	6,204	+0%
POST Baseline	1,193	-	1,208	-1%
POST With Sentry	514	43%	526	-2%
POST With Sentry (error only)	1,068	90%	1,069	-0%
MYSQL Baseline	3,403	-	3,350	+2%
MYSQL With Sentry	511	15%	438	+17%
MYSQL With Sentry (error only)	2,810	83%	2,715	+3%

View base workflow run

[onurtemizkan]

@chargome - I updated the PR with edge case handling + E2E tests