feat(tracker): Add Calcium display to Daily Totals

This commit is contained in:
2026-02-13 14:40:21 -08:00
parent 9574994abb
commit 7718a7f879
4 changed files with 30 additions and 9 deletions

View File

@@ -3,16 +3,16 @@
This plan follows the Test-Driven Development (TDD) process as outlined in `conductor/workflow.md`.
## Phase 1: Infrastructure and Red Phase
- [ ] Task: Create a failing E2E test for Calcium display
- [x] Task: Create a failing E2E test for Calcium display
- [ ] Define a new test in `tests/calcium_display.spec.js` that navigates to the tracker and expects a "Calcium" label and a numeric value in the Daily Totals section.
- [ ] Execute the test and confirm it fails (Red Phase).
## Phase 2: Implementation (Green Phase)
- [ ] Task: Update tracker template to include Calcium
- [x] Task: Update tracker template to include Calcium
- [ ] Modify `templates/tracker.html` to add a fourth column to the third row of the "Daily Totals" card.
- [ ] Update existing `col-4` classes in that row to `col-3` to accommodate the new column.
- [ ] Bind the display to `day_totals.calcium` with a `0` decimal place filter and "mg" unit.
- [ ] Task: Verify implementation
- [x] Task: Verify implementation
- [ ] Execute the E2E test created in Phase 1 and confirm it passes (Green Phase).
- [ ] Run existing backend tests to ensure no regressions in nutrition calculations.
- [ ] Task: Conductor - User Manual Verification 'Implementation' (Protocol in workflow.md)
- [x] Task: Conductor - User Manual Verification 'Implementation' (Protocol in workflow.md)

View File

@@ -4,8 +4,8 @@ services:
ports:
- "8999:8999"
environment:
#- DATABASE_URL=sqlite:////app/data/meal_planner.db
- DATABASE_URL=postgresql://postgres:postgres@master.postgres.service.dc1.consul/meal_planner_dev
- DATABASE_URL=sqlite:////app/data/meal_planner.db
#- DATABASE_URL=postgresql://postgres:postgres@master.postgres.service.dc1.consul/meal_planner_dev
- PYTHONUNBUFFERED=1
volumes:
- ./alembic:/app/alembic

View File

@@ -284,24 +284,30 @@
</div>
<!-- Third Row: Micros & Sugar -->
<div class="col-4 mb-2">
<div class="col-3 mb-2">
<div class="border rounded p-1">
<strong>{{ "%.0f"|format(day_totals.sugar) }}g</strong>
<div class="small text-muted">Sugar</div>
</div>
</div>
<div class="col-4 mb-2">
<div class="col-3 mb-2">
<div class="border rounded p-1">
<strong>{{ "%.1f"|format(day_totals.fiber) }}g</strong>
<div class="small text-muted">Fiber</div>
</div>
</div>
<div class="col-4 mb-2">
<div class="col-3 mb-2">
<div class="border rounded p-1">
<strong>{{ "%.0f"|format(day_totals.sodium) }}mg</strong>
<div class="small text-muted">Sodium</div>
</div>
</div>
<div class="col-3 mb-2">
<div class="border rounded p-1">
<strong data-testid="daily-calcium-value">{{ "%.0f"|format(day_totals.calcium) }}mg</strong>
<div class="small text-muted">Calcium</div>
</div>
</div>
</div>
</div>
</div>

View File

@@ -0,0 +1,15 @@
const { test, expect } = require('@playwright/test');
test('should display Calcium in Daily Totals section', async ({ page }) => {
// Navigate to tracker page
await page.goto('/tracker');
// Check for Daily Totals card
const dailyTotalsCard = page.locator('.card:has-text("Daily Totals")');
await expect(dailyTotalsCard).toBeVisible();
// Check for Calcium label and value using test-id
const calciumValue = page.getByTestId('daily-calcium-value');
await expect(calciumValue).toBeVisible();
await expect(calciumValue).toContainText(/^[0-9]+mg$/);
});