Inertia DevTools Arrives on Firefox
Firefox developers building Inertia.js applications no longer need to switch browsers to get a proper debugging experience. Inertia DevTools is now available on the Firefox Add-ons store, bringing complete feature parity with the existing Chrome extension.
What the Extension Does
Once installed, the extension adds a dedicated Inertia panel inside Firefox DevTools. The panel records every visit your application makes, including:
- Initial page loads
- Client-side navigations
- Partial reloads
- Deferred and optional props
- Polls and prefetches
- Redirects
Follow-up requests are grouped under the visit that triggered them, keeping the timeline clean instead of scattering related requests across the list.
Inspecting Props and Page State
Selecting any recorded visit reveals its props rendered as a tree. Each prop node is annotated with badges indicating whether it is deferred, optional, merged, or shared. Alongside the prop tree you get:
- Full request and response headers and bodies
- The matched route and controller action
- The complete Inertia page state after the response was handled
Editor Deep Links
Render calls, shared props, and route actions include direct links back to the exact file and line in your editor. Supported editors are:
- VS Code
- PhpStorm
- Cursor
- Sublime Text
- Zed
Privacy and Security
Authorization headers, cookie headers, CSRF tokens, and other sensitive fields are redacted automatically before they appear in the panel. All recorded data stays on your local machine.
How It Works Under the Hood
Recording is driven by the Inertia backend adapter rather than browser-level request interception. This means setup and behaviour are identical to the Chrome extension once your Laravel (or other Inertia-compatible) application is running locally.
Getting Started
- Install the extension from the Firefox Add-ons store.
- Open Firefox DevTools (
F12or right-click → Inspect). - Select the Inertia panel from the DevTools tab bar.
- Load or navigate your local application — visits will appear in the timeline immediately.
No additional configuration is required beyond having a working Inertia backend adapter in your project.
Key Takeaways
- Inertia DevTools is now available for Firefox with full parity to the Chrome extension.
- The panel records all visit types and groups follow-up requests under their parent visit.
- Props are displayed as a tree with deferred, optional, merged, and shared badges.
- Editor deep links work with VS Code, PhpStorm, Cursor, Sublime Text, and Zed.
- Sensitive headers and tokens are redacted; data never leaves your machine.
- Recording is powered by the Inertia backend adapter, so no extra browser setup is needed.
For full setup details see the Inertia DevTools documentation and the GitHub repository.
Source: Inertia DevTools Now Available for Firefox – Laravel News
