bvandeusen/minstrel
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases 38 Wiki Activity

docs(plan): update useDelayed task to match .svelte.test.ts convention

Browse Source 
Rune-using test files need the .svelte. infix so vite-plugin-svelte
processes them. Also adds the flushSync() after $effect.root in the
'source already true' test so fake-timer advances fire the scheduled
timeout.

Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
This commit is contained in:
Bryan Van Deusen
2026-04-23 18:16:37 -04:00
parent 19d74d00d6
commit 4cd67405c9
1 changed files with 7 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files
docs/superpowers/plans/2026-04-23-web-ui-library-views.md
+7 -6
View File
@@ -25,7 +25,7 @@
| `src/lib/media/duration.ts` | `formatDuration(seconds)` returning `mm:ss` or `h:mm:ss` |
| `src/lib/media/duration.test.ts` | Unit tests for `formatDuration` |
| `src/lib/utils/useDelayed.svelte.ts` | `useDelayed(getValue, delayMs)` rune helper for skeleton suppression |
| `src/lib/utils/useDelayed.test.ts` | Unit tests for `useDelayed` |
| `src/lib/utils/useDelayed.svelte.test.ts` | Unit tests for `useDelayed` |
| `src/lib/components/ArtistRow.svelte` | Artists list row — avatar initial, name, album count, chevron, wrapping `<a>` |
| `src/lib/components/ArtistRow.test.ts` | Component test |
| `src/lib/components/AlbumCard.svelte` | Album grid card — cover, title, year, wrapping `<a>` |
@@ -255,11 +255,11 @@ git commit -m "feat(web): add cover URL helper + fallback SVG data URL"
**Files:**
- Create: `web/src/lib/utils/useDelayed.svelte.ts`
- Create: `web/src/lib/utils/useDelayed.test.ts`
- Create: `web/src/lib/utils/useDelayed.svelte.test.ts`
- [ ] **Step 1: Write the failing tests**
Create `web/src/lib/utils/useDelayed.test.ts`:
Create `web/src/lib/utils/useDelayed.svelte.test.ts`:
```ts
import { describe, expect, test, vi } from 'vitest';
@@ -325,6 +325,7 @@ describe('useDelayed', () => {
const cleanup = $effect.root(() => {
delayed = useDelayed(() => source, 100);
});
flushSync(); // run the initial $effect so the setTimeout is scheduled
vi.advanceTimersByTime(200);
expect(delayed.value).toBe(true);
@@ -343,7 +344,7 @@ describe('useDelayed', () => {
- [ ] **Step 2: Run tests, confirm they fail**
Run: `cd web && npm test -- src/lib/utils/useDelayed.test.ts`
Run: `cd web && npm test -- src/lib/utils/useDelayed.svelte.test.ts`
Expected: FAIL — module not found.
- [ ] **Step 3: Implement `web/src/lib/utils/useDelayed.svelte.ts`**
@@ -390,13 +391,13 @@ export function useDelayed(
- [ ] **Step 4: Run tests, confirm they pass**
Run: `cd web && npm test -- src/lib/utils/useDelayed.test.ts`
Run: `cd web && npm test -- src/lib/utils/useDelayed.svelte.test.ts`
Expected: PASS — 3 tests.
- [ ] **Step 5: Commit**
```bash
git add web/src/lib/utils/useDelayed.svelte.ts web/src/lib/utils/useDelayed.test.ts
git add web/src/lib/utils/useDelayed.svelte.ts web/src/lib/utils/useDelayed.svelte.test.ts
git commit -m "feat(web): add useDelayed rune helper
Boolean mirror that flips true only after the source stays true for