# Alpine.js DevTools Pro > DevTools extension for debugging Alpine.js applications. Canonical page: [https://chrome-stats.com/d/alpine-js-devtools-pro](https://chrome-stats.com/d/alpine-js-devtools-pro) ## Overview - **ID:** `alpine-js-devtools-pro` - **Platform:** Firefox - **Type:** Firefox add-on - **Status:** Available - **Publisher:** Bartek Igielski - **Category:** web-development - **Daily users:** 50 - **Weekly downloads:** 1 - **Rating:** 5.00 / 5 (2 ratings) - **Version:** 1.1.3 - **Last updated:** 2026-06-12 - **First published:** 2025-08-17 - **Size:** 189 KB - **Data as of:** 2026-09-05 - **Store listing:** [Firefox Add-ons Store](https://addons.mozilla.org/firefox/addon/alpine-js-devtools-pro/) - **Website:** [https://alpinejs.pro/contact](https://alpinejs.pro/contact) ## Description Debug Alpine.js apps with a proper tool Alpine.js DevTools Pro adds a clean, professional panel to your Firefox DevTools that makes debugging Alpine.js applications actually enjoyable. WHAT YOU GET See everything happening in your Alpine.js app • View all your components in a nice tree structure • Check component data, methods, and attributes in real-time • Edit values directly and watch your page update instantly • Hover over components to highlight them on the page Never miss an event again • Record all Alpine.js events as they happen • See exactly what data each event carries • Pause recording when you need to focus • Clear the history when things get messy Manage your Alpine stores like a pro • All your Alpine.store() instances in one place • Edit store values on the fly • Works with simple values and complex objects • Watch everything update across your entire app WHY THIS EXTENSION EXISTS Debugging Alpine.js apps used to mean console.log everywhere and guessing what's in your component data. This extension gives you complete visibility into your Alpine.js app without the guesswork. WHAT YOU CAN EXPECT It just works • Automatically detects Alpine.js on any page • Zero setup required • Handles large apps smoothly • Built for performance and stability Professional quality • Handles complex data structures properly • Stable performance you can rely on • Regular updates and real support • Built for actual production projects Clean interface • Light and dark themes (follows your system preference) • Everything where you'd expect to find it • No cluttered UI or confusing buttons • Focused on getting work done PERFECT FOR KEY FEATURES AT A GLANCE ✓ Component inspector - See all your Alpine components and their data ✓ Live editing - Change values and see instant results ✓ Event monitoring - Catch every event with full details ✓ Store management - Debug Alpine stores easily ✓ Element correlation - Click to inspect in DOM ✓ Real-time updates - Everything syncs automatically ✓ Livewire support - Full integration with server-side events ✓ Performance optimized - Won't slow down your development ✓ Dark/light themes - Whatever you prefer ✓ Professional licensing - For commercial use HOW IT HELPS YOUR WORKFLOW • See all component data organized clearly • Watch events happen in real-time • Edit values directly in DevTools • No more console spam Common debugging tasks made easy: • "Why isn't this component updating?" → Check the component data in real-time • "Did this event fire?" → Watch the event monitor • "What's in my Alpine store?" → See all stores and their contents • "Which component is this element?" → Hover and highlight FREE TO TRY, FAIR TO PRICE Install it and try it out on your projects. No artificial limitations or naggy trial popups. For commercial use, you'll need a license. It's reasonably priced and works on up to 3 devices. You can manage everything from your account dashboard. SUPPORT AND UPDATES • Regular updates with new features and bug fixes • Responsive support when you need help • Built by people who actually use Alpine.js daily • Continuously improved based on user feedback ## Rankings - #16,087 — Overall - #67 — component - #89 — debug - #161 — tools ## Permissions and access ### Permissions - `scripting` - `storage` ### Host permissions - `https://*/*` - `http://*/*` ### Content script matches - `*` ## Safety - **Risk impact:** Moderate risk impact - **Risk likelihood:** Moderate risk likelihood ### Analysis details - Allows access to all websites, posing a significant security risk as it can monitor and modify data from any visited site. - This extension has low user count. Unpopular extensions may not be stable or safe. > Some risk analysis details are omitted from this free response. [Upgrade to view the full analysis](https://chrome-stats.com/pricing). ## Similar extensions and apps - [Alpine.js devtools](https://chrome-stats.com/d/alpinejs-devtools) — 1,029 users, 4.71 / 5 - [Ext JS 3 DevTools](https://chrome-stats.com/d/ext-js-3-devtools) — 4 users - [DevTools Companion for Angular](https://chrome-stats.com/d/devtools-companion-for-angular) — 1 users - [Vue.js devtools](https://chrome-stats.com/d/vue-js-devtools) — 56,270 users, 4.70 / 5 - [Vue.js devtools](https://chrome-stats.com/d/vue-js-devtls) — 19 users - [Angular DevTools](https://chrome-stats.com/d/angular-devtools) — 9,249 users, 3.35 / 5 - [Preact Developer Tools](https://chrome-stats.com/d/preact-devtools) — 476 users, 5.00 / 5 - [JSDebugPro](https://chrome-stats.com/d/jsdebugpro) — 1 users - [Apollo Client Devtools](https://chrome-stats.com/d/apollo-developer-tools) — 5,820 users, 3.93 / 5 - [PixiJS Devtools](https://chrome-stats.com/d/pixijs-devtools) — 268 users - [Svelte Devtools](https://chrome-stats.com/d/svelte-devtools) — 1,261 users, 4.17 / 5 - [Anti Anti Debug](https://chrome-stats.com/d/anti-anti-debug) — 312 users, 5.00 / 5 --- Source: [Chrome-Stats](https://chrome-stats.com/d/alpine-js-devtools-pro)