Web Frontend Code Review Patterns

Load these checks for browser-targeted HTML, CSS, JavaScript, TypeScript, JSX, and TSX. Confirm the rendering/runtime path from source and relevant framework configuration; apply TypeScript checks alongside these checks when applicable.

Read Review principles before applying these checks; it defines authority, applicability, evidence, and blocking criteria.

Accessibility

• Every interactive element (button, link, input, select) must have an accessible name — either visible text, aria-label, or aria-labelledby
• Verify focus behavior for the component's semantics: modal interaction needs appropriate containment and restoration; do not impose a modal focus trap on an ordinary nonmodal panel.
• Check text contrast and large-text eligibility against the target's applicable accessibility standard; record the actual foreground/background and sizing evidence rather than guessing from visual appearance.
• Icon-only buttons without visible text must have aria-label or a visually-hidden text span
• Verify form controls have programmatically associated names/labels appropriate to their semantics; visual proximity alone does not establish that relationship.
• Images conveying information must have descriptive alt text; decorative images use alt=""
• Keyboard navigation must work — focus order must follow visual order, no focus traps outside intentional modal patterns