abi/screenshot-to-code · error · HTTPException

Design systems storage is not valid JSON

Error message

Design systems storage is not valid JSON

What it means

Raised by read_design_systems() (500) when design-systems.json — stored under ~/.screenshot-to-code (or SCREENSHOT_TO_CODE_DATA_DIR) — exists but json.loads() fails. The file is user-writable storage, so manual edits, partial writes, or merge conflicts can corrupt it. Every design-systems endpoint fails with this until the file is fixed, because reads happen before any operation.

Source

Thrown at backend/routes/design_systems.py:73

            id=str(raw_item["id"]),
            name=str(raw_item["name"]),
            content=str(raw_item.get("content", "")),
            createdAt=str(raw_item["createdAt"]),
            updatedAt=str(raw_item["updatedAt"]),
        )
    except KeyError:
        return None


def read_design_systems() -> list[DesignSystem]:
    file_path = get_design_systems_file_path()
    if not file_path.exists():
        return []

    try:
        raw_items = cast(list[Any], json.loads(file_path.read_text(encoding="utf-8")))
    except json.JSONDecodeError as exc:
        raise HTTPException(
            status_code=500,
            detail="Design systems storage is not valid JSON",
        ) from exc

    if not isinstance(raw_items, list):
        raise HTTPException(
            status_code=500,
            detail="Design systems storage must contain a list",
        )

    design_systems: list[DesignSystem] = []
    for raw_item in raw_items:
        design_system = parse_design_system(raw_item)
        if design_system:
            design_systems.append(design_system)
    return design_systems

View on GitHub (pinned to d026163f58)

Solutions

  1. Validate and repair the file: python -m json.tool ~/.screenshot-to-code/design-systems.json to locate the syntax error.
  2. Restore from a backup or rewrite as '[]' to start clean (data loss of stored systems).
  3. Avoid hand-editing; use the API/UI for all changes.
  4. Ensure only one backend instance writes to the same data dir.

Example fix

# before: design-systems.json contains {"items": [ ... },  (trailing comma)
GET /api/design-systems  # 500 'not valid JSON'

# after
cat ~/.screenshot-to-code/design-systems.json | python -m json.tool   # find error
# fix or reset:
echo '[]' > ~/.screenshot-to-code/design-systems.json
Defensive patterns

Strategy: validation

Validate before calling

import json, pathlib

def design_systems_file_is_valid(path: pathlib.Path) -> bool:
    if not path.exists():
        return True  # absent file is fine
    try:
        json.loads(path.read_text(encoding="utf-8"))
        return True
    except json.JSONDecodeError:
        return False

Type guard

def is_parsable_design_store(raw: str) -> bool:
    try:
        json.loads(raw)
        return True
    except json.JSONDecodeError:
        return False

Try / catch

try:
    systems = requests.get(url + "/api/design-systems").raise_for_status().json()
except requests.HTTPError as e:
    if e.response is not None and e.response.status_code == 500 and "valid JSON" in e.response.text:
        raise RuntimeError("design-systems.json corrupted — repair or reset the file") from e
    raise

Prevention

When it happens

Trigger: Any GET/POST/PUT/DELETE on /api/design-systems while the JSON file is malformed: trailing commas from hand edits, a half-written file after a crash mid-write, concatenated objects from concurrent writers.

Common situations: Editing design-systems.json by hand and leaving invalid JSON; two backend processes writing simultaneously (the writer is not locked); sync tools (Dropbox etc.) producing conflict files that get merged badly.

Related errors


AI-assisted analysis of abi/screenshot-to-code@d026163f58 (2026-08-14). Data as JSON: /api/errors/7872aa536f1bc08f. Report an issue: GitHub.