Item logo image for FirstTx DevTools

FirstTx DevTools

Item media 3 (screenshot) for FirstTx DevTools
Item media 1 (screenshot) for FirstTx DevTools
Item media 2 (screenshot) for FirstTx DevTools
Item media 3 (screenshot) for FirstTx DevTools
Item media 1 (screenshot) for FirstTx DevTools
Item media 1 (screenshot) for FirstTx DevTools
Item media 2 (screenshot) for FirstTx DevTools
Item media 3 (screenshot) for FirstTx DevTools

Overview

Browser DevTools for debugging FirstTx apps

# FirstTx DevTools The official debugging companion for FirstTx - a library that eliminates blank loading screens in CSR applications. ## Why You Need This Without DevTools, debugging FirstTx feels like flying blind, ❌ "Why didn't prepaint restore?" ❌ "Which model triggered sync?" ❌ "Did my transaction rollback?" With FirstTx DevTools, you see everything, ✅ Timeline view showing exact timing ✅ Transaction grouping with rollback visualization ✅ Model sync triggers with duration ✅ Advanced filtering by category and priority ## Key Features ### 1. Timeline Visualization - 4-lane layout for Prepaint, Model, Tx, and System events - Automatic time scaling with smart intervals - Event grouping by transaction and model ### 2. Advanced Filtering - Filter by category (All/Prepaint/Model/Tx/System) - Filter by priority (All/Low/Normal/High) - Full-text search across events - Error-only toggle for quick debugging ### 3. Event Detail - Collapsible JSON view - Copy-to-clipboard for data - Priority and category badges - Formatted timestamp display ### 4. Resizable Panel - Drag-to-resize event detail panel - LocalStorage persistence - Smooth resize interaction ## Requirements - Apps using @firsttx/prepaint - Apps using @firsttx/local-first - Apps using @firsttx/tx ## Get Started 1. Install the extension 2. Open DevTools (F12) 3. Find "FirstTx" tab 4. Interact with your app to see events ## Open Source GitHub: https://github.com/joseph0926/firsttx MIT License ## Support Questions? Issues? Visit our GitHub repo or email [joseph0926.dev@gmail.com]

Details

  • Version
    0.1.0
  • Updated
    October 28, 2025
  • Offered by
    rkekqmf0926
  • Size
    263KiB
  • Languages
    English
  • Developer
    Email
    rkekqmf0926@gmail.com
  • Non-trader
    This developer has not identified itself as a trader. For consumers in the European Union, please note that consumer rights do not apply to contracts between you and this developer.

Privacy

The developer has disclosed that it will not collect or use your data. To learn more, see the developer’s privacy policy.

This developer declares that your data is

  • Not being sold to third parties, outside of the approved use cases
  • Not being used or transferred for purposes that are unrelated to the item's core functionality
  • Not being used or transferred to determine creditworthiness or for lending purposes

Support

For help with questions, suggestions, or problems, visit the developer's support site

Related

Vue.js devtools

2.7

Browser DevTools extension for debugging Vue.js applications.

axe DevTools - Web Accessibility Testing

3.9

Accessibility Checker for Developers, Testers, and Designers in Chrome

TanStack Query DevTools

3.3

DevTools extension for debugging TanStack Query applications. Inspect queries, mutations, and cache state in real-time.

Marker.io: Visual bug reporting for websites

4.3

Report visual bugs directly into your favorite tools, without leaving your website or web app

Ciphix Mendix dev tools

4.2

A must-have dev tool for any Mendix application (formerly know as the Bizzomate Mendix dev tools).

Apex Debugger

4.2

Debug Salesforce apex code with ease

Solid Devtools

5.0

Chrome Developer Tools extension for debugging SolidJS applications.

Web Inspector

5.0

Use Web Inspector: Easily inspect element, use devtools, harness developer tooling and activate chrome debugger for work.

Svelte DevTools

3.3

Browser DevTools extension for debugging Svelte applications.

GrowthBook DevTools

3.3

GrowthBook DevTools helps you debug feature flags and experiments and design A/B tests visually — all from your browser.

BrowserStack Bug Capture: Report & resolve bugs faster

4.8

Bug reporting tool with shareable screen recordings & screenshots for faster debugging.

Nuxt Assistant

4.8

Nuxt Assistant — developer-friendly debugging tool for Nuxt apps

Vue.js devtools

2.7

Browser DevTools extension for debugging Vue.js applications.

axe DevTools - Web Accessibility Testing

3.9

Accessibility Checker for Developers, Testers, and Designers in Chrome

TanStack Query DevTools

3.3

DevTools extension for debugging TanStack Query applications. Inspect queries, mutations, and cache state in real-time.

Marker.io: Visual bug reporting for websites

4.3

Report visual bugs directly into your favorite tools, without leaving your website or web app

Ciphix Mendix dev tools

4.2

A must-have dev tool for any Mendix application (formerly know as the Bizzomate Mendix dev tools).

Apex Debugger

4.2

Debug Salesforce apex code with ease

Solid Devtools

5.0

Chrome Developer Tools extension for debugging SolidJS applications.

Web Inspector

5.0

Use Web Inspector: Easily inspect element, use devtools, harness developer tooling and activate chrome debugger for work.

Google apps