Add docs for JavaScript HttpClient Integration. (#6022)

Co-authored-by: Liza Mock <[email protected]>
Co-authored-by: Luca Forstner <[email protected]>

Author: 3 people

src/platform-includes/configuration/http-client/javascript.mdx

@@ -0,0 +1,62 @@
+```javascript {tabTitle: JavaScript}
+import * as Sentry from "@sentry/browser";
+import { HttpClient as HttpClientIntegration } from "@sentry/integrations";
+
+Sentry.init({
+  dsn: "___PUBLIC_DSN___",
+  integrations: [
+    new HttpClientIntegration({
+      // This array can contain tuples of `[begin, end]` (both inclusive),
+      // single status codes, or a combination of both.
+      // default: [[500, 599]]
+      failedRequestStatusCodes: [[500, 505], 507],
+
+      // This array can contain Regexes, strings, or a combination of both.
+      // default: [/.*/]
+      failedRequestTargets: [
+        "http://example.com/api/test",
+        /(staging\.)?mypage\.com/,
+      ],
+    }),
+  ],
+
+  // This option is required for capturing headers and cookies.
+  sendDefaultPii: true,
+});
+```
+
+```javascript {tabTitle: CDN}
+<script
+  src="https://browser.sentry-cdn.com/{{ packages.version('sentry.javascript.browser') }}/bundle.min.js"
+  integrity="sha384-{{ packages.checksum('sentry.javascript.browser', 'bundle.min.js', 'sha384-base64') }}"
+  crossorigin="anonymous"
+></script>
+
+<script
+  src="https://browser.sentry-cdn.com/{{ packages.version('sentry.javascript.browser') }}/httpclient.min.js"
+  integrity="sha384-{{ packages.checksum('sentry.javascript.browser', 'httpclient.min.js', 'sha384-base64') }}"
+  crossorigin="anonymous"
+></script>
+
+Sentry.init({
+  dsn: "___PUBLIC_DSN___",
+  integrations: [
+    new HttpClientIntegration({
+      // This array can contain tuples of `[begin, end]` (both inclusive),
+      // single status codes, or a combination of both.
+      // default: [[500, 599]]
+      failedRequestStatusCodes: [[500, 505], 507],
+
+      // This array can contain Regexes, strings, or a combination of both.
+      // default: [/.*/]
+      failedRequestTargets: [
+        "http://example.com/api/test",
+        /(staging\.)?mypage\.com/,
+      ],
+    }),
+  ],
+
+  // This option is required for capturing headers and cookies.
+  sendDefaultPii: true,
+});
+```

src/platforms/javascript/common/configuration/integrations/plugin.mdx

@@ -1,6 +1,6 @@
 ---
 title: Pluggable Integrations
-description: "Learn more about pluggable integrations ExtraErrorData, CaptureConsole, Debug, Offline, RewriteFrames, and ReportingObserver, which are snippets of code that augment functionality for specific applications and/or frameworks."
+description: "Learn more about pluggable integrations ExtraErrorData, CaptureConsole, Debug, HttpClient, Offline, RewriteFrames, and ReportingObserver, which are snippets of code that augment functionality for specific applications and/or frameworks."
 redirect_from:
   - /platforms/javascript/integrations/plugin/
   - /platforms/javascript/pluggable-integrations/
@@ -50,6 +50,26 @@ Available options:
 
 <PlatformContent includePath="configuration/debug" />
 
+### HttpClient
+
+_(New in version 7.30.0)_
+
+_Import name: `Sentry.Integrations.HttpClient`_
+
+This integration captures errors on failed requests from Fetch and XHR and attaches request and response information.
+
+By default, error events will not contain header and cookie data. You can change this behavior by setting the `sendDefaultPii` option to `true`.
+
+Available options:
+
+<PlatformContent includePath="configuration/http-client" />
+
+<Alert level="warning" title="Note">
+
+Due to the limitations of both the Fetch and XHR API, the cookie and header collection for both requests and responses is based on best effort. Certain headers may be missing in the event created by the integration.
+
+</Alert>
+
 <PlatformSection notSupported={["javascript.electron"]}>
 
 ### Offline