The Php Times

Inertia DevTools ist jetzt im Chrome Web Store verfügbar. Die Erweiterung fügt den Chrome DevTools ein „Inertia"-Panel hinzu, das jeden Inertia-Visit aufzeichnet und anzeigt, was gesendet und empfangen wurde.

Die Requests erscheinen in einer Timeline auf der linken Seite, mit Live-Anzeige für laufende Anfragen. Filterbar ist nach Methode, Request-Typ oder Status; die Suche durchsucht URLs und Komponenten. Zusammengehörige Requests — ein Visit plus Partial Reloads, Deferred Loads, Polls, Prefetches und Precognition-Validierungen — werden zu einem Eintrag gruppiert.

Bei Auswahl eines Requests öffnen sich vier Tabs: Props zeigt alle Props als Baum mit Badges für deferred, optional, merged und shared; HTTP zeigt Request- und Response-Header und -Bodies; Route zeigt Route-Name, URI und Controller-Action; Page zeigt den vollständigen Seitenzustand inklusive per Partial Reload gemergter Daten. Dateireferenzen verlinken in den Editor — VS Code, PhpStorm, Cursor und Zed funktionieren out of the box, Sublime Text benötigt einen URL-Scheme-Handler wie SublimeUrl.

Clientseitige Visits und aus dem Prefetch-Cache bediente Requests werden als eigene Timeline-Einträge aufgezeichnet. Einträge landen in storage/inertia-devtools, werden automatisch aufgeräumt und sind über devtools.storage in config/inertia.php konfigurierbar. Nichts wird an einen Remote-Dienst gesendet; sensible Prop-Keys und Header werden vor dem Speichern maskiert (devtools.redact), Tooling-Routen wie Telescope und Horizon sind ausgeschlossen.

Ein Package muss nicht installiert werden: Der Recorder steckt im Client-Adapter ab ^3.6 und im Laravel-Adapter ab ^3.2. Extension installieren, Chrome DevTools öffnen, Inertia-Panel wählen und für volle Funktionalität den Vite-Dev-Server laufen lassen. Dokumentation auf inertiajs.com, Quellcode auf GitHub unter MIT-Lizenz.