From 869060a8496287013ea4c6e5b929b731fd6fcff4 Mon Sep 17 00:00:00 2001
From: s1gr1d <32902192+s1gr1d@users.noreply.github.com>
Date: Fri, 25 Sep 2026 14:12:58 +0200
Subject: [PATCH] test(e2e): Add pageload connection test for cache component
 apps

---
 .../cacheOrigin-pageloadConnection.spec.ts    | 29 +++++++++++++++++++
 .../cacheOrigin-pageloadConnection.spec.ts    | 27 +++++++++++++++++
 2 files changed, 56 insertions(+)
 create mode 100644 dev-packages/e2e-tests/test-applications/nextjs-16-cacheComponents/tests/cacheOrigin-pageloadConnection.spec.ts
 create mode 100644 dev-packages/e2e-tests/test-applications/nextjs-16-streaming-cacheComponents/tests/cacheOrigin-pageloadConnection.spec.ts

diff --git a/dev-packages/e2e-tests/test-applications/nextjs-16-cacheComponents/tests/cacheOrigin-pageloadConnection.spec.ts b/dev-packages/e2e-tests/test-applications/nextjs-16-cacheComponents/tests/cacheOrigin-pageloadConnection.spec.ts
new file mode 100644
index 000000000000..64e09473f664
--- /dev/null
+++ b/dev-packages/e2e-tests/test-applications/nextjs-16-cacheComponents/tests/cacheOrigin-pageloadConnection.spec.ts
@@ -0,0 +1,29 @@
+import { expect, test } from '@playwright/test';
+import { waitForTransaction } from '@sentry-internal/test-utils';
+
+// The pageload should connect to the live serving request even though the shell is prerendered
+// (trace context can only travel in the dynamic/resumed part of the response, never in cacheable
+// HTML). The inverse assertion in cacheComponents.spec.ts ("Prerendered shell does not stitch
+// the pageload onto a stale trace") documents today's un-connectedness.
+test('connects the pageload trace to the live serving request', async ({ page }) => {
+  test.fail();
+
+  const serverTxPromise = waitForTransaction('nextjs-16-cacheComponents', transactionEvent => {
+    return (
+      transactionEvent.contexts?.trace?.op === 'http.server' && transactionEvent.transaction === 'GET /pageload-tracing'
+    );
+  });
+
+  const pageloadTxPromise = waitForTransaction('nextjs-16-cacheComponents', transactionEvent => {
+    return transactionEvent.contexts?.trace?.op === 'pageload' && transactionEvent.transaction === '/pageload-tracing';
+  });
+
+  await page.goto('/pageload-tracing');
+
+  await expect(page.locator('#todos-fetched')).toHaveText('Todos fetched: 5');
+
+  const [serverTx, pageloadTx] = await Promise.all([serverTxPromise, pageloadTxPromise]);
+
+  expect(serverTx.contexts?.trace?.trace_id).toBeTruthy();
+  expect(pageloadTx.contexts?.trace?.trace_id).toBe(serverTx.contexts?.trace?.trace_id);
+});
diff --git a/dev-packages/e2e-tests/test-applications/nextjs-16-streaming-cacheComponents/tests/cacheOrigin-pageloadConnection.spec.ts b/dev-packages/e2e-tests/test-applications/nextjs-16-streaming-cacheComponents/tests/cacheOrigin-pageloadConnection.spec.ts
new file mode 100644
index 000000000000..043502df913f
--- /dev/null
+++ b/dev-packages/e2e-tests/test-applications/nextjs-16-streaming-cacheComponents/tests/cacheOrigin-pageloadConnection.spec.ts
@@ -0,0 +1,27 @@
+import { expect, test } from '@playwright/test';
+import { getSpanOp, waitForStreamedSpan } from '@sentry-internal/test-utils';
+
+// The pageload should connect to the live serving request even though the shell is prerendered
+// (trace context can only travel in the dynamic/resumed part of the response, never in cacheable
+// HTML). The inverse assertion in cacheComponents.spec.ts ("Prerendered shell does not stitch
+// the pageload onto a stale trace") documents today's un-connectedness.
+test('connects the pageload trace to the live serving request', async ({ page }) => {
+  test.fail();
+
+  const serverSpanPromise = waitForStreamedSpan('nextjs-16-streaming-cacheComponents', span => {
+    return span.name === 'GET /pageload-tracing' && getSpanOp(span) === 'http.server' && span.is_segment;
+  });
+
+  const pageloadSpanPromise = waitForStreamedSpan('nextjs-16-streaming-cacheComponents', span => {
+    return span.name === '/pageload-tracing' && getSpanOp(span) === 'pageload' && span.is_segment;
+  });
+
+  await page.goto('/pageload-tracing');
+
+  await expect(page.locator('#todos-fetched')).toHaveText('Todos fetched: 5');
+
+  const [serverSpan, pageloadSpan] = await Promise.all([serverSpanPromise, pageloadSpanPromise]);
+
+  expect(serverSpan.trace_id).toBeTruthy();
+  expect(pageloadSpan.trace_id).toBe(serverSpan.trace_id);
+});