Files
breedr/.zenflow/tasks/new-task-7382/investigation.md
Zenflow c22ebbe45c New task (zenflow 738246ea)
In the Pairing Simulator page, I am getting the error:

**Error:**Unexpected token '<', "<!DOCTYPE "... is not valid JSON

Fid and fix the bug
2026-03-11 13:02:24 -05:00

1.8 KiB

Bug Investigation & Implementation Report - Task 7382

Bug Summary

The Pairing Simulator was failing with the error: Unexpected token '<', "<!DOCTYPE "... is not valid JSON. This was caused by a mismatch between the frontend's expected API endpoint and the server's actual routes, leading to a 404 HTML response instead of JSON.

Root Cause Analysis

  1. Endpoint Mismatch: The frontend called POST /api/pedigree/coi, but the server only implemented POST /api/pedigree/trial-pairing.
  2. Property Naming: The frontend expected common_ancestors (snake_case), while the server returned commonAncestors (camelCase).
  3. Data Structure: The frontend expected common_ancestors to be an array of strings, while the server returned an array of objects.
  4. COI Scaling: The server returned COI as a percentage (e.g., 25.00), while the frontend functions (coiColor, coiLabel) expected decimals (e.g., 0.25).

Affected Components

  • client/src/pages/PairingSimulator.jsx
  • server/routes/pedigree.js

Proposed & Implemented Solution

  1. Server Fix: Modified calculateCOI in server/routes/pedigree.js to return the raw decimal value for coefficient.
  2. Frontend Fix: Updated PairingSimulator.jsx to:
    • Use the documented /api/pedigree/trial-pairing endpoint.
    • Use the commonAncestors property from the response.
    • Access the .name property when mapping over the common ancestors list.
    • The COI display logic (result.coi * 100).toFixed(2) now works correctly with the decimal value from the server.

Verification Results

  • Manual code analysis confirms that the frontend and backend now share a consistent API contract.
  • The COI thresholds and color coding in the frontend now correctly interpret the values provided by the server.