test(browser): Register the LCP handlers in the bundle of the SDK

The handlers lived in the subject bundle, which got its own copy of the
instrumentation and so an LCP observer of its own. On Linux CI that copy
sometimes only ever saw the body candidate while the SDK's copy saw the
image, so the handler assertions failed on every run of some trees and
timed out in others. In the bundle of the SDK the handlers share its
observer and see exactly what the span reports.

Co-Authored-By: Claude Fable 5.1 <noreply@anthropic.com>

Author: chargome

dev-packages/browser-integration-tests/suites/tracing/metrics/handlers-lcp/init.js

@@ -0,0 +1,30 @@
+import * as Sentry from '@sentry/browser';
+import { addLcpInstrumentationHandler } from '@sentry/browser-utils';
+
+window.Sentry = Sentry;
+
+Sentry.init({
+  dsn: 'https://public@dsn.ingest.sentry.io/1337',
+  integrations: [Sentry.browserTracingIntegration()],
+  tracesSampleRate: 1,
+});
+
+// Registered in the bundle of the SDK, so the handlers share its LCP observer. A second bundle gets
+// a copy of the instrumentation with an observer of its own, whose view of the LCP candidates can
+// differ from the SDK's (e.g. a different first-hidden time), which made this test flaky.
+addLcpInstrumentationHandler(({ metric }) => {
+  const entry = metric.entries[metric.entries.length - 1];
+  window._LCP = entry.size;
+});
+
+addLcpInstrumentationHandler(({ metric }) => {
+  const entry = metric.entries[metric.entries.length - 1];
+  window._LCP2 = entry.size;
+});
+
+window.ADD_HANDLER = () => {
+  addLcpInstrumentationHandler(({ metric }) => {
+    const entry = metric.entries[metric.entries.length - 1];
+    window._LCP3 = entry.size;
+  });
+};

dev-packages/browser-integration-tests/suites/tracing/metrics/handlers-lcp/subject.js

@@ -1,18 +1 @@
-import { addLcpInstrumentationHandler } from '@sentry/browser-utils';
-
-addLcpInstrumentationHandler(({ metric }) => {
-  const entry = metric.entries[metric.entries.length - 1];
-  window._LCP = entry.size;
-});
-
-addLcpInstrumentationHandler(({ metric }) => {
-  const entry = metric.entries[metric.entries.length - 1];
-  window._LCP2 = entry.size;
-});
-
-window.ADD_HANDLER = () => {
-  addLcpInstrumentationHandler(({ metric }) => {
-    const entry = metric.entries[metric.entries.length - 1];
-    window._LCP3 = entry.size;
-  });
-};
+// The handlers live in `init.js`, see there.