From c42d9de3ceb72384572e1f663a817363ba3f580b Mon Sep 17 00:00:00 2001 From: Rosa Trieu Date: Mon, 23 Dec 2024 09:30:11 -0800 Subject: [PATCH] flutter move views back but keep track resources --- .../flutter/advanced_configuration.md | 65 ------------------ .../mobile_and_tv_monitoring/flutter/setup.md | 66 +++++++++++++++++++ 2 files changed, 66 insertions(+), 65 deletions(-) diff --git a/content/en/real_user_monitoring/mobile_and_tv_monitoring/flutter/advanced_configuration.md b/content/en/real_user_monitoring/mobile_and_tv_monitoring/flutter/advanced_configuration.md index f4e84cec6958c..0e25dd060a6b2 100644 --- a/content/en/real_user_monitoring/mobile_and_tv_monitoring/flutter/advanced_configuration.md +++ b/content/en/real_user_monitoring/mobile_and_tv_monitoring/flutter/advanced_configuration.md @@ -179,71 +179,6 @@ A custom endpoint for sending RUM data. **Default**: `20.0` The sampling rate for telemetry data, such as errors and debug logs. -## Automatically track views - -If you are using Flutter Navigator v2.0, your setup for automatic view tracking differs depending on your routing middleware. See [Flutter Integrated Libraries][18] for instructions on how to integrate with [go_router][8], [AutoRoute][9], and [Beamer][10]. - -### Flutter Navigator v1 - -The Datadog Flutter Plugin can automatically track named routes using the `DatadogNavigationObserver` on your MaterialApp: - -```dart -MaterialApp( - home: HomeScreen(), - navigatorObservers: [ - DatadogNavigationObserver(DatadogSdk.instance), - ], -); -``` - -This works if you are using named routes or if you have supplied a name to the `settings` parameter of your `PageRoute`. - -If you are not using named routes, you can use `DatadogRouteAwareMixin` in conjunction with the `DatadogNavigationObserverProvider` widget to start and stop your RUM views automatically. With `DatadogRouteAwareMixin`, move any logic from `initState` to `didPush`. - -### Flutter Navigator v2 - -If you are using Flutter Navigator v2.0, which uses the `MaterialApp.router` named constructor, the setup varies based on the routing middleware you are using, if any. Since [`go_router`][25] uses the same observer interface as Flutter Navigator v1, `DatadogNavigationObserver` can be added to other observers as a parameter to `GoRouter`. - -```dart -final _router = GoRouter( - routes: [ - // Your route information here - ], - observers: [ - DatadogNavigationObserver(datadogSdk: DatadogSdk.instance), - ], -); -MaterialApp.router( - routerConfig: _router, - // Your remaining setup -) -``` - -For examples that use routers other than `go_router`, see [Automatically track views](#automatically-track-views). - -### Renaming Views - -For all setups, you can rename views or supply custom paths by providing a [`viewInfoExtractor`][26] callback. This function can fall back to the default behavior of the observer by calling `defaultViewInfoExtractor`. For example: - -```dart -RumViewInfo? infoExtractor(Route route) { - var name = route.settings.name; - if (name == 'my_named_route') { - return RumViewInfo( - name: 'MyDifferentName', - attributes: {'extra_attribute': 'attribute_value'}, - ); - } - - return defaultViewInfoExtractor(route); -} - -var observer = DatadogNavigationObserver( - datadogSdk: DatadogSdk.instance, - viewInfoExtractor: infoExtractor, -); -``` - ## Automatically track resources Use the [Datadog Tracking HTTP Client][12] package to enable automatic tracking of resources and HTTP calls from your views. diff --git a/content/en/real_user_monitoring/mobile_and_tv_monitoring/flutter/setup.md b/content/en/real_user_monitoring/mobile_and_tv_monitoring/flutter/setup.md index 0aa5a245bc0d6..b1adeb1e2633d 100644 --- a/content/en/real_user_monitoring/mobile_and_tv_monitoring/flutter/setup.md +++ b/content/en/real_user_monitoring/mobile_and_tv_monitoring/flutter/setup.md @@ -241,6 +241,72 @@ The SDK changes its behavior according to the new value. For example, if the cur - You change it to `TrackingConsent.granted`, the SDK sends all current and future data to Datadog; - You change it to `TrackingConsent.notGranted`, the SDK wipes all current data and does not collect any future data. +## Automatically track views + +If you are using Flutter Navigator v2.0, your setup for automatic view tracking differs depending on your routing middleware. See [Flutter Integrated Libraries][18] for instructions on how to integrate with [go_router][8], [AutoRoute][9], and [Beamer][10]. + +### Flutter Navigator v1 + +The Datadog Flutter Plugin can automatically track named routes using the `DatadogNavigationObserver` on your MaterialApp: + +```dart +MaterialApp( + home: HomeScreen(), + navigatorObservers: [ + DatadogNavigationObserver(DatadogSdk.instance), + ], +); +``` + +This works if you are using named routes or if you have supplied a name to the `settings` parameter of your `PageRoute`. + +If you are not using named routes, you can use `DatadogRouteAwareMixin` in conjunction with the `DatadogNavigationObserverProvider` widget to start and stop your RUM views automatically. With `DatadogRouteAwareMixin`, move any logic from `initState` to `didPush`. + +### Flutter Navigator v2 + +If you are using Flutter Navigator v2.0, which uses the `MaterialApp.router` named constructor, the setup varies based on the routing middleware you are using, if any. Since [`go_router`][25] uses the same observer interface as Flutter Navigator v1, `DatadogNavigationObserver` can be added to other observers as a parameter to `GoRouter`. + +```dart +final _router = GoRouter( + routes: [ + // Your route information here + ], + observers: [ + DatadogNavigationObserver(datadogSdk: DatadogSdk.instance), + ], +); +MaterialApp.router( + routerConfig: _router, + // Your remaining setup +) +``` + +For examples that use routers other than `go_router`, see [Automatically track views](#automatically-track-views). + + +### Renaming Views + +For all setups, you can rename views or supply custom paths by providing a [`viewInfoExtractor`][26] callback. This function can fall back to the default behavior of the observer by calling `defaultViewInfoExtractor`. For example: + +```dart +RumViewInfo? infoExtractor(Route route) { + var name = route.settings.name; + if (name == 'my_named_route') { + return RumViewInfo( + name: 'MyDifferentName', + attributes: {'extra_attribute': 'attribute_value'}, + ); + } + + return defaultViewInfoExtractor(route); +} + +var observer = DatadogNavigationObserver( + datadogSdk: DatadogSdk.instance, + viewInfoExtractor: infoExtractor, +); +``` + ## Automatically track actions Use [`RumUserActionDetector`][13] to track user taps that happen in a given Widget tree: