Skip to content

Commit 2c3c99b

Browse files
smeubankbuenaflor
andauthored
Dart and Flutter Integrations Shared in platform docs correctly (#13030)
* Move all Dart and Flutter Integrations to Includes - creates a subdirectory in includes for dart integrations - from here these can be easily re-used by Dart and/or Flutter Docs - the Dart integrations functionally remain the same - Flutter now has all Dart integrations as well * fix routing int naming * fix regressions - i made changes to mdxComponents.ts to allow simpler includes for dart and flutter - caused a regression for other includes related to PlatformIdentifier - this fixes that, there were errors in the build in vercel related to User Feedback Go FastHTTP, but was found in Python and other places. It is now resolved * test fix from failed vercel builds, not related to my changes Failed to compile. ./src/components/codeKeywords/keywordSelector.tsx:153:7 Type error: Type 'false | ReactPortal' is not assignable to type 'ReactNode'. Type 'ReactPortal' is not assignable to type 'ReactNode'. Type 'import("/vercel/path0/node_modules/@types/react-dom/node_modules/@types/react/index").ReactPortal' is not assignable to type 'React.ReactPortal'. Types of property 'children' are incompatible. Type 'import("/vercel/path0/node_modules/@types/react-dom/node_modules/@types/react/index").ReactNode' is not assignable to type 'React.ReactNode'. Type 'ReactElement<unknown, string | JSXElementConstructor<any>>' is not assignable to type 'ReactNode'. Property 'children' is missing in type 'ReactElement<unknown, string | JSXElementConstructor<any>>' but required in type 'ReactPortal'. 151 | </span> 152 | </KeywordDropdown> > 153 | {isMounted && | ^ 154 | createPortal(<AnimatePresence>{selector}</AnimatePresence>, document.body)} 155 | </Fragment> 156 | ); error Command failed with exit code 1. info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command. Error: Command "yarn run build" exited with 1 * remove changes to ts * revert * Update yarn.lock * fix flutter integration list * add integrations table * Update index.mdx * revert: Remove yarn.lock changes --------- Co-authored-by: Giancarlo Buenaflor <[email protected]>
1 parent 76ab421 commit 2c3c99b

33 files changed

+1620
-1417
lines changed
Original file line numberDiff line numberDiff line change
@@ -1,136 +1,9 @@
11
---
22
title: Dio Integration
33
description: "Learn more about the Sentry Dio integration for the Dart SDK."
4-
sidebar_order: 4
4+
sidebar_order: 10
5+
redirect_from:
6+
- /platforms/dart/guides/dio/
57
---
68

7-
The `sentry_dio` library provides [Dio](https://pub.dev/packages/dio) support for Sentry using the [HttpClientAdapter](https://pub.dev/documentation/dio/latest/dio/HttpClientAdapter-class.html). It is able to collect breadcrumbs, run tracing for HTTP requests, and capture events for failed requests.
8-
9-
## Install
10-
11-
To add the Dio integration, add the `sentry_dio` dependency.
12-
13-
```yml {filename:pubspec.yaml}
14-
dependencies:
15-
sentry: ^{{@inject packages.version('sentry.dart', '6.4.0') }}
16-
sentry_dio: ^{{@inject packages.version('sentry.dart.dio', '6.4.0') }}
17-
dio: ^4.0.0
18-
```
19-
20-
## Configure
21-
22-
Configuration should happen as early as possible in your application's lifecycle.
23-
24-
25-
```dart
26-
import 'package:sentry_dio/sentry_dio.dart';
27-
import 'package:sentry/sentry.dart';
28-
29-
Future<void> main() async {
30-
await Sentry.init(
31-
(options) {
32-
options.dsn = '___PUBLIC_DSN___';
33-
},
34-
appRunner: initApp, // Init your App.
35-
);
36-
}
37-
38-
final dio = Dio();
39-
40-
// This *must* be the last initialization step of the Dio setup.
41-
dio.addSentry(...);
42-
```
43-
44-
## Reporting Bad HTTP Requests as Errors
45-
46-
The `Interceptors` can also catch exceptions that may occur during requests — for example [DioError](https://pub.dev/documentation/dio2/latest/dio2/DioError-class.html).
47-
48-
```dart
49-
import 'package:sentry_dio/sentry_dio.dart';
50-
51-
final dio = Dio();
52-
53-
dio.addSentry();
54-
55-
final response = await dio.get<String>('https://wrong-url.dev/');
56-
```
57-
58-
This is an opt-out feature. The following example shows how to disable it:
59-
60-
61-
```dart {2}
62-
await Sentry.init((options) {
63-
options.captureFailedRequests = false;
64-
});
65-
```
66-
67-
## Tracing for HTTP Requests
68-
69-
The Dio integration also provides insight into tracing for your HTTP requests done with Dio.
70-
71-
### Instrumentation Behaviour
72-
73-
- The created spans will be attached to the transaction on the scope - if no transaction is on the scope the span will not be sent to Sentry.
74-
- The SDK sets the span operation to `http.client` and the description to request `$METHOD $url`. For example, `GET https://sentry.io`.
75-
- The span finishes once the request has been executed.
76-
- The span status depends on either the HTTP response code or `SpanStatus.internalError()` if the code does not match any of Sentry's SpanStatus options.
77-
- When the HTTP request throws an Exception, Sentry's SDK associates this exception to the running span. If you haven't set the SDK to swallow the exception and capture it, the span and `SentryEvent` will be linked when viewing it on the Issue Details page in sentry.io.
78-
79-
### Prerequisites
80-
81-
Before starting, ensure:
82-
83-
1. The Sentry Flutter SDK is initialized. Learn more [here](/platforms/dart/guides/flutter/#configure).
84-
2. Tracing is set up. Learn more [here](/platforms/dart/guides/flutter/tracing/).
85-
86-
### Configure
87-
88-
Call `addSentry()` on your instance of `Dio:
89-
90-
```dart
91-
import 'package:sentry_dio/sentry_dio.dart';
92-
93-
final dio = Dio();
94-
95-
dio.addSentry();
96-
```
97-
98-
### Verify
99-
100-
#### 1. Execute the Code
101-
102-
```dart
103-
import 'package:sentry_dio/sentry_dio.dart';
104-
105-
Future<void> makeWebRequestWithDio() async {
106-
final dio = Dio();
107-
dio.addSentry();
108-
109-
// If there is no active transaction, start one
110-
final transaction = Sentry.startTransaction(
111-
'dio-web-request',
112-
'request',
113-
bindToScope: true,
114-
);
115-
final span = transaction.startChild(
116-
'dio',
117-
description: 'desc',
118-
);
119-
Response<String>? response;
120-
try {
121-
response = await dio.get<String>(exampleUrl);
122-
span.status = const SpanStatus.ok();
123-
} catch (exception, stackTrace) {
124-
span.throwable = exception;
125-
span.status = const SpanStatus.internalError();
126-
await Sentry.captureException(exception, stackTrace: stackTrace);
127-
} finally {
128-
await span.finish();
129-
}
130-
}
131-
```
132-
133-
#### 2. View the Transaction on Sentry.io
134-
135-
To view the recorded transaction, log into [sentry.io](https://sentry.io) and open your project.
136-
Clicking **Performance** will open a page with transactions, where you can select the just recorded transaction with the name `dio-web-request`.
9+
<Include name="dart-integrations/dio.mdx" />
Original file line numberDiff line numberDiff line change
@@ -1,95 +1,9 @@
11
---
22
title: File I/O
33
description: "Learn more about the Sentry file I/O integration for the Dart SDK."
4-
sidebar_order: 5
4+
sidebar_order: 20
5+
redirect_from:
6+
- /platforms/dart/guides/file/
57
---
68

7-
File I/O operations are fundamental for reading from and writing to files within an application.
8-
The `sentry_file` integration provides [File](https://api.dart.dev/stable/2.18.5/dart-io/File-class.html) support for Sentry thus providing insight into tracing of file operations.
9-
10-
## Behavior
11-
12-
- The created spans will be attached to the transaction on the scope - if no transaction is on the scope the File I/O span will not be sent to Sentry.
13-
- The File I/O integration is only available for the `dart:io:File` class, not for the `dart:html:File` class.
14-
- The SDK sets the span `operation` to `file.copy`, `file.write`, `file.delete`, `file.open`, `file.read` or `file.rename`, and `description` to `filename` (for example, `file.txt`).
15-
- The span finishes once the operation has been executed. The span `status` is then set to `SpanStatus.ok` if successful, or `SpanStatus.internalError` if there was an error.
16-
- When the operation throws an `Exception`, Sentry's SDK associates it with the running span.
17-
18-
## Prerequisites
19-
20-
1. The Sentry [Dart](/platforms/dart/#configure) SDK is initialized.
21-
2. Tracing is set up. Learn more [here](/platforms/dart/tracing/).
22-
23-
## Install
24-
25-
To use the `SentryFile` wrapper, add the `sentry_file` dependency.
26-
27-
```yml {filename:pubspec.yaml}
28-
dependencies:
29-
sentry: ^{{@inject packages.version('sentry.dart', '6.18.0') }}
30-
sentry_file: ^{{@inject packages.version('sentry.dart.file', '6.18.0') }}
31-
```
32-
33-
## Configure
34-
35-
Call the Sentry extension method to wrap the file:
36-
37-
```dart
38-
final sentryFile = file.sentryTrace();
39-
```
40-
41-
## Verify
42-
43-
### 1. Execute the Code
44-
45-
```dart
46-
import 'package:sentry/sentry.dart';
47-
import 'package:sentry_file/sentry_file.dart';
48-
import 'dart:io';
49-
50-
Future<void> main() async {
51-
await Sentry.init(
52-
(options) {
53-
options.dsn = 'https://[email protected]/example';
54-
// To set a uniform sample rate
55-
options.tracesSampleRate = 1.0;
56-
},
57-
appRunner: runApp, // Init your App.
58-
);
59-
}
60-
61-
Future<void> runApp() async {
62-
final file = File('my_file.txt');
63-
// Call the Sentry extension method to wrap up the File
64-
final sentryFile = file.sentryTrace();
65-
66-
// Start a transaction if there's no active transaction
67-
final transaction = Sentry.startTransaction(
68-
'MyFileExample',
69-
'file',
70-
bindToScope: true,
71-
);
72-
73-
// create the File
74-
await sentryFile.create();
75-
// Write some content
76-
await sentryFile.writeAsString('Hello World');
77-
// Read the content
78-
final text = await sentryFile.readAsString();
79-
80-
print(text);
81-
82-
// Delete the file
83-
await sentryFile.delete();
84-
85-
// Finish the transaction
86-
await transaction.finish(status: SpanStatus.ok());
87-
88-
await Sentry.close();
89-
}
90-
```
91-
92-
### 2. View the Recorded Transaction on Sentry.io
93-
94-
To view the recorded transaction, log into [sentry.io](https://sentry.io) and open your project.
95-
Clicking **Performance** will open a page with transactions, where you can select the just recorded transaction with the name `MyFileExample`.
9+
<Include name="dart-integrations/file.mdx" />
Original file line numberDiff line numberDiff line change
@@ -1,144 +1,9 @@
11
---
22
title: HTTP Integration
33
description: "Learn more about the Sentry HTTP integration for the Dart SDK."
4-
sidebar_order: 2
4+
sidebar_order: 30
5+
redirect_from:
6+
- /platforms/dart/guides/http/
57
---
68

7-
## Using the `SentryHttpClient` function
8-
9-
You can use the `SentryHttpClient` and call its methods directly, or you can use it with the [`runWithClient`](https://pub.dev/documentation/http/latest/http/runWithClient.html) function. If you need to use a fresh instance of the `client` (so that other instances are not affected) or to run in a separate [`Zone`](https://api.dart.dev/stable/3.5.0/dart-async/Zone-class.html), which allows you to override the functionality of the existing [`Zone`](https://api.dart.dev/stable/3.5.0/dart-async/Zone-class.html), then use the `runWithClient` function (see the `runWithClient` tab). Otherwise, just use `SentryHttpClient` directly and call its methods (see the `default` tab).
10-
11-
### Usage
12-
13-
```dart {filename:http_client.dart}{tabTitle: default}
14-
import 'package:sentry/sentry.dart';
15-
16-
final client = SentryHttpClient();
17-
18-
try {
19-
final response = await client.get(Uri.https('www.example.com', ''));
20-
print(response.body);
21-
} finally {
22-
client.close();
23-
}
24-
```
25-
26-
```dart {filename:http_client.dart}{tabTitle: runWithClient}
27-
import 'package:http/http.dart';
28-
import 'package:sentry/sentry.dart';
29-
30-
final sentryHttpClient = SentryHttpClient();
31-
32-
await runWithClient(() async {
33-
final response = await get(Uri.https('www.example.com', ''));
34-
print(response.body);
35-
}, () => sentryHttpClient);
36-
```
37-
38-
## Reporting Bad HTTP Requests as Errors
39-
40-
The `SentryHttpClient` can also catch exceptions that may occur during requests — for example [`SocketException`](https://api.dart.dev/stable/2.13.4/dart-io/SocketException-class.html).
41-
42-
```dart
43-
import 'package:sentry/sentry.dart';
44-
45-
var client = SentryHttpClient();
46-
try {
47-
var uriResponse = await client.post('https://example.com/whatsit/create',
48-
body: {'name': 'doodle', 'color': 'blue'});
49-
print(await client.get(uriResponse.bodyFields['uri']));
50-
} finally {
51-
client.close();
52-
}
53-
```
54-
55-
When an error occurs, the following information is captured and sent to Sentry:
56-
57-
The marked elements (\*) are affected by the default enabled [server-side data scrubbing](https://docs.sentry.io/security-legal-pii/scrubbing/server-side-scrubbing/).
58-
To implement client side data scrubbing, go to [client-side data scrubbing in Flutter](https://docs.sentry.io/platforms/dart/guides/flutter/data-management/sensitive-data/).
59-
60-
Request details:
61-
62-
- Method
63-
- URL \*
64-
- Headers \*
65-
- Body \*
66-
- Content length
67-
- Duration
68-
69-
Response details:
70-
71-
- Headers \*
72-
- Content length
73-
- Status code
74-
75-
This is an opt-out feature. The following example shows how to disable it:
76-
77-
78-
```dart
79-
import 'package:sentry/sentry.dart';
80-
81-
Future<void> main() async {
82-
await Sentry.init(
83-
(options) {
84-
options.dsn = '___PUBLIC_DSN___';
85-
options.captureFailedRequests = false;
86-
},
87-
appRunner: initApp, // Init your App.
88-
);
89-
}
90-
```
91-
92-
Furthermore you can track HTTP requests that you consider bad. In the
93-
following example, exceptions are captured for each request
94-
with a status code within the range of 400 to 404, and also for 500.
95-
96-
```dart
97-
import 'package:sentry/sentry.dart';
98-
99-
var client = SentryHttpClient(
100-
failedRequestStatusCodes: [
101-
SentryStatusCode.range(400, 404),
102-
SentryStatusCode(500),
103-
],
104-
);
105-
106-
try {
107-
var uriResponse = await client.post('https://example.com/whatsit/create',
108-
body: {'name': 'doodle', 'color': 'blue'});
109-
print(await client.get(uriResponse.bodyFields['uri']));
110-
} finally {
111-
client.close();
112-
}
113-
```
114-
115-
## Tracing for HTTP Requests
116-
117-
<Alert>
118-
119-
Capturing transactions requires that you first <PlatformLink to="/tracing/">set up tracing</PlatformLink> if you haven't already.
120-
121-
</Alert>
122-
123-
The `SentryHttpClient` starts a span out of the active span bound to the scope for each HTTP Request.
124-
125-
```dart
126-
import 'package:sentry/sentry.dart';
127-
128-
final transaction = Sentry.startTransaction(
129-
'webrequest',
130-
'request',
131-
bindToScope: true,
132-
);
133-
134-
var client = SentryHttpClient();
135-
try {
136-
var uriResponse = await client.post('https://example.com/whatsit/create',
137-
body: {'name': 'doodle', 'color': 'blue'});
138-
print(await client.get(uriResponse.bodyFields['uri']));
139-
} finally {
140-
client.close();
141-
}
142-
143-
await transaction.finish(status: SpanStatus.ok());
144-
```
9+
<Include name="dart-integrations/http-integration.mdx" />

0 commit comments

Comments
 (0)