Skip to content

Stopwatch — start, pause, reset, and lap with precise timing #162

@venisha-kalola

Description

@venisha-kalola

Project slug (e.g., snake, todo)

stopwatch

Summary

Implement a high-precision stopwatch using performance.now() or requestAnimationFrame with start/pause/reset/lap.

Details / Acceptance criteria

Acceptance Criteria:

  • Start/pause/resume/reset controls work.
  • Laps list shows timestamp and delta since previous lap.
  • Time format: mm:ss.mmm (zero-padded).
  • Continues to display accurate time when tab is inactive.
  • Keyboard shortcuts: Space (start/pause), L (lap), R (reset).
  • Accessible buttons with roles/labels.

Files:

  • projects/stopwatch/index.html
  • projects/stopwatch/styles.css
  • projects/stopwatch/main.js

Tasks:

  • Render time and controls.
  • Timing loop using performance.now() delta.
  • Manage laps array and render list.
  • Add keyboard handlers and focus states.

Scope

  • UI changes
  • Logic changes
  • Accessibility
  • Tests (manual)

Metadata

Metadata

Assignees

Type

No type

Projects

No projects

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions