159 lines
3.0 KiB
Markdown
159 lines
3.0 KiB
Markdown
# Les 15: AI-Driven Testing & Quality Assurance
|
|
|
|
> 📋 **Lesmateriaal nog niet uitgewerkt**
|
|
>
|
|
> De volgende bestanden worden gegenereerd wanneer deze les wordt uitgewerkt:
|
|
> - Les15-Slide-Overzicht.md
|
|
> - Les15-Lesplan.md
|
|
> - Les15-Bijlage-A-Lesopdracht.md
|
|
> - Les15-Bijlage-B-Huiswerkopdracht.md
|
|
|
|
---
|
|
|
|
## Hoofdstuk
|
|
**Hoofdstuk 3: Advanced** (Les 8-18)
|
|
|
|
## Beschrijving
|
|
AI voor testen en code kwaliteit.
|
|
|
|
---
|
|
|
|
## Te Behandelen
|
|
|
|
### Waarom Testen Belangrijk
|
|
- Vang bugs vroeg
|
|
- Vertrouwen in refactoring
|
|
- Documentatie van gedrag
|
|
|
|
### Types van Tests
|
|
|
|
| Type | Scope |
|
|
|------|-------|
|
|
| Unit | Individuele functies |
|
|
| Component | React components |
|
|
| Integration | Meerdere units samen |
|
|
| E2E | Volledige user flows |
|
|
|
|
### AI voor Test Generation
|
|
- Beschrijf wat te testen
|
|
- AI schrijft comprehensive suites
|
|
- Dekt edge cases
|
|
|
|
### Testing Tools
|
|
|
|
| Tool | Gebruik |
|
|
|------|---------|
|
|
| Vitest | Snelle moderne test runner |
|
|
| React Testing Library | User perspectief |
|
|
| MSW | API mocking |
|
|
| Playwright | E2E testing |
|
|
|
|
### Testing Supabase
|
|
- Mocken database calls
|
|
- RLS testen
|
|
- Edge Functions testen
|
|
|
|
### Code Review met AI
|
|
- Geautomatiseerde reviews
|
|
- Issues vinden (security, performance, accessibility)
|
|
- Fixes suggereren
|
|
|
|
### Debugging met AI
|
|
- Plak error
|
|
- AI legt uit en suggereert fix
|
|
|
|
### Code Kwaliteit Metrics
|
|
- Coverage >70%
|
|
- Mutation testing
|
|
- Complexity analyse
|
|
|
|
### Cursor's AI voor Automated Test Generation
|
|
|
|
### Integration met Workflow
|
|
- Tests on git push
|
|
- CI/CD
|
|
|
|
---
|
|
|
|
## Tools
|
|
- Cursor
|
|
- Vitest
|
|
- React Testing Library
|
|
- MSW
|
|
- Playwright
|
|
|
|
---
|
|
|
|
## Lesopdracht (2 uur)
|
|
|
|
### Voeg Comprehensive Tests Toe met Cursor + AI
|
|
|
|
### Setup (30 min)
|
|
- Install dependencies (Vitest, RTL)
|
|
- Configureer Vitest
|
|
- Maak test utils
|
|
- Verifieer met smoke test
|
|
|
|
### Schrijf Tests met Cursor (1 uur)
|
|
|
|
| Type | Aantal | Tijd |
|
|
|------|--------|------|
|
|
| Unit Tests | 3-4 utility functies | 20 min |
|
|
| Component Tests | 3-4 components | 30 min |
|
|
| Integration Tests | 1-2 flows | 10 min |
|
|
|
|
### Run & Fix (30 min)
|
|
- Run `npm test`
|
|
- AI helpt failures fixen
|
|
- Bereik >70% coverage
|
|
|
|
### Track
|
|
- Test schrijf snelheid met AI?
|
|
|
|
---
|
|
|
|
## Huiswerk (2 uur)
|
|
|
|
### Implementeer AI Code Review Workflow
|
|
|
|
### Deel 1: Maak Agent (1 uur)
|
|
|
|
Custom GPT/Claude Project voor code review.
|
|
|
|
**Instructions moeten checken op:**
|
|
- TypeScript safety
|
|
- Error handling
|
|
- Accessibility
|
|
- Performance
|
|
- Security
|
|
- Best practices
|
|
|
|
**Upload "goede" code als knowledge base**
|
|
|
|
### Deel 2: Review 3 Components (1 uur)
|
|
- Review 3 components
|
|
- Documenteer ALLE issues
|
|
- Categoriseer severity
|
|
- Fix in Cursor
|
|
- Re-review
|
|
|
|
### Deel 3: Enhance Template
|
|
- Add testing setup aan Starter Template
|
|
- Add Code Review agent
|
|
|
|
### Deliverable
|
|
- Agent (link)
|
|
- Review rapport (issues/fixes/before-after)
|
|
- Reflectie over AI-assisted QA
|
|
|
|
---
|
|
|
|
## Leerdoelen
|
|
Na deze les kan de student:
|
|
- Verschillende test types begrijpen en implementeren
|
|
- AI gebruiken om tests te genereren
|
|
- Testing tools configureren (Vitest, RTL, MSW, Playwright)
|
|
- Code review agents bouwen
|
|
- AI gebruiken voor debugging
|
|
- Code kwaliteit meten met coverage en metrics
|