# S03: Featured Content & Content Teasers — UAT

**Milestone:** M009
**Written:** 2026-03-31T05:49:55.266Z

## UAT: S03 — Featured Content & Content Teasers

### Preconditions
- Chrysopedia running with at least 2 technique pages in the database
- Homepage accessible at the configured URL

### Test 1: Featured Technique Spotlight Renders
1. Navigate to the homepage
2. Scroll below the hero section
3. **Expected:** A "Featured Technique" section appears with:
   - A label reading "Featured Technique"
   - Technique title (clickable link to /techniques/{slug})
   - Full summary text (not truncated)
   - Creator name (clickable link to /creators/{slug})
   - Topic category badge
   - Topic tags as pills
   - Key moment count
   - Subtle accent left border
   - Left-aligned text (not centered like hero)

### Test 2: Featured Technique Randomizes on Reload
1. Reload the homepage 3-5 times
2. **Expected:** The featured technique changes between reloads (random selection from database)

### Test 3: Recently Added Grid Layout
1. Scroll to the "Recently Added" section below the spotlight
2. **Expected:** Techniques displayed in a 2-column grid layout
3. Each card shows: title (linked), summary (up to 150 chars), creator name, badges

### Test 4: Deduplication Between Featured and Recent
1. Note the featured technique's title
2. Scan the recently-added grid
3. **Expected:** The featured technique does NOT appear in the recently-added list

### Test 5: Responsive Grid Collapse
1. Resize browser window below 640px width
2. **Expected:** Recently-added grid collapses to a single column

### Test 6: Graceful Degradation — Empty Database
1. If possible, test with no technique pages in the database
2. **Expected:** Featured technique section is hidden (not shown with error state). Recently-added section shows empty or is hidden.

### Test 7: Backend Sort Parameter
1. Call the API directly: `GET /techniques?sort=random&limit=5`
2. Call again: `GET /techniques?sort=random&limit=5`
3. **Expected:** Results come back in different order between calls
4. Call: `GET /techniques?sort=recent&limit=5`
5. **Expected:** Results ordered by creation date descending

### Edge Cases
- **Single technique in DB:** Featured and recently-added both show the same technique (dedup removes it from recent, recent section may be empty)
- **Featured fetch failure (network error):** Spotlight section hidden, recently-added still renders normally
