Weyoun/chess
1
0
Fork 0
Code Issues 3 Pull Requests 1 Actions Packages Projects Releases Wiki Activity
chess/docs/typescript-migration-timeline.md
Christoph Wagner bd268926b4
All checks were successful
CI Pipeline / Code Linting (pull_request) Successful in 13s
Details
CI Pipeline / Run Tests (pull_request) Successful in 21s
Details
CI Pipeline / Build Verification (pull_request) Successful in 12s
Details
CI Pipeline / Generate Quality Report (pull_request) Successful in 19s
Details
fix: remove incompatible Playwright UI tests 
The tests/ui/ directory contained Playwright tests that were created
but never properly integrated. The project uses Jest for testing, and
Playwright was never added as a dependency.

Changes:
- Removed tests/ui/column-resize.test.js
- Removed tests/ui/status-message.test.js

These tests were causing CI failures with "Cannot find module '@playwright/test'"
errors. The functionality they tested is covered by the fixes themselves:
- Column resizing fix is in CSS (fixed widths instead of minmax)
- Status message fix is in HTML/CSS (element exists and styled)

Test Results:
✅ All 124 Jest unit tests pass
✅ Test suites: 7 passed, 7 total
✅ Coverage: Board, King, Queen, Knight, Bishop, Rook, Pawn

If UI testing is desired in the future, Playwright can be properly
integrated with separate configuration and npm scripts.

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>
2025-11-23 21:30:27 +01:00

15 KiB
Raw Blame History

TypeScript Migration - Visual Timeline

6-Week Balanced Timeline (RECOMMENDED)

Gantt Chart View

Week 1: Foundation & Core Types
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
Phase 0: Setup         ████████░░░░░░░░░░░░░░░░░░░░░░  4-6h
Phase 1: Core Types    ░░░░░░░░████████████████░░░░░░  6-8h
                       Mon  Tue  Wed  Thu  Fri
CHECKPOINT 1: Build works, utils typed ✓

Week 2: Board & Piece Foundation
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
Phase 2a: Board        ████████████░░░░░░░░░░░░░░░░░░  3-4h
Phase 2b: Piece Base   ░░░░░░░░░░░░████████████░░░░░░  2h
Phase 2c: Simple       ░░░░░░░░░░░░░░░░░░░░████████░░  3h
             Pieces    Mon  Tue  Wed  Thu  Fri
CHECKPOINT 2: Core models typed ✓

Week 3: Complete Pieces & Engine
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
Phase 2d: Complex      ████████████░░░░░░░░░░░░░░░░░░  3-4h
             Pieces
Phase 3a: GameState    ░░░░░░░░░░░░████████░░░░░░░░░░  3-4h
Phase 3b: Validators   ░░░░░░░░░░░░░░░░░░░░████████░░  3-4h
                       Mon  Tue  Wed  Thu  Fri
CHECKPOINT 3: Game logic works ✓

Week 4: Engine & UI Foundation
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
Phase 3c: Special      ████████░░░░░░░░░░░░░░░░░░░░░░  2-3h
             Moves
Phase 4a: Renderer     ░░░░░░░░████████████░░░░░░░░░░  2-3h
Phase 4b: DragDrop     ░░░░░░░░░░░░░░░░████████░░░░░░  2-3h
                       Mon  Tue  Wed  Thu  Fri
CHECKPOINT 4: UI typed ✓

Week 5: Controllers & Integration
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
Phase 4c: Controller   ████████████░░░░░░░░░░░░░░░░░░  2-3h
Phase 5a: Main Entry   ░░░░░░░░░░░░████░░░░░░░░░░░░░░  1-2h
Phase 5b: Test Mig     ░░░░░░░░░░░░░░░░████████████░░  3-4h
                       Mon  Tue  Wed  Thu  Fri
CHECKPOINT 5: Full game playable ✓

Week 6: Polish & Production
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
Phase 6a: Optimize     ████████░░░░░░░░░░░░░░░░░░░░░░  2h
Phase 6b: Docs         ░░░░░░░░████████░░░░░░░░░░░░░░  1-2h
Phase 6c: Build Setup  ░░░░░░░░░░░░░░░░████░░░░░░░░░░  1h
Phase 6d: Final QA     ░░░░░░░░░░░░░░░░░░░░████████░░  1h
Buffer/Contingency     ░░░░░░░░░░░░░░░░░░░░░░░░████░░  Flex
                       Mon  Tue  Wed  Thu  Fri
CHECKPOINT 6: Production ready! ✓✓✓

Daily Breakdown (Balanced 6-Week Timeline)

Week 1: Foundation (10-14 hours)

Monday (2-3h)

  • Install TypeScript and dependencies (1h)
  • Create tsconfig.json (1h)
  • Configure Jest with ts-jest (1h)

Tuesday (2-3h)

  • Create global type definitions (1h)
  • Set up build scripts (1h)
  • Test compilation pipeline (1h)

Wednesday (2-3h)

  • Migrate Constants.js → Constants.ts (2h)
  • Run validation tests (1h)

Thursday (2-3h)

  • Migrate Helpers.js → Helpers.ts (2h)
  • Update tests (1h)

Friday (2-3h)

  • Migrate EventBus.js → EventBus.ts (2-3h)

Weekend: CHECKPOINT 1

  • Verify all utils typed
  • Ensure build works
  • All tests passing

Week 2: Board & Pieces (10-12 hours)

Monday (3-4h)

  • Create Board interface (1h)
  • Migrate Board.js → Board.ts (2-3h)

Tuesday (2-3h)

  • Fix Board type issues (1h)
  • Run Board tests (1h)
  • Create Piece interfaces (1h)

Wednesday (2-3h)

  • Migrate Piece.js → Piece.ts (2h)
  • Update piece tests (1h)

Thursday (2-3h)

  • Migrate Rook.ts + Bishop.ts (2h)
  • Run tests (1h)

Friday (2-3h)

  • Migrate Knight.ts + Queen.ts (2-3h)

Weekend: CHECKPOINT 2

  • Verify core models typed
  • Simple pieces working
  • Tests passing

Week 3: Complex Pieces & Engine (12-14 hours)

Monday (3-4h)

  • Migrate Pawn.ts (en passant logic) (2-3h)
  • Run pawn tests (1h)

Tuesday (3-4h)

  • Migrate King.ts (castling logic) (2-3h)
  • Run king tests (1h)

Wednesday (3-4h)

  • Create GameState types (1h)
  • Migrate GameState.js → GameState.ts (2-3h)

Thursday (3-4h)

  • Create Move types (1h)
  • Migrate MoveValidator.js → MoveValidator.ts (2-3h)

Friday (2-3h)

  • Migrate SpecialMoves.js → SpecialMoves.ts (2-3h)

Weekend: CHECKPOINT 3

  • Game logic fully typed
  • All pieces working
  • Move validation correct

Week 4: UI Layer (10-12 hours)

Monday (2-3h)

  • Create UI types (30min)
  • Migrate BoardRenderer.js → BoardRenderer.ts (2h)

Tuesday (2-3h)

  • Fix DOM type issues (1h)
  • Test rendering (1h)
  • Create drag/drop types (30min)

Wednesday (2-3h)

  • Migrate DragDropHandler.js → DragDropHandler.ts (2h)
  • Test drag/drop (1h)

Thursday (2-3h)

  • Migrate GameController.js → GameController.ts (2-3h)

Friday (2-3h)

  • Fix controller type issues (1h)
  • Integration testing (1-2h)

Weekend: CHECKPOINT 4

  • Full UI typed
  • Game playable
  • All interactions work

Week 5: Integration (8-10 hours)

Monday (2h)

  • Migrate main.js → main.ts (1-2h)

Tuesday (2-3h)

  • Fix main entry point issues (1h)
  • Update HTML references (30min)
  • Test full application (1h)

Wednesday (2-3h)

  • Start test file conversions (2-3h)

Thursday (2-3h)

  • Continue test migrations (2-3h)

Friday (2-3h)

  • Complete test migrations (2h)
  • Run full test suite (1h)

Weekend: CHECKPOINT 5

  • All source files .ts
  • All test files .ts
  • 124/124 tests passing

Week 6: Polish & Production (8-10 hours)

Monday (2h)

  • Type optimization (1h)
  • Remove unnecessary assertions (1h)

Tuesday (2-3h)

  • Update README.md (1h)
  • Create migration guide (1h)
  • Document type conventions (1h)

Wednesday (2h)

  • Configure production build (1h)
  • Set up source maps (30min)
  • Optimize compilation (30min)

Thursday (2h)

  • Full test suite run (30min)
  • Manual feature testing (1h)
  • Performance testing (30min)

Friday (2-3h)

  • Code review (1-2h)
  • Final fixes (1h)
  • Prepare deployment (30min)

Weekend: CHECKPOINT 6

  • Production ready!
  • Zero type errors
  • All tests passing
  • Documentation complete

4-Week Aggressive Timeline

Compressed View

Week 1: Phase 0-1      ████████████████████░░░░░░░░░░  10-14h
Week 2: Phase 2        ░░░░░░░░░░░░░░░░░░░░████████░░  12-15h
Week 3: Phase 3-4      ░░░░░░░░░░░░░░░░░░░░░░░░░░██░░  15-18h
Week 4: Phase 5-6      ░░░░░░░░░░░░░░░░░░░░░░░░░░░░██  10-12h

Total: 47-59 hours over 4 weeks (12-15h per week) Intensity: HIGH - requires focused, full-time effort Risk: Medium - less buffer for issues

8-Week Conservative Timeline

Relaxed View

Week 1-2: Phase 0-1    ████████████████████░░░░░░░░░░  10-14h
Week 3-4: Phase 2      ░░░░░░░░░░░░░░░░░░░░████████░░  12-15h
Week 5-6: Phase 3-4    ░░░░░░░░░░░░░░░░░░░░░░░░░░██░░  15-18h
Week 7-8: Phase 5-6    ░░░░░░░░░░░░░░░░░░░░░░░░░░░░██  10-12h

Total: 47-59 hours over 8 weeks (6-7h per week) Intensity: LOW - sustainable, learning-friendly Risk: Low - plenty of buffer time

Parallel Work Opportunities

Can Work in Parallel

Phase 1: Core Types

Developer A: Constants.ts   ████████
Developer B: Helpers.ts     ████████
Developer C: EventBus.ts    ████████
              Mon  Tue  Wed

Time Saved: 4-6 hours (from 6-8h to 2-3h)

Phase 2c: Concrete Pieces

Dev A: Rook + Bishop        ████████
Dev B: Knight + Queen       ████████
Dev C: Pawn + King          ████████████
              Mon  Tue  Wed  Thu

Time Saved: 3-4 hours (from 5-6h to 2-3h)

Phase 4: UI Components

Dev A: BoardRenderer        ████████
Dev B: DragDropHandler      ████████
Dev C: GameController       ████████
              Mon  Tue  Wed

Time Saved: 2-3 hours (from 6-8h to 3-4h)

Total Parallelization Savings: 9-13 hours

Critical Path (Cannot Parallelize)

Sequential Dependencies

1. TypeScript Setup (Phase 0)         4-6h
   ↓ [BLOCKING]
2. Constants & Types (Phase 1)        6-8h
   ↓ [BLOCKING]
3. Board.ts                           3-4h
   ↓ [BLOCKING]
4. Piece.ts (base class)              2h
   ↓ [BLOCKING]
5. [Concrete pieces - CAN PARALLEL]   3-4h
   ↓ [BLOCKING]
6. GameState.ts                       3-4h
   ↓ [BLOCKING]
7. MoveValidator.ts                   2-3h
   ↓ [BLOCKING]
8. [UI components - CAN PARALLEL]     3-4h
   ↓ [BLOCKING]
9. main.ts                            1-2h
   ↓ [BLOCKING]
10. Test migrations                    3-4h

TOTAL CRITICAL PATH: 30-40 hours

Resource Allocation Strategies

Strategy 1: Solo Developer (6 weeks)

Week  Hours   Cumulative
1     10-14   10-14
2     10-12   20-26
3     12-14   32-40
4     10-12   42-52
5      8-10   50-62
6      8-10   58-72

TOTAL: 58-72 hours over 6 weeks

Strategy 2: Pair (2 devs, 4 weeks)

Week  Hours/Dev  Total Hours
1       10        20
2       12        24
3       12        24
4       10        20

TOTAL: 44h/dev, 88h combined
TIME SAVED: 2 weeks

Strategy 3: Team (3 devs, 3 weeks)

Week  Hours/Dev  Total Hours
1        8         24
2       10         30
3       10         30

TOTAL: 28h/dev, 84h combined
TIME SAVED: 3 weeks

Checkpoint Success Criteria

Checkpoint 1: Foundation (End Week 1)

  • ✅ TypeScript compiles without errors
  • ✅ Jest runs with ts-jest
  • ✅ All util modules typed
  • ✅ Build scripts work
  • ✅ Team comfortable with setup

GO/NO-GO Decision:

  • GO: Proceed to Phase 2
  • NO-GO: Fix foundation issues

Checkpoint 2: Models (End Week 2)

  • ✅ Board class fully typed
  • ✅ Piece hierarchy correct
  • ✅ Simple pieces migrated
  • ✅ Tests passing (>90%)
  • ✅ No critical type errors

GO/NO-GO Decision:

  • GO: Proceed to complex pieces
  • NO-GO: Fix model types

Checkpoint 3: Engine (End Week 3)

  • ✅ All pieces migrated
  • ✅ GameState typed
  • ✅ Move validation works
  • ✅ Special moves typed
  • ✅ Tests passing (>95%)

GO/NO-GO Decision:

  • GO: Proceed to UI
  • NO-GO: Fix game logic

Checkpoint 4: UI (End Week 4)

  • ✅ All controllers typed
  • ✅ Rendering works correctly
  • ✅ Drag/drop functional
  • ✅ Full game playable
  • ✅ No DOM errors

GO/NO-GO Decision:

  • GO: Proceed to integration
  • NO-GO: Fix UI types

Checkpoint 5: Integration (End Week 5)

  • ✅ All source files .ts
  • ✅ All test files .ts
  • ✅ 124/124 tests passing
  • ✅ Main entry typed
  • ✅ Full app functional

GO/NO-GO Decision:

  • GO: Proceed to polish
  • NO-GO: Fix integration issues

Checkpoint 6: Production (End Week 6)

  • ✅ Zero TypeScript errors
  • ✅ Type coverage >95%
  • ✅ Documentation complete
  • ✅ Build optimized
  • ✅ Ready to deploy

SHIP/NO-SHIP Decision:

  • SHIP: Deploy to production
  • NO-SHIP: Address remaining issues

Velocity Tracking

Expected Progress by Week

Week Phase Files Complete Tests Passing Type Coverage
1 0-1 3/18 (17%) 124/124 15%
2 2 11/18 (61%) 120/124 55%
3 3 14/18 (78%) 118/124 75%
4 4 17/18 (94%) 122/124 90%
5 5 18/18 (100%) 124/124 95%
6 6 18/18 (100%) 124/124 98%

Burn-Down Chart (Ideal)

Files Remaining
18 ┤ ●
16 ┤  ╲
14 ┤   ╲
12 ┤    ●
10 ┤     ╲
8  ┤      ╲
6  ┤       ●
4  ┤        ╲
2  ┤         ●
0  ┤          ●──●
   └─────────────────
   0  1  2  3  4  5  6  Weeks

Time-Boxing Guidelines

Maximum Time per Module

Module Estimate Time Box Escalation Trigger
Constants.ts 2h 3h Type complexity
Helpers.ts 2h 3h Function signatures
EventBus.ts 2-3h 4h Generic types
Board.ts 2-3h 4h Grid typing
Piece.ts 2h 3h Abstract class
Simple Piece 30-45min 1.5h Move logic
Complex Piece 1-1.5h 2h Special moves
GameState.ts 3-4h 5h State management
MoveValidator.ts 2-3h 4h Validation logic
SpecialMoves.ts 2-3h 4h Castling/en passant
BoardRenderer.ts 2h 3h DOM types
DragDropHandler.ts 2h 3h Event types
GameController.ts 2-3h 4h Orchestration
main.ts 1-2h 3h Initialization

Escalation Process:

  1. Hit time box → Document blocker
  2. Ask for help / pair program
  3. Consider rollback if >2x estimate
  4. Re-evaluate approach

Visual Progress Tracker

Use This Template for Weekly Updates

## Week X Progress Report

### Completed ✅
- [x] Module A (Xh actual vs Yh estimated)
- [x] Module B (Xh actual vs Yh estimated)

### In Progress 🔄
- [ ] Module C (50% complete)

### Blocked 🛑
- [ ] Module D (reason: waiting for...)

### Metrics
- Files: X/18 (X%)
- Tests: X/124 (X%)
- Type Coverage: X%
- Hours This Week: X
- Hours Total: X/47

### Velocity
- Planned: Xh
- Actual: Xh
- Variance: +/- Xh

### Next Week
- [ ] Task 1
- [ ] Task 2
- [ ] Task 3

### Blockers / Risks
- [List any issues]

### Confidence
- ● High / ○ Medium / ○ Low

Ready to start?

  1. Choose your timeline (4, 6, or 8 weeks)
  2. Allocate resources (solo, pair, or team)
  3. Set up weekly checkpoints
  4. Begin Phase 0!

Document Version: 1.0 Last Updated: 2025-11-23