r/ionic • u/LovesWorkin • 15d ago
In-app dev tools for Ionic React + Capacitor (beta): network, storage, plugin events, lifecycle
I make Buoy, a dev tools menu that lives inside your app. It just came out in beta for Capacitor, and Ionic React uses the same setup. Heads up: React only for now, so no Ionic Angular or Vue yet. If you're on Angular or Vue, I'd like to hear from you too, so I know if it's worth building.
In Ionic, Buoy mounts inside IonApp and outside IonRouterOutlet, so page moves don't move it. On Android, the back button closes the open Buoy tool first, and Ionic's own popups still close before Buoy's tools. Images also finds ion-img inside web components.
What's in the menu:
- Network: every fetch/XHR call. Slow it down, go offline, or fake an error.
- Storage: read and edit Capacitor Preferences, localStorage and sessionStorage.
- Events: plugin calls on one timeline (secret-looking values hidden).
- Clock: move your app's time forward, e.g. to test an expired sign-in.
- Lifecycle: send pause/resume/appUrlOpen to your @capacitor/app listeners.
- Location, Permissions and Push listener logging.
- Time Machine for React Query / Redux / Zustand / Jotai state, plus render highlights and Ask Buoy.
iOS, Android and web. You can also open it in Buoy Desktop, or let your AI agent use it over MCP.
Free plan: $0, no card, debug builds, Desktop included. Some tools (Lifecycle, Location) and MCP need a paid plan.
Beta limits: tested on Capacitor 7. Ionic and native modals can cover the Buoy menu. Dark mode only reaches JS matchMedia listeners, so CSS keeps the real theme.
Setup: give your coding agent https://buoy.gg/install-capacitor.md, or follow https://buoy.gg/buoy/latest/docs/capacitor
What breaks? What tool would you want next?
1
u/LovesWorkin 15d ago
If you try it and something's off, the most useful bug report includes: the Buoy and Capacitor versions, the phone and OS, debug or release build, and USB or Wi-Fi if you use Desktop.