VS Code Extension to automatically fix and increment tabIndex and startTabIndex in HTML files.Designed for forms and dynamic components, it respects -1 values, handles paired fields, and adds configurable jumps for dynamic sections. Fully customizable via settings for team-specific needs.
Installation
Launch VS Code Quick Open (Ctrl+P), paste the following command, and press enter.
A VS Code extension to automatically fix and increment tabIndex or your custom attributes in HTML files. Designed for forms and dynamic components, it respects -1 values, handles paired fields, and offers configurable jumps for dynamic sections. Fully customizable via settings to meet team-specific needs.
Features
Automatic Fixing: Increments tabIndex values sequentially while preserving -1 values.
Custom Attributes: Supports custom index attributes via a dedicated command.
Preview Mode: Shows a diff preview before applying changes.
Team Customization: Adjustable settings for tailored workflows.
Installation
Install TabIndexFixer through the VS Code Marketplace.
Usage
Open a file in VS Code.
Open the Command Palette with Ctrl+Shift+P (or Cmd+Shift+P on macOS).
Select one of the following commands:
Fix TabIndex 🔢: Automatically fixes and increments tabIndex values with a preview.
Force Fix TabIndex 🔢: Applies fixes without prompting for preview (use with caution).
Fix Custom Index Attribute 🔢: Allows you to specify a custom attribute name (e.g., data-index) and fix its values.
Review the diff preview (if applicable) and choose to Apply Changes or Cancel.
Example Workflow
Open an HTML file with <input tabIndex="1"> and <input tabIndex="2">.
Run Fix TabIndex to see a preview with incremented values (e.g., tabIndex="1", tabIndex="2", etc.).