Merge branch 'develop' into cg/fix-slow-test

Author: chargome

.github/workflows/build.yml

@@ -795,7 +795,8 @@ jobs:
     # - The build job was successful, not skipped
     # - AND if the profiling node bindings were either successful or skipped
     if: |
-      always() && needs.job_build.result == 'success' &&
+      always() &&
+      needs.job_build.result == 'success' &&
       (needs.job_compile_bindings_profiling_node.result == 'success' || needs.job_compile_bindings_profiling_node.result == 'skipped')
     needs: [job_get_metadata, job_build, job_compile_bindings_profiling_node]
     runs-on: ubuntu-20.04-large-js
@@ -981,13 +982,16 @@ jobs:
           directory: dev-packages/e2e-tests
           token: ${{ secrets.CODECOV_TOKEN }}
 
+  # - We skip optional tests on release branches
   job_optional_e2e_tests:
     name: E2E ${{ matrix.label || matrix.test-application }} Test
     # We only run E2E tests for non-fork PRs because the E2E tests require secrets to work and they can't be accessed from forks
     # We need to add the `always()` check here because the previous step has this as well :(
     # See: https://github.com/actions/runner/issues/2205
     if:
-      always() && needs.job_e2e_prepare.result == 'success' &&
+      always() &&
+      needs.job_get_metadata.outputs.is_release != 'true' &&
+      needs.job_e2e_prepare.result == 'success' &&
       needs.job_e2e_prepare.outputs.matrix-optional != '{"include":[]}' &&
       (github.event_name != 'pull_request' || github.event.pull_request.head.repo.full_name == github.repository) &&
       github.actor != 'dependabot[bot]'

dev-packages/browser-integration-tests/suites/feedback/attachTo/test.ts

@@ -23,7 +23,7 @@ sentryTest('should capture feedback with custom button', async ({ getLocalTestUr
     }
   });
 
-  const url = await getLocalTestUrl({ testDir: __dirname });
+  const url = await getLocalTestUrl({ testDir: __dirname, handleLazyLoadedFeedback: true });
 
   await page.goto(url);
   await page.locator('#custom-feedback-button').click();

dev-packages/browser-integration-tests/suites/feedback/captureFeedback/test.ts

@@ -23,7 +23,7 @@ sentryTest('should capture feedback', async ({ getLocalTestUrl, page }) => {
     }
   });
 
-  const url = await getLocalTestUrl({ testDir: __dirname });
+  const url = await getLocalTestUrl({ testDir: __dirname, handleLazyLoadedFeedback: true });
 
   await page.goto(url);
   await page.getByText('Report a Bug').click();

dev-packages/browser-integration-tests/suites/feedback/captureFeedbackAndReplay/hasSampling/test.ts

@@ -31,7 +31,7 @@ sentryTest('should capture feedback', async ({ forceFlushReplay, getLocalTestUrl
     }
   });
 
-  const url = await getLocalTestUrl({ testDir: __dirname });
+  const url = await getLocalTestUrl({ testDir: __dirname, handleLazyLoadedFeedback: true });
 
   await Promise.all([page.goto(url), page.getByText('Report a Bug').click(), reqPromise0]);
 

dev-packages/browser-integration-tests/suites/feedback/captureFeedbackCsp/test.ts

@@ -23,7 +23,7 @@ sentryTest('should capture feedback', async ({ getLocalTestUrl, page }) => {
     }
   });
 
-  const url = await getLocalTestUrl({ testDir: __dirname });
+  const url = await getLocalTestUrl({ testDir: __dirname, handleLazyLoadedFeedback: true });
 
   await page.goto(url);
   await page.getByText('Report a Bug').click();

dev-packages/browser-integration-tests/suites/integrations/lazyLoad/feedbackIntegration/test.ts

@@ -5,7 +5,7 @@ import { sentryTest } from '../../../../utils/fixtures';
 
 sentryTest('it allows to lazy load the feedback integration', async ({ getLocalTestUrl, page }) => {
   const bundle = process.env.PW_BUNDLE || '';
-  const url = await getLocalTestUrl({ testDir: __dirname });
+  const url = await getLocalTestUrl({ testDir: __dirname, handleLazyLoadedFeedback: true });
 
   await page.route(`https://browser.sentry-cdn.com/${SDK_VERSION}/feedback.min.js`, route => {
     return route.fulfill({

dev-packages/browser-integration-tests/suites/tracing/metrics/web-vitals-lcp/template.html

@@ -6,6 +6,5 @@
   <body>
     <div id="content"></div>
     <img src="https://example.com/my/image.png" />
-    <button type="button">Test button</button>
   </body>
 </html>

dev-packages/browser-integration-tests/suites/tracing/metrics/web-vitals-lcp/test.ts

@@ -5,7 +5,14 @@ import type { Event } from '@sentry/types';
 import { sentryTest } from '../../../../utils/fixtures';
 import { getFirstSentryEnvelopeRequest, shouldSkipTracingTest } from '../../../../utils/helpers';
 
-sentryTest('should capture a LCP vital with element details.', async ({ browserName, getLocalTestUrl, page }) => {
+/*
+  Because we "serve" the html test page as a static file, all requests for the image
+  are considered 3rd party requests. So the LCP value we obtain for the image is also
+  considered a 3rd party LCP value, meaning `renderTime` is only set if we also
+  return the `Timing-Allow-Origin` header.
+*/
+
+sentryTest('captures LCP vitals with element details.', async ({ browserName, getLocalTestUrl, page }) => {
   if (shouldSkipTracingTest() || browserName !== 'chromium') {
     sentryTest.skip();
   }
@@ -16,17 +23,50 @@ sentryTest('should capture a LCP vital with element details.', async ({ browserN
   });
 
   const url = await getLocalTestUrl({ testDir: __dirname });
-  const [eventData] = await Promise.all([
-    getFirstSentryEnvelopeRequest<Event>(page),
-    page.goto(url),
-    page.locator('button').click(),
-  ]);
+  const [eventData] = await Promise.all([getFirstSentryEnvelopeRequest<Event>(page), page.goto(url)]);
 
   expect(eventData.measurements).toBeDefined();
   expect(eventData.measurements?.lcp?.value).toBeDefined();
 
-  // XXX: This should be body > img, but it can be flakey as sometimes it will report
-  // the button as LCP.
   expect(eventData.contexts?.trace?.data?.['lcp.element'].startsWith('body >')).toBe(true);
   expect(eventData.contexts?.trace?.data?.['lcp.size']).toBeGreaterThan(0);
+  expect(eventData.contexts?.trace?.data?.['lcp.loadTime']).toBeGreaterThan(0);
+
+  // renderTime is 0 because we don't return the `Timing-Allow-Origin` header
+  // and the image is loaded from a 3rd party origin
+  expect(eventData.contexts?.trace?.data?.['lcp.renderTime']).toBe(0);
+
+  // The LCP value should be the loadTime because the renderTime is not set
+  expect(eventData.measurements?.lcp?.value).toBeCloseTo(eventData.contexts?.trace?.data?.['lcp.loadTime']);
 });
+
+sentryTest(
+  'captures LCP renderTime when returning Timing-Allow-Origin header.',
+  async ({ browserName, getLocalTestUrl, page }) => {
+    if (shouldSkipTracingTest() || browserName !== 'chromium') {
+      sentryTest.skip();
+    }
+
+    page.route('**', route => route.continue());
+    page.route('**/my/image.png', async (route: Route) => {
+      return route.fulfill({
+        path: `${__dirname}/assets/sentry-logo-600x179.png`,
+        headers: { 'Timing-Allow-Origin': '*' },
+      });
+    });
+
+    const url = await getLocalTestUrl({ testDir: __dirname });
+    const [eventData] = await Promise.all([getFirstSentryEnvelopeRequest<Event>(page), page.goto(url)]);
+
+    expect(eventData.measurements).toBeDefined();
+    expect(eventData.measurements?.lcp?.value).toBeDefined();
+
+    expect(eventData.contexts?.trace?.data?.['lcp.element'].startsWith('body >')).toBe(true);
+    expect(eventData.contexts?.trace?.data?.['lcp.size']).toBeGreaterThan(0);
+    expect(eventData.contexts?.trace?.data?.['lcp.loadTime']).toBeGreaterThan(0);
+    expect(eventData.contexts?.trace?.data?.['lcp.renderTime']).toBeGreaterThan(0);
+
+    // The LCP value should be the renderTime because the renderTime is set
+    expect(eventData.measurements?.lcp?.value).toBeCloseTo(eventData.contexts?.trace?.data?.['lcp.renderTime']);
+  },
+);

dev-packages/browser-integration-tests/suites/tracing/trace-lifetime/navigation/test.ts

@@ -316,7 +316,7 @@ sentryTest(
       sentryTest.skip();
     }
 
-    const url = await getLocalTestUrl({ testDir: __dirname });
+    const url = await getLocalTestUrl({ testDir: __dirname, handleLazyLoadedFeedback: true });
 
     // ensure pageload transaction is finished
     await getFirstSentryEnvelopeRequest<Event>(page, url);

dev-packages/browser-integration-tests/suites/tracing/trace-lifetime/pageload-meta/test.ts

@@ -302,7 +302,7 @@ sentryTest('user feedback event after pageload has pageload traceId in headers',
     sentryTest.skip();
   }
 
-  const url = await getLocalTestUrl({ testDir: __dirname });
+  const url = await getLocalTestUrl({ testDir: __dirname, handleLazyLoadedFeedback: true });
 
   const pageloadEvent = await getFirstSentryEnvelopeRequest<Event>(page, url);
   const pageloadTraceContext = pageloadEvent.contexts?.trace;

dev-packages/browser-integration-tests/suites/tracing/trace-lifetime/pageload/test.ts

@@ -442,7 +442,7 @@ sentryTest('user feedback event after pageload has pageload traceId in headers',
     sentryTest.skip();
   }
 
-  const url = await getLocalTestUrl({ testDir: __dirname });
+  const url = await getLocalTestUrl({ testDir: __dirname, handleLazyLoadedFeedback: true });
 
   const pageloadEvent = await getFirstSentryEnvelopeRequest<Event>(page, url);
   const pageloadTraceContext = pageloadEvent.contexts?.trace;

dev-packages/e2e-tests/test-applications/angular-19/.editorconfig

@@ -0,0 +1,17 @@
+# Editor configuration, see https://editorconfig.org
+root = true
+
+[*]
+charset = utf-8
+indent_style = space
+indent_size = 2
+insert_final_newline = true
+trim_trailing_whitespace = true
+
+[*.ts]
+quote_type = single
+ij_typescript_use_double_quotes = false
+
+[*.md]
+max_line_length = off
+trim_trailing_whitespace = false

dev-packages/e2e-tests/test-applications/angular-19/.gitignore

@@ -0,0 +1,44 @@
+# See https://docs.github.com/get-started/getting-started-with-git/ignoring-files for more about ignoring files.
+
+# Compiled output
+/dist
+/tmp
+/out-tsc
+/bazel-out
+
+# Node
+/node_modules
+npm-debug.log
+yarn-error.log
+
+# IDEs and editors
+.idea/
+.project
+.classpath
+.c9/
+*.launch
+.settings/
+*.sublime-workspace
+
+# Visual Studio Code
+.vscode/*
+!.vscode/settings.json
+!.vscode/tasks.json
+!.vscode/launch.json
+!.vscode/extensions.json
+.history/*
+
+# Miscellaneous
+/.angular/cache
+.sass-cache/
+/connect.lock
+/coverage
+/libpeerconnection.log
+testem.log
+/typings
+
+# System files
+.DS_Store
+Thumbs.db
+
+test-results

dev-packages/e2e-tests/test-applications/angular-19/README.md

@@ -0,0 +1,3 @@
+# Angular 19
+
+E2E test app for Angular 19 and `@sentry/angular`.

dev-packages/e2e-tests/test-applications/angular-19/angular.json

@@ -0,0 +1,96 @@
+{
+  "$schema": "./node_modules/@angular/cli/lib/config/schema.json",
+  "version": 1,
+  "newProjectRoot": "projects",
+  "projects": {
+    "angular-19": {
+      "projectType": "application",
+      "schematics": {},
+      "root": "",
+      "sourceRoot": "src",
+      "prefix": "app",
+      "architect": {
+        "build": {
+          "builder": "@angular-devkit/build-angular:application",
+          "options": {
+            "outputPath": "dist/angular-19",
+            "index": "src/index.html",
+            "browser": "src/main.ts",
+            "polyfills": [
+              "zone.js"
+            ],
+            "tsConfig": "tsconfig.app.json",
+            "assets": [
+              {
+                "glob": "**/*",
+                "input": "public"
+              }
+            ],
+            "styles": [
+              "src/styles.css"
+            ],
+            "scripts": []
+          },
+          "configurations": {
+            "production": {
+              "budgets": [
+                {
+                  "type": "initial",
+                  "maximumWarning": "500kB",
+                  "maximumError": "1MB"
+                },
+                {
+                  "type": "anyComponentStyle",
+                  "maximumWarning": "4kB",
+                  "maximumError": "8kB"
+                }
+              ],
+              "outputHashing": "all"
+            },
+            "development": {
+              "optimization": false,
+              "extractLicenses": false,
+              "sourceMap": true
+            }
+          },
+          "defaultConfiguration": "production"
+        },
+        "serve": {
+          "builder": "@angular-devkit/build-angular:dev-server",
+          "configurations": {
+            "production": {
+              "buildTarget": "angular-19:build:production"
+            },
+            "development": {
+              "buildTarget": "angular-19:build:development"
+            }
+          },
+          "defaultConfiguration": "development"
+        },
+        "extract-i18n": {
+          "builder": "@angular-devkit/build-angular:extract-i18n"
+        },
+        "test": {
+          "builder": "@angular-devkit/build-angular:karma",
+          "options": {
+            "polyfills": [
+              "zone.js",
+              "zone.js/testing"
+            ],
+            "tsConfig": "tsconfig.spec.json",
+            "assets": [
+              {
+                "glob": "**/*",
+                "input": "public"
+              }
+            ],
+            "styles": [
+              "src/styles.css"
+            ],
+            "scripts": []
+          }
+        }
+      }
+    }
+  }
+}

dev-packages/e2e-tests/test-applications/angular-19/package.json

@@ -0,0 +1,47 @@
+{
+  "name": "angular-19",
+  "version": "0.0.0",
+  "scripts": {
+    "ng": "ng",
+    "dev": "ng serve",
+    "proxy": "node start-event-proxy.mjs",
+    "preview": "http-server dist/angular-19/browser --port 8080",
+    "build": "ng build",
+    "watch": "ng build --watch --configuration development",
+    "test": "playwright test",
+    "test:build": "pnpm install && npx playwright install && pnpm build",
+    "test:assert": "playwright test",
+    "clean": "npx rimraf .angular node_modules pnpm-lock.yaml dist"
+  },
+  "private": true,
+  "dependencies": {
+    "@angular/animations": "^19.0.0",
+    "@angular/common": "^19.0.0",
+    "@angular/compiler": "^19.0.0",
+    "@angular/core": "^19.0.0",
+    "@angular/forms": "^19.0.0",
+    "@angular/platform-browser": "^19.0.0",
+    "@angular/platform-browser-dynamic": "^19.0.0",
+    "@angular/router": "^19.0.0",
+    "@sentry/angular": "* || latest",
+    "rxjs": "~7.8.0",
+    "tslib": "^2.3.0",
+    "zone.js": "~0.15.0"
+  },
+  "devDependencies": {
+    "@angular-devkit/build-angular": "^19.0.0",
+    "@angular/cli": "^19.0.0",
+    "@angular/compiler-cli": "^19.0.0",
+    "@playwright/test": "^1.44.1",
+    "@sentry-internal/test-utils": "link:../../../test-utils",
+    "@types/jasmine": "~5.1.0",
+    "http-server": "^14.1.1",
+    "jasmine-core": "~5.4.0",
+    "karma": "~6.4.0",
+    "karma-chrome-launcher": "~3.2.0",
+    "karma-coverage": "~2.2.0",
+    "karma-jasmine": "~5.1.0",
+    "karma-jasmine-html-reporter": "~2.1.0",
+    "typescript": "~5.6.2"
+  }
+}