‏افزونهٔ Inertia DevTools حالا روی فایرفاکس هم هست

افزونهٔ رسمی Inertia DevTools که قبلا فقط روی کروم بود، حالا تو فروشگاه افزونه‌های فایرفاکس هم اومده. به گفتهٔ تیم Inertia، نسخهٔ فایرفاکس هیچ کم و کسری نسبت به کروم نداره و همون پنل کاملو می‌ده. کافیه افزونه رو نصب کنی، DevTools فایرفاکسو باز کنی و بری سراغ تب Inertia.

کاری که این پنل می‌کنه اینه که هر visit (یعنی هر رفت‌وبرگشتی که Inertia بین مرورگر و سرور انجام می‌ده) رو ضبط می‌کنه و روی یه تایم‌لاین می‌چینه. لود اولیهٔ صفحه، جابه‌جایی بین صفحه‌ها، partial reload، deferred prop ها، poll، prefetch و ریدایرکت همه ثبت می‌شن. نکتهٔ خوبش اینه که درخواست‌های بعدی زیر همون visit ای که راه‌شون انداخته گروه می‌شن و تایم‌لاین شلوغ نمی‌شه.

وقتی روی یه مورد کلیک کنی، prop ها رو به شکل درخت می‌بینی با برچسب‌هایی که می‌گن کدوم deferred، optional، merged یا shared هست. کنارش هدر و بدنهٔ درخواست و پاسخ، route و اکشن کنترلری که مچ شده، و کل page state بعد از پردازش پاسخ هم هست. یعنی دیگه لازم نیست برای فهمیدن اینکه چه چیزی به صفحه رسیده، dd بذاری وسط کد.

رندرها، shared prop ها و اکشن‌های route هم لینک مستقیم به فایل و شمارهٔ خط تو ادیتور دارن و VS Code، PhpStorm، Cursor، Sublime Text و Zed پشتیبانی می‌شن. از نظر امنیت، هدرهای Authorization و cookie، توکن CSRF و بقیهٔ فیلدهای حساس قبل از اینکه چیزی تو پنل نشون داده شه پاک می‌شن و داده‌های ضبط‌شده هم روی همون دستگاه خودت می‌مونن. ضبط کردن رو هم خود adapter سمت بک‌اند Inertia مدیریت می‌کنه، پس مثل کروم فقط کافیه اپت لوکال بالا باشه.

نکات کلیدی:

• افزونه از Firefox Add-ons نصب می‌شه و با نسخهٔ کروم کاملا برابره
• تایم‌لاین شامل لود اولیه، ناوبری، partial reload، deferred prop، poll، prefetch و ریدایرکت
• prop ها درختی نشون داده می‌شن با برچسب deferred / optional / merged / shared
• لینک به ادیتور برای VS Code، PhpStorm، Cursor، Sublime Text و Zed
• هدر Authorization و cookie و توکن CSRF قبل از نمایش redact می‌شن و داده لوکال می‌مونه