add-testid

Automatically add data-testid-locator attributes to native HTML tags for test automation.

Usage

With npx (no installation required)

npx add-testid-locator <file-or-folder-path>

Examples

Single file:

npx add-testid-locator src/app/app.component.html

Entire folder:

npx add-testid-locator src/app

What it does

• Adds data-testid="tagname-randomid" to all native HTML tags
• Skips tags that already have data-testid
• Skips Angular/custom components
• Generates unique random IDs for each tag

Supported Tags

div, span, button, input, textarea, select, option, a, p, h1-h6, ul, ol, li, table, thead, tbody, tr, td, th, form, label, img, section, article, nav, header, footer, main, aside

Example

Before:

<button class="btn">Click</button>

After:

<button class="btn" data-testid="button-a3f2c8d1">Click</button>

License

MIT