Use stable data-report-id values

Add stable names to high-value review targets without changing layout or logic.

Tip

Help me follow the Use stable data-report-id values guide. Add stable names to high-value review targets without changing layout or logic. Review the current project and turn this guidance into concrete next steps.

NAMING

Tagging rules

  • Use kebab-case letters, numbers, and hyphens.
  • Prefer route-section-role.
  • Use a stable id or slug instead of a list index.
  • Start with headers, footers, nav, major sections, buttons, links, and inputs.
  • Do not add wrapper elements only for tagging.
  • Add data-report-type only when the team has a policy.
tsx
<section data-report-id="pricing-hero" data-report-type="group">  <button data-report-id="pricing-hero-cta">Get started</button></section>

Hidden modals and tabs

Connect matching data-fp-view and data-fp-open values. Nested views are restored from the outside in.

Read the DOM attribute reference