webase_chucker

An in-app HTTP inspector for Dio — like Chucker, but with one-line integration.

• 🔘 Draggable floating button with a live request-count badge, injected automatically — no builder, no navigatorObserver, no navigator key
• 🔔 Live status notification (🔄 2 Active • ✅ 14 • ❌ 1) that opens the inspector when tapped
• 📋 Request / Response / Status / cURL tabs with copy-to-clipboard
• 🖼️ Smart body rendering: JSON, FormData (fields + files), image previews, binary hex dump
• ⏱️ Detects hung requests (configurable timeout → shown as 408) and offline errors
• 🐞 Enabled in debug builds by default; opt-in for tester (release) builds

Demo

Live status notification:

Getting started

dependencies:
  webase_chucker: ^0.1.2

Android: enable core library desugaring (required)

webase_chucker uses flutter_local_notifications for the status notification, which requires core library desugaring. Desugaring is a compile option of your app module — a plugin cannot turn it on for you — so you must enable it in your app even after adding webase_chucker to pubspec.yaml. Otherwise the Android build fails with:

Dependency ':flutter_local_notifications' requires core library desugaring
to be enabled for :app.

In android/app/build.gradle.kts (Kotlin DSL):

android {
    compileOptions {
        isCoreLibraryDesugaringEnabled = true
    }
}

dependencies {
    coreLibraryDesugaring("com.android.tools:desugar_jdk_libs:2.1.4")
}

Or in android/app/build.gradle (Groovy):

android {
    compileOptions {
        coreLibraryDesugaringEnabled true
    }
}

dependencies {
    coreLibraryDesugaring 'com.android.tools:desugar_jdk_libs:2.1.4'
}

desugar_jdk_libs 2.1.x needs Android Gradle Plugin 8.4+. On an older AGP, use com.android.tools:desugar_jdk_libs:2.0.4 instead.

No setup is needed for iOS. See example/android/app/build.gradle.kts for a complete working configuration.

Usage

One line:

dio.interceptors.add(WebaseChucker.interceptor);

That's it. The floating button appears over your app as soon as the first request fires, the notification keeps updating, and tapping either opens the inspector.

Configuration (optional)

void main() {
  // All optional — shown with their defaults.
  WebaseChucker.enabled = kDebugMode;    // set true to expose in tester builds
  WebaseChucker.showFloatingButton = true;
  WebaseChucker.showNotification = true;
  WebaseChucker.notificationTitle = 'Webase chucker';
  WebaseChucker.requestTimeout = const Duration(seconds: 24);

  runApp(const MyApp());
}

Opening the inspector yourself

WebaseChucker.open();                 // e.g. from your own debug menu
Navigator.push(context, MaterialPageRoute(builder: (_) => const WebaseChuckerPage()));
WebaseChucker.clear();                // wipe captured requests

How the one-line integration works

webase_chucker locates your app's root Navigator from the widget tree at runtime and injects the floating button into its Overlay. Inspector screens are pushed onto that same navigator, so it works with MaterialApp, MaterialApp.router, and custom setups without any wiring.

Notifications

Notifications use flutter_local_notifications, which requires core library desugaring on Android. No manifest changes are needed for the basic status notification; the runtime notification permission (Android 13+ / iOS) is requested automatically on the first captured request. Set WebaseChucker.showNotification = false if you only want the floating button.

Releasing to testers

The inspector is off in release builds by default. To expose it in builds you hand to testers (sideloaded APKs, TestFlight), flip the switch based on your own detection logic:

WebaseChucker.enabled = kDebugMode || await isTesterBuild();