Skip to content

Bug Bash

Jump to bottom
Cindy Zhang edited this page Aug 12, 2026 · 4 revisions

Astryx Quality Checklist

Quality patterns distilled from the February 2026 bug bash — the things a room full of people actually found when they sat down and used the components.

This is not the review checklist. For reviewing a PR or auditing a component, use Component Audit Rubric: it carries the same ground with a severity, an enforcement mechanism and a score per check. Read this page as what tends to go wrong, to sharpen your eye before you look.

Storybook

  • Every prop with finite values has a working control that actually updates the component
  • Description is present, human-written, and explains what the component does
  • Code examples at the top of the story render correctly (no parsing issues)
  • All prop variants, status states, and loading states have at least one story
  • Interactive behavior is demonstrated (scrolling, dragging, toggling)

Spacing & Sizing

  • Padding, height, and border-radius values match design tokens exactly
  • Size variants (sm/md/lg) have reasonable visual progression — no jarring jumps
  • Clickable areas are consistent with sibling elements; nav items have uniform edge padding

Prop API

  • Similar props use the same name across components (don't mix onChange / onValueChange / changeAction)
  • Mutually exclusive booleans should be a single enum
  • All form elements using Field expose the same field-level props (description, status, statusMessage)
  • isLabelHidden hides all label-adjacent content, not just the label

Visual

  • Component looks correct in both light and dark themes
  • Hover/focus states have sufficient contrast (especially on primary/filled variants)
  • Arrows/chevrons point the correct direction for expand/collapse state
  • Icons use the correct variant (outline vs filled per design guidance)

Layout

  • Components render correctly on both surface and wash backgrounds
  • Scrolling content scrolls; drag interactions release cleanly
  • Text and icons are vertically centered with siblings

Accessibility

  • Keyboard navigation works for all interactive elements
  • Any hover-triggered preview also works via keyboard focus
  • Autocomplete is disabled on inputs where it doesn't make sense

Naming

  • Names are clear and standard, not internal jargon
  • Size/density variant names are neutral (sm/md/lg)

Severity Guide

Severity Criteria Rubric equivalent
P0 Component doesn't render, crashes, or core feature is non-functional BLOCK
P1 Significant visual or functional bug visible to most users BLOCK
P2 Cosmetic issue, missing story, or confusing API FIX or NIT
P3 Polish — naming, description cleanup, story organization NIT

Priority Components

Highest-traffic for early adopters: Button, TextInput, Dialog, Table, Avatar, Card, Banner

Clone this wiki locally