Data Attribute Highlighter
Highlight and display data attributes on hover
As of June 2026, Data Attribute Highlighter has 25 users in the Developer Tools category.
Usersdown 7.4 percent−7.4%
25
25
Ratingno change0%
—
— reviews
Reviewsno change0%
—
Version
1.3.0
Manifest V3
History
5 snapshotsTracking since Apr 18, 2026.
View as table
| Date | Users | Rating | Reviews | Version |
|---|---|---|---|---|
| Apr 18, 2026 | 27 | — | — | 1.3.0 |
| May 3, 2026 | 25 | — | — | 1.3.0 |
| May 12, 2026 | 30 | — | — | 1.3.0 |
| May 24, 2026 | 27 | — | — | 1.3.0 |
| Jun 6, 2026 | 26 | — | — | 1.3.0 |
| Now | 25 | — | — | 1.3.0 |
Permissions & access
- Permissions
- storageactiveTabclipboardWrite
- Host access
- None declared
Screenshots
About
A powerful Chrome extension for developers and QA testers that highlights HTML elements with data attributes on hover. ✨ KEY FEATURES: • Smart hover detection - automatically highlights elements with your specified data attribute • Beautiful tooltips - displays attribute names and values in an elegant gradient design • Keyboard shortcuts - toggle highlighting with Ctrl+Shift+H (Cmd+Shift+H on Mac) • Configurable attributes - works with data-testid, data-cy, data-qa, or any custom data attribute • Copy on demand - hold ⌘ (Mac) or Alt (Windows/Linux) and click to copy attribute values to clipboard • DOM tree search - intelligently searches parent elements to find data attributes • Zero interference - regular clicks work normally, only modified clicks trigger copy • Toggle on/off - easily enable or disable the highlighter with a click or keyboard shortcut • Modern UI - sleek popup with gradient design and smooth animations 🎯 PERFECT FOR: • Testing with Cypress, Playwright, or Jest • QA automation and test development • Frontend development and debugging • Inspecting data attributes on any webpage • Quick access to test IDs without opening DevTools 🚀 HOW IT WORKS: 1. Click the extension icon and configure your data attribute (default: data-testid) 2. Press Ctrl+Shift+H (or Cmd+Shift+H) to toggle highlighting on/off 3. Hover over elements to see purple highlights and tooltips 4. Optionally enable ⌘/Alt+Click to copy attribute values 5. Attribute values are instantly copied to your clipboard with a confirmation notification The extension enhances your workflow without interfering with normal page interactions.
Technical
- Version
- 1.3.0
- Manifest
- V3
- Size
- 15.31KiB
- Min Chrome
- 88
- Languages
- 1
- Featured
- No
Metadata
- ID
- kfediebplhmcmjhlpagefegkdfjaiiag
- Developer ID
- u3099273764ecf866f50e07f34be7fe22
- Developer Email
- [email protected]
- Created
- Oct 10, 2025
- Last Updated (Store)
- Oct 14, 2025
- Last Scraped
- Jun 6, 2026
- Website
- teceer.com
- Support URL
- —
- Privacy Policy
- https://teceer.com/privacy-policy
Similar extensions
Alternatives to Data Attribute Highlighter, ranked by description similarity.
DOM Element Highlighter
Visually identify and interact with testable DOM elements on web pages
11
AttributeScope
Highlight and copy any attribute on web pages with ease. Perfect for developers working with dynamic elements and attributes.
20
★ 5.0
Attribute Highlighter
Highlights all the elements with specific html attribute
38
Data Attribute Hover Checker
Displays data attribute values on hover
2
Attribute Scanner
Scan and highlight elements by custom attributes (e.g., data-cy for Cypress testing)
4
Element ID Highlighter
Highlights HTML elements with specific attributes like data-testid for easier debugging and testing
28
CSS Class Highlighter
Inspect and highlight CSS classes. Hover to inspect, list classes, and highlight elements.
14
Inspectify
Quickly copy HTML element data-{id}/input-id attributes for developers, QA, and designers.
18
Data sourced from the Chrome Web Store · last verified Jun 6, 2026.