fix(KB-503): address code review feedback for Step 1
- Add optional globalDir parameter to resolveProject(), getDefaultProject(), setDefaultProject(), and clearDefaultProject() for test isolation - Remove ESLint suppression by using void operator for intentionally unused var - Update all tests to use isolated globalDir parameter - Complete tests for default project resolution
This commit is contained in:
113
.fusion/tasks/KB-059/PROMPT.md
Normal file
113
.fusion/tasks/KB-059/PROMPT.md
Normal file
@@ -0,0 +1,113 @@
|
||||
# Task: KB-059 - Lock Mobile Viewport to Prevent Zoom
|
||||
|
||||
**Created:** 2026-03-30
|
||||
**Size:** S
|
||||
|
||||
## Review Level: 1 (Plan Only)
|
||||
|
||||
**Assessment:** Small, focused change to HTML meta tags and CSS. No logic changes, minimal blast radius. Reversible by reverting the viewport meta tag.
|
||||
**Score:** 2/8 — Blast radius: 0, Pattern novelty: 0, Security: 0, Reversibility: 2
|
||||
|
||||
## Mission
|
||||
|
||||
Prevent mobile browsers from zooming in/out on the dashboard to create an app-like experience where the view stays locked at a consistent scale. Update the viewport meta tag and add necessary CSS to disable pinch-to-zoom and double-tap zoom behaviors while maintaining accessibility for form inputs.
|
||||
|
||||
## Dependencies
|
||||
|
||||
- **None** — This task is independent and can be completed before or alongside KB-035
|
||||
|
||||
## Context to Read First
|
||||
|
||||
1. `packages/dashboard/app/index.html` — HTML template containing the current viewport meta tag
|
||||
2. `packages/dashboard/app/styles.css` — Global styles including mobile responsive `@media` queries
|
||||
3. `packages/dashboard/app/App.tsx` — Root component to understand layout structure
|
||||
|
||||
## File Scope
|
||||
|
||||
- `packages/dashboard/app/index.html` — modify viewport meta tag
|
||||
- `packages/dashboard/app/styles.css` — add CSS to prevent zoom gestures (optional, if needed beyond meta tag)
|
||||
|
||||
## Steps
|
||||
|
||||
### Step 0: Preflight
|
||||
|
||||
- [ ] Required files exist at `packages/dashboard/app/index.html` and `packages/dashboard/app/styles.css`
|
||||
- [ ] No dependencies blocking this task
|
||||
|
||||
### Step 1: Update Viewport Meta Tag
|
||||
|
||||
- [ ] Read current `index.html` and locate the viewport meta tag
|
||||
- [ ] Update the viewport meta tag to prevent zoom:
|
||||
- Change from: `content="width=device-width, initial-scale=1.0"`
|
||||
- Change to: `content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no, viewport-fit=cover"`
|
||||
- [ ] Ensure the meta tag includes `viewport-fit=cover` for proper handling of notches/safe areas on modern mobile devices
|
||||
- [ ] Verify the tag remains valid HTML5
|
||||
|
||||
**Artifacts:**
|
||||
- `packages/dashboard/app/index.html` (modified)
|
||||
|
||||
### Step 2: Add Touch-Action CSS (if needed)
|
||||
|
||||
- [ ] Check if additional CSS is needed to prevent zoom gestures that bypass the meta tag (iOS Safari sometimes ignores user-scalable)
|
||||
- [ ] If needed, add to the `html, body` selector in `styles.css`:
|
||||
- `touch-action: pan-x pan-y;` — allows horizontal/vertical panning but not pinch zoom
|
||||
- `-webkit-touch-callout: none;` — prevents iOS callout menu on long press (optional, assess if it affects UX)
|
||||
- [ ] Ensure form inputs still work correctly (inputs should not be blocked from receiving focus)
|
||||
|
||||
**Artifacts:**
|
||||
- `packages/dashboard/app/styles.css` (modified if needed)
|
||||
|
||||
### Step 3: Testing & Verification
|
||||
|
||||
> ZERO test failures allowed. Full test suite as quality gate.
|
||||
|
||||
- [ ] Create test file `packages/dashboard/app/__tests__/mobile-viewport.test.ts` that validates:
|
||||
- Viewport meta tag exists in index.html
|
||||
- Viewport meta tag contains `maximum-scale=1.0`
|
||||
- Viewport meta tag contains `user-scalable=no`
|
||||
- Viewport meta tag contains `viewport-fit=cover`
|
||||
- [ ] Run full test suite: `pnpm test packages/dashboard`
|
||||
- [ ] Fix all failures
|
||||
- [ ] Build passes: `pnpm build`
|
||||
- [ ] Verify no console warnings or errors
|
||||
|
||||
**Artifacts:**
|
||||
- `packages/dashboard/app/__tests__/mobile-viewport.test.ts` (new)
|
||||
|
||||
### Step 4: Documentation & Delivery
|
||||
|
||||
- [ ] Check `packages/dashboard/README.md` — add a brief note about mobile app-like experience if a "Mobile Support" section exists
|
||||
- [ ] Out-of-scope findings created as new tasks via `task_create` tool
|
||||
|
||||
## Documentation Requirements
|
||||
|
||||
**Must Update:**
|
||||
- None required — the viewport change is self-documenting
|
||||
|
||||
**Check If Affected:**
|
||||
- `packages/dashboard/README.md` — add mobile behavior note if a mobile section exists
|
||||
|
||||
## Completion Criteria
|
||||
|
||||
- [ ] All steps complete
|
||||
- [ ] Viewport meta tag prevents zoom (`user-scalable=no`, `maximum-scale=1.0`)
|
||||
- [ ] `viewport-fit=cover` included for safe area support
|
||||
- [ ] All tests passing (including new `mobile-viewport.test.ts`)
|
||||
- [ ] Build passes
|
||||
- [ ] Mobile browsers cannot zoom the dashboard view (feels like a native app)
|
||||
|
||||
## Git Commit Convention
|
||||
|
||||
Commits at step boundaries. All commits include the task ID:
|
||||
|
||||
- **Step completion:** `feat(KB-059): complete Step N — description`
|
||||
- **Bug fixes:** `fix(KB-059): description`
|
||||
- **Tests:** `test(KB-059): description`
|
||||
|
||||
## Do NOT
|
||||
|
||||
- Add JavaScript-based zoom prevention (unnecessary, meta tag is sufficient)
|
||||
- Block legitimate accessibility features (screen readers should still work)
|
||||
- Prevent input focus or text selection (only prevent zoom)
|
||||
- Skip tests or rely on manual verification only
|
||||
- Modify desktop viewport behavior
|
||||
124
.fusion/tasks/KB-059/task.json
Normal file
124
.fusion/tasks/KB-059/task.json
Normal file
@@ -0,0 +1,124 @@
|
||||
{
|
||||
"id": "KB-059",
|
||||
"description": "Make sure views on mobile don’t zoom - keep the view locked so it feels like a mobile app",
|
||||
"column": "done",
|
||||
"dependencies": [],
|
||||
"steps": [
|
||||
{
|
||||
"name": "Preflight",
|
||||
"status": "done"
|
||||
},
|
||||
{
|
||||
"name": "Update Viewport Meta Tag",
|
||||
"status": "done"
|
||||
},
|
||||
{
|
||||
"name": "Add Touch-Action CSS (if needed)",
|
||||
"status": "done"
|
||||
},
|
||||
{
|
||||
"name": "Testing & Verification",
|
||||
"status": "done"
|
||||
},
|
||||
{
|
||||
"name": "Documentation & Delivery",
|
||||
"status": "done"
|
||||
}
|
||||
],
|
||||
"currentStep": 5,
|
||||
"log": [
|
||||
{
|
||||
"timestamp": "2026-03-30T03:07:57.987Z",
|
||||
"action": "Task created"
|
||||
},
|
||||
{
|
||||
"timestamp": "2026-03-30T03:08:27.125Z",
|
||||
"action": "Spec review requested"
|
||||
},
|
||||
{
|
||||
"timestamp": "2026-03-30T03:08:36.616Z",
|
||||
"action": "Spec review: APPROVE",
|
||||
"outcome": "The specification is well-crafted with clear, concrete steps and verifiable outcomes. It correctly identifies the existing viewport meta tag at `packages/dashboard/app/index.html:4` and the mobile responsive CSS at `packages/dashboard/app/styles.css`. The mission is focused, testing requirements demand real automated tests with assertions, and the review level (1 - Plan Only) is appropriate for this small, low-risk change."
|
||||
},
|
||||
{
|
||||
"timestamp": "2026-03-30T03:22:23.099Z",
|
||||
"action": "Worktree created at /Users/eclipxe/Projects/kb/.worktrees/solar-peach"
|
||||
},
|
||||
{
|
||||
"timestamp": "2026-03-30T03:22:23.100Z",
|
||||
"action": "Step 0 (Preflight) → pending"
|
||||
},
|
||||
{
|
||||
"timestamp": "2026-03-30T03:22:31.493Z",
|
||||
"action": "Step 0 (Preflight) → done"
|
||||
},
|
||||
{
|
||||
"timestamp": "2026-03-30T03:22:31.494Z",
|
||||
"action": "plan review requested for Step 1 (Update Viewport Meta Tag)"
|
||||
},
|
||||
{
|
||||
"timestamp": "2026-03-30T03:22:45.284Z",
|
||||
"action": "plan review Step 1: APPROVE",
|
||||
"outcome": "The plan for Step 1 is straightforward and correctly identifies the required changes to `packages/dashboard/app/index.html`. The step will successfully update the viewport meta tag to prevent mobile zoom as specified. The approach is minimal and reversible, matching the task's \"small blast radius\" assessment."
|
||||
},
|
||||
{
|
||||
"timestamp": "2026-03-30T03:22:48.881Z",
|
||||
"action": "Step 1 (Update Viewport Meta Tag) → in-progress"
|
||||
},
|
||||
{
|
||||
"timestamp": "2026-03-30T03:22:50.521Z",
|
||||
"action": "Step 1 (Update Viewport Meta Tag) → done"
|
||||
},
|
||||
{
|
||||
"timestamp": "2026-03-30T03:22:50.521Z",
|
||||
"action": "plan review requested for Step 2 (Add Touch-Action CSS)"
|
||||
},
|
||||
{
|
||||
"timestamp": "2026-03-30T03:23:02.729Z",
|
||||
"action": "plan review Step 2: APPROVE",
|
||||
"outcome": "The plan for Step 2 is sound and well-structured. The conditional approach (\"if needed\") is appropriate given that iOS Safari has known issues ignoring `user-scalable=no`. The specific CSS properties suggested (`touch-action: pan-x pan-y` and `-webkit-touch-callout: none`) are the correct technical choices for preventing zoom while maintaining scrollability. The requirement to verify form inputs still work is a critical accessibility safeguard."
|
||||
},
|
||||
{
|
||||
"timestamp": "2026-03-30T03:23:06.002Z",
|
||||
"action": "Step 2 (Add Touch-Action CSS (if needed)) → in-progress"
|
||||
},
|
||||
{
|
||||
"timestamp": "2026-03-30T03:23:07.395Z",
|
||||
"action": "Step 2 (Add Touch-Action CSS (if needed)) → done"
|
||||
},
|
||||
{
|
||||
"timestamp": "2026-03-30T03:23:07.396Z",
|
||||
"action": "Step 3 (Testing & Verification) → in-progress"
|
||||
},
|
||||
{
|
||||
"timestamp": "2026-03-30T03:23:50.819Z",
|
||||
"action": "Step 3 (Testing & Verification) → done"
|
||||
},
|
||||
{
|
||||
"timestamp": "2026-03-30T03:23:52.521Z",
|
||||
"action": "Step 4 (Documentation & Delivery) → in-progress"
|
||||
},
|
||||
{
|
||||
"timestamp": "2026-03-30T03:23:56.457Z",
|
||||
"action": "Step 4 (Documentation & Delivery) → done"
|
||||
},
|
||||
{
|
||||
"timestamp": "2026-03-30T03:23:56.459Z",
|
||||
"action": "Completed KB-059 - Locked mobile viewport to prevent zoom",
|
||||
"outcome": "Viewport meta tag updated with maximum-scale=1.0, user-scalable=no, and viewport-fit=cover. Added touch-action CSS as backup for iOS Safari. All 8 new mobile-viewport tests passing. Build successful."
|
||||
},
|
||||
{
|
||||
"timestamp": "2026-03-30T03:23:56.462Z",
|
||||
"action": "Step 4 (Documentation & Delivery) → done"
|
||||
},
|
||||
{
|
||||
"timestamp": "2026-03-30T03:23:56.463Z",
|
||||
"action": "Task marked done by agent"
|
||||
}
|
||||
],
|
||||
"columnMovedAt": "2026-03-30T03:24:10.007Z",
|
||||
"createdAt": "2026-03-30T03:07:57.987Z",
|
||||
"updatedAt": "2026-03-30T03:24:10.007Z",
|
||||
"size": "S",
|
||||
"reviewLevel": 1
|
||||
}
|
||||
Reference in New Issue
Block a user