Broken Image Detection

1 Intentional Issues

A controlled fixture for issue #238. One image loads, two fail (404 and 500), and one src is not a network resource at all. Only the two failing images should ever be reported.

Valid Image — control, must NOT be flagged

/images/valid-product-photo.jpg exists in public/images/ and answers 200. It carries alt text and explicit dimensions so it contributes no other image issue either — if this URL turns up in a broken_image finding, that is a false positive.

Product photograph used as the healthy-image control for issue #238

✓ HTTP 200 — expected to be absent from every broken_image finding

Broken Image — 404 Not Found#238Issue #238: Image src points at a file that does not exist; the request returns HTTP 404

/images/missing-product-photo.jpg is deliberately absent from public/images/. The markup is otherwise perfect — correct alt text, explicit dimensions — so the only thing wrong with it is that it does not load.

Product photograph that intentionally does not exist

✗ HTTP 404 — expected in broken_image with httpStatus 404

Broken Image — 500 Server Error#238Issue #238: Image URL resolves but the server answers HTTP 500, so the image never renders

/images/server-error.jpg is a route handler that always answers 500, to HEAD and GET alike. It covers the 5xx half of the check without depending on some external host happening to be down.

Image served by a backend that is intentionally failing

✗ HTTP 500 — expected in broken_image with httpStatus 500

Inline data: URI — control, must NOT be flagged

A data: URI is not fetched over the network, so it can be neither reachable nor broken. A scanner that reports it as a broken image is reporting on something it never requested.

Inline single-pixel image embedded directly in the markup

✓ never requested — expected to be absent from every broken_image finding

Expected result for this page

Exactly one broken_image row in audit_issue, naming two URLs and no more:

issueCode: "broken_image"
details: {
  message: "2 image(s) failed to load",
  imageCount: 2,
  brokenImages: [
    { imageUrl: ".../images/missing-product-photo.jpg", httpStatus: 404, failureReason: "HTTP 404" },
    { imageUrl: ".../images/server-error.jpg",          httpStatus: 500, failureReason: "HTTP 500" }
  ]
}

A request that never reaches a server — DNS failure, refused connection, timeout — is reported with httpStatus: null and a reason naming the failure. It is never recorded as status 0, which downstream status >= 400 checks would read as healthy.