Merge pull request #8754 from getsentry/prepare-release/7.62.0

meta: Update CHANGELOG for version 7.62.0

Author: Lms24

.craft.yml

@@ -1,6 +1,11 @@
 minVersion: '0.23.1'
 changelogPolicy: simple
 preReleaseCommand: bash scripts/craft-pre-release.sh
+statusProvider:
+  name: github
+  config:
+    contexts:
+      - job_required_jobs_passed
 targets:
   # NPM Targets
   ## 1. Base Packages, node or browser SDKs depend on

.github/workflows/build.yml

@@ -599,7 +599,7 @@ jobs:
     needs: [job_get_metadata, job_build]
     if: needs.job_get_metadata.outputs.changed_browser == 'true' || github.event_name != 'pull_request'
     runs-on: ubuntu-20.04
-    timeout-minutes: 10
+    timeout-minutes: 20
     strategy:
       fail-fast: false
       matrix:
@@ -855,8 +855,8 @@ jobs:
         timeout-minutes: 5
         run: yarn test:assert
 
-  job_required_tests:
-    name: All required tests passed or skipped
+  job_required_jobs_passed:
+    name: All required jobs passed or were skipped
     needs:
       [
         job_build,
@@ -870,6 +870,9 @@ jobs:
         job_browser_loader_tests,
         job_remix_integration_tests,
         job_e2e_tests,
+        job_artifacts,
+        job_lint,
+        job_circular_dep_check,
       ]
     # Always run this, even if a dependent job failed
     if: always()

CHANGELOG.md

@@ -4,6 +4,42 @@
 
 - "You miss 100 percent of the chances you don't take. — Wayne Gretzky" — Michael Scott
 
+## 7.62.0
+
+### Important Changes
+
+- **feat(integrations): Add `ContextLines` integration for html-embedded JS stack frames (#8699)**
+
+This release adds the `ContextLines` integration as an optional integration for the Browser SDKs to `@sentry/integrations`.
+
+This integration adds source code from inline JavaScript of the current page's HTML (e.g. JS in `<script>` tags) to stack traces of captured errors.
+It _can't_ collect source code from assets referenced by your HTML (e.g. `<script src="..." />`).
+
+The `ContextLines` integration is useful when you have inline JS code in HTML pages that can't be accessed by Sentry's backend, for example, due to a login-protected page.
+
+```js
+import { ContextLines } from "@sentry/integrations";
+
+Sentry.init({
+  // ...
+  integrations: [
+    new ContextLines({
+      // The number of lines to collect before and after each stack frame's line number
+      // Defaults to 7
+      frameContextLines: 7,
+    }),
+  ],
+});
+```
+
+### Other Changes
+
+- fix(nextjs): Make all wrappers isomorphic and available in all runtimes (#8743)
+- fix(replay): Cancel debounce when replay is too short/long (#8742)
+- fix(utils): `dirname` and `basename` should handle Windows paths (#8737)
+- ref: Hoist `flush`, `close`, and `lastEventId` into `@sentry/core` (#8731)
+- ref(node): Don't call `JSON.stringify` on prisma client when logging (#8745)
+
 ## 7.61.1
 
 - feat(nextjs): Add `AsyncLocalStorage` async context strategy to edge SDK (#8720)

packages/browser-integration-tests/suites/integrations/Breadcrumbs/fetch/get/test.ts

@@ -4,8 +4,8 @@ import type { Event } from '@sentry/types';
 import { sentryTest } from '../../../../../utils/fixtures';
 import { getFirstSentryEnvelopeRequest } from '../../../../../utils/helpers';
 
-sentryTest('captures Breadcrumb for basic GET request', async ({ getLocalTestPath, page }) => {
-  const url = await getLocalTestPath({ testDir: __dirname });
+sentryTest('captures Breadcrumb for basic GET request', async ({ getLocalTestUrl, page }) => {
+  const url = await getLocalTestUrl({ testDir: __dirname });
 
   await page.route('**/foo', route => {
     return route.fulfill({

packages/browser-integration-tests/suites/integrations/Breadcrumbs/fetch/post/test.ts

@@ -4,8 +4,8 @@ import type { Event } from '@sentry/types';
 import { sentryTest } from '../../../../../utils/fixtures';
 import { getFirstSentryEnvelopeRequest } from '../../../../../utils/helpers';
 
-sentryTest('captures Breadcrumb for POST request', async ({ getLocalTestPath, page }) => {
-  const url = await getLocalTestPath({ testDir: __dirname });
+sentryTest('captures Breadcrumb for POST request', async ({ getLocalTestUrl, page }) => {
+  const url = await getLocalTestUrl({ testDir: __dirname });
 
   await page.route('**/foo', route => {
     return route.fulfill({

packages/browser-integration-tests/suites/integrations/Breadcrumbs/xhr/get/test.ts

@@ -4,8 +4,8 @@ import type { Event } from '@sentry/types';
 import { sentryTest } from '../../../../../utils/fixtures';
 import { getFirstSentryEnvelopeRequest } from '../../../../../utils/helpers';
 
-sentryTest('captures Breadcrumb for basic GET request', async ({ getLocalTestPath, page }) => {
-  const url = await getLocalTestPath({ testDir: __dirname });
+sentryTest('captures Breadcrumb for basic GET request', async ({ getLocalTestUrl, page }) => {
+  const url = await getLocalTestUrl({ testDir: __dirname });
 
   await page.route('**/foo', route => {
     return route.fulfill({

packages/browser-integration-tests/suites/integrations/Breadcrumbs/xhr/post/test.ts

@@ -4,8 +4,8 @@ import type { Event } from '@sentry/types';
 import { sentryTest } from '../../../../../utils/fixtures';
 import { getFirstSentryEnvelopeRequest } from '../../../../../utils/helpers';
 
-sentryTest('captures Breadcrumb for POST request', async ({ getLocalTestPath, page }) => {
-  const url = await getLocalTestPath({ testDir: __dirname });
+sentryTest('captures Breadcrumb for POST request', async ({ getLocalTestUrl, page }) => {
+  const url = await getLocalTestUrl({ testDir: __dirname });
 
   await page.route('**/foo', route => {
     return route.fulfill({

packages/browser-integration-tests/suites/integrations/ContextLines/init.js

@@ -0,0 +1,9 @@
+import * as Sentry from '@sentry/browser';
+import { ContextLines } from '@sentry/integrations';
+
+window.Sentry = Sentry;
+
+Sentry.init({
+  dsn: 'https://[email protected]/1337',
+  integrations: [new ContextLines()],
+});

packages/browser-integration-tests/suites/integrations/ContextLines/inline/template.html

@@ -0,0 +1,12 @@
+<!DOCTYPE html>
+<html>
+  <head>
+    <meta charset="utf-8" />
+  </head>
+  <body>
+      <button id="inline-error-btn" onclick="throw new Error('Error with context lines')">Click me</button>
+  </body>
+  <footer>
+    Some text...
+  </foot>
+</html>

packages/browser-integration-tests/suites/integrations/ContextLines/inline/test.ts

@@ -0,0 +1,53 @@
+import { expect } from '@playwright/test';
+
+import { sentryTest } from '../../../../utils/fixtures';
+import { envelopeRequestParser, waitForErrorRequestOnUrl } from '../../../../utils/helpers';
+
+sentryTest(
+  'should add source context lines around stack frames from errors in Html inline JS',
+  async ({ getLocalTestPath, page, browserName }) => {
+    if (browserName === 'webkit') {
+      // The error we're throwing in this test is thrown as "Script error." in Webkit.
+      // We filter "Script error." out by default in `InboundFilters`.
+      // I don't think there's much value to disable InboundFilters defaults for this test,
+      // given that most of our users won't do that either.
+      // Let's skip it instead for Webkit.
+      sentryTest.skip();
+    }
+
+    const url = await getLocalTestPath({ testDir: __dirname });
+
+    const eventReqPromise = waitForErrorRequestOnUrl(page, url);
+
+    const clickPromise = page.click('#inline-error-btn');
+
+    const [req] = await Promise.all([eventReqPromise, clickPromise]);
+
+    const eventData = envelopeRequestParser(req);
+
+    expect(eventData.exception?.values).toHaveLength(1);
+
+    const exception = eventData.exception?.values?.[0];
+
+    expect(exception).toMatchObject({
+      stacktrace: {
+        frames: [
+          {
+            pre_context: ['<!DOCTYPE html>', '<html>', '<head>', '    <meta charset="utf-8">', '  </head>', '  <body>'],
+            context_line:
+              '      <button id="inline-error-btn" onclick="throw new Error(\'Error with context lines\')">Click me</button>',
+            post_context: [
+              expect.stringContaining('<script'), // this line varies in the test based on tarball/cdn bundle (+variants)
+              '  <footer>',
+              '    Some text...',
+              '  ',
+              '',
+              '</footer></body>',
+              '</html>',
+            ],
+          },
+        ],
+      },
+    });
+  },
+);