noibu_flutter 0.1.0-rc.2-SNAPSHOT

Noibu session replay SDK for Flutter. Captures user sessions and replays them in the Noibu dashboard for debugging.

Noibu Flutter SDK

Session replay SDK for Flutter. Captures user sessions and replays them in the Noibu dashboard for debugging.

Installation

Add to your pubspec.yaml:

dependencies:
  noibu_flutter: ^0.1.0

Android

Set minSdkVersion to 26 or higher in android/app/build.gradle:

android {
    defaultConfig {
        minSdkVersion 26
    }
}

iOS

Set the platform to iOS 16.0 or higher in your Podfile:

platform :ios, '16.0'

Usage

Initialize

import 'package:noibu_flutter/noibu_flutter.dart';

void main() async {
  WidgetsFlutterBinding.ensureInitialized();

  await NoibuSessionReplay.instance.initialize(
    const NoibuConfiguration(domain: 'your-domain.noibu.com'),
  );

  runApp(NoibuSessionReplay.instance.wrapWithCapture(child: MyApp()));
}

Navigation tracking

The SDK provides two ways to track navigation.

Option 1 — Navigation observer (only works with named routes):

MaterialApp(
  navigatorObservers: [
    NoibuSessionReplay.instance.navigationObserver,
  ],
)

Option 2 — Manual tracking (recommended when using MaterialPageRoute without named routes):

await NoibuSessionReplay.instance.didNavigate(pageName: 'ProductDetail');
Navigator.push(context, MaterialPageRoute(builder: (_) => ProductDetailScreen()));

Important: If you use MaterialPageRoute without a RouteSettings(name: ...), the navigation observer will not register the view. Use didNavigate manually in that case. This is especially important when using WebView tracking, as NoibuInAppWebView requires an active view to capture events correctly.

HTTP Tracking

To capture network requests automatically, call enableHttpTracking() after initialize(). This intercepts all dart:io HttpClient requests globally, including those made via package:http, Dio with the default adapter, and any other library that delegates to dart:io.

void main() async {
  WidgetsFlutterBinding.ensureInitialized();

  await NoibuSessionReplay.instance.initialize(
    const NoibuConfiguration(domain: 'your-domain.noibu.com'),
  );

  NoibuSessionReplay.instance.enableHttpTracking();

  runApp(NoibuSessionReplay.instance.wrapWithCapture(child: MyApp()));
}

You can optionally suppress capture for specific URLs and control body capture:

NoibuSessionReplay.instance.enableHttpTracking(
  ignoreUrlPatterns: [RegExp(r'analytics\.example\.com')],
  captureBodies: false,
);

WebView Tracking

Use NoibuInAppWebView as a drop-in replacement for InAppWebView. It automatically injects the rrweb capture scripts and bridges WebView events into the session replay pipeline.

import 'package:noibu_flutter/noibu_flutter.dart';

NoibuInAppWebView(
  initialUrlRequest: URLRequest(url: WebUri('https://example.com')),
  onLoadStop: (controller, url) {
    // your existing onLoadStop logic
  },
)

Important: Call didNavigate before pushing the screen that contains NoibuInAppWebView. This ensures an active view is registered before the WebView initializes, which is required for the backend stitcher to splice the captured page content at the correct slot.

void openWebView(BuildContext context, String title, String url) {
  NoibuSessionReplay.instance.didNavigate(pageName: title);
  Navigator.push(context, MaterialPageRoute(
    builder: (_) => MyWebViewScreen(url: url),
  ));
}

For advanced cases where NoibuInAppWebView does not expose a parameter you need, use the lower-level API:

InAppWebView(
  initialUserScripts: UnmodifiableListView([
    ...await NoibuWebViewTracking.initialUserScripts(),
  ]),
  onWebViewCreated: (controller) async {
    await controller.enableNoibuTracking();
  },
)

Custom attributes

Attach metadata to the current session. Returns a String with the result status:

final result = await NoibuSessionReplay.instance.addCustomAttribute('userId', '12345');

Error reporting

Report errors to the Noibu dashboard:

await NoibuSessionReplay.instance.addError(
  'Payment failed',
  stack: StackTrace.current.toString(),
);

Privacy

Control what gets captured:

await NoibuSessionReplay.instance.initialize(
  const NoibuConfiguration(
    domain: 'your-domain.noibu.com',
    privacyMode: NoibuPrivacyMode.maskAll, // maskAll, maskSensitive, allowAll
  ),
);

The default privacy mode is maskSensitive.

Shutdown

await NoibuSessionReplay.instance.shutdown();

Requirements

Platform	Minimum version
Android	API 26 (Android 8.0)
iOS	16.0
Flutter	3.27.0
Dart	3.6.0

License

MIT License. See LICENSE for details.