I’m trying to implement sentry into my code base. Following the documentation I’m supposed to use SentryNavigationObserver() and pass it into MaterialApp() like so:

      routerConfig: _appRouter.config(
        navigatorObservers: () => [SentryNavigatorObserver()],

However this solution doesn’t track any Tab changes. Whenever I change a tab it appears to be noticing pushes of my RouterPage but not the tabs. As per my AutoRoute config:

        AutoRoute(
          page: RouterPage.page,
          initial: true,
          path: '/',
          children: <AutoRoute>[
            AutoRoute(page: DemoPage.page, path: 'demo'),
            AutoRoute(page: SentryPage.page, path: '', initial: true),
            AutoRoute(
              page: SettingsPage.page,
              path: 'settings',
            ),
          ],
        ),

It tracks pushes of a new page but doesn’t go deep enough to figure out what page/tab is pushed. The breadcrumbs then look something like this

RouterPage -> RouterPage -> RouterPage -> RouterPage…

instead of

SentryPage -> DemoPage -> SettingsPage -> SentryPage…

I have tried to implement it myself using the already addressed need of tracking tab changes using AutoRouterObserver

import 'dart:async';

import 'package:auto_route/auto_route.dart';
import 'package:flutter/material.dart';
import 'package:sentry_flutter/sentry_flutter.dart';

class SentryRouteObserver extends AutoRouterObserver {
  @override
  void didPush(Route route, Route? previousRoute) {
    super.didPush(route, previousRoute);
    unawaited(
      Sentry.addBreadcrumb(
        Breadcrumb(
          message: 'Navigated to ${route.settings.name}',
          category: 'navigation',
          data: {
            'state': 'didPush',
            'to': route.settings.name,
          },
        ),
      ),
    );
  }

  @override
  void didPop(Route route, Route? previousRoute) {
    super.didPop(route, previousRoute);
    unawaited(
      Sentry.addBreadcrumb(
        Breadcrumb(
          message: 'Navigated to ${route.settings.name}',
          category: 'navigation',
          data: {
            'state': 'didPop',
            if (previousRoute?.settings.name != null) 'from': previousRoute!.settings.name else 'to': route.settings.name,
          },
        ),
      ),
    );
  }

  @override
  void didReplace({Route? newRoute, Route? oldRoute}) {
    super.didReplace(newRoute: newRoute, oldRoute: oldRoute);
    unawaited(
      Sentry.addBreadcrumb(
        Breadcrumb(
          message: 'Navigated to ${newRoute!.settings.name}',
          category: 'navigation',
          data: {
            'state': 'didPush',
            if (newRoute.settings.name != null) 'to': newRoute.settings.name else 'from': oldRoute?.settings.name,
          },
        ),
      ),
    );
  }

  // only override to observer tab routes
  @override
  void didInitTabRoute(TabPageRoute route, TabPageRoute? previousRoute) {
    unawaited(
      Sentry.addBreadcrumb(
        Breadcrumb(
          message: 'Navigated to ${route.name}',
          category: 'navigation',
          data: {
            'state': 'didPush',
            if (previousRoute?.name != null) 'from': previousRoute?.name,
            'to': route.name,
          },
        ),
      ),
    );
  }

  @override
  void didChangeTabRoute(TabPageRoute route, TabPageRoute previousRoute) {
    unawaited(
      Sentry.addBreadcrumb(
        Breadcrumb(
          message: 'Navigated to ${route.name}',
          category: 'navigation',
          data: {
            'state': 'didPush',
            'from': previousRoute.name,
            'to': route.name,
          },
        ),
      ),
    );
  }
}

And while with this approach the breadcrumbs show the navigation, it’s not tracked either by view_names attribute in the App’s context (in sentry’s issue overview) nor is it tracked by the transaction tag.

I feel like I’m going in the wrong direction.

So then I looked inside the SentryNavigationObserver code and understood that creating this manually is definitely not the correct way to approach it. And even if I did, It is inevitable that it will break. And that’s why I’m here. What is the correct way to approach this and how can I track tab changes in sentry while using auto_route?