Release readiness review

About this example

A worked example of commentable-html layered checklists. Click any state box to cycle it blank → check → cross → question. A parent row aggregates its children automatically, and clicking a parent pushes its state down to every child. Changes are saved in this browser and collected into the Copy all bundle so an agent can cement them back into the source with tools/checklist_apply.py.

Sign-off checklist (nested list)

Hierarchy comes from the nested lists here. Toggle the leaves and watch each area - and the top-level row - re-aggregate. Set every child of an area to the same state and the area adopts it; leave them mixed and the area shows a neutral dash.

  • Backend
    • Database migrations applied and reversible
    • Load test meets the p99 latency target
    • Feature flags default to the safe state
  • Frontend
    • Accessibility audit passes (keyboard and screen reader)
    • All new strings are localized
  • Release notes and customer docs updated
  • Rollback plan rehearsed with on-call

Component audit (sortable table)

The same four-state control works in a table. Rows link to their parent with data-cmh-parent instead of nesting, so the hierarchy survives even after you sort a column. Try sorting by Owner, then toggle a control: the parent still aggregates correctly.

StateControlOwner
NetworkDana
Firewall rules reviewedRavi
TLS 1.2+ enforced end to endRavi
IdentityMei
MFA required for admin rolesMei
Secrets rotated within 90 daysPriya

How to use this

  • Click a state box (or focus it and press Enter or Space) to cycle its state.
  • Click a parent box to set every child to the same state at once.
  • Open the comments panel: each checklist with changes shows a card with jump and Reset buttons, placed in document order alongside any comments.
  • Click Copy all to hand the state changes to an agent, or Export as Portable to share a copy with the states baked into the HTML.

You can still comment on any item's label text - only the icon control itself is excluded from selection.