Broken Image Finder scans every <img> and CSS background-image on the page, detects broken loads (404s, CORS failures, tainted canvases), and shows them in a clean list. Filter by broken/all/CSS backgrounds, jump to and highlight each image on the page, and copy the list of broken URLs for quick bug reports.
Broken images are one of the most visible bugs on a webpage — yet they're surprisingly easy to miss during QA because they silently fail. Broken Image Finder catches them all. When activated, the tool walks the DOM for every <img> element (checking naturalWidth / naturalHeight to detect failed loads) and every CSS background-image URL (probing each with a fresh Image() to verify it loads). Results are categorized as OK / Broken / Loading and presented in a filterable list with stat counts at the top. Each entry shows the URL, type (img or CSS bg), dimensions if loaded, and alt text if present. Broken images are highlighted in red and have a "Locate" button that scrolls the element into view and flashes a red outline around it. A "Copy Broken URLs" button grabs all failing URLs at once for bug-report copy/paste. Works on any page without needing access to backend logs — a quick visual QA gate.
Checks every <img> element plus every background-image URL in computed styles. Data URIs and blob URLs are skipped (they're always valid).
At-a-glance stats show the health of the page's images. Numbers update live as async probes resolve.
Switch between Broken, All, and CSS Backgrounds tabs. Stay focused on what needs fixing.
Click Locate on any image to scroll to its element on the page and flash a red highlight around it.
One click copies the list of broken image URLs — paste into a bug report or share with backend team.
Capped at 500 CSS-background scans to keep the UI responsive on content-heavy pages.
Run on staging before deploy to catch 404s introduced by refactors, renamed assets, or CDN migrations.
Periodically scan live pages — broken images hurt SEO and user trust, and they often slip past automated tests.
When editors upload images, some might never make it to the final URL. Scan to catch dead references.
If you rely on external image services (avatars, hot-linked product photos), scan regularly to catch outages.
After moving assets to a new CDN or bucket, scan every key page to verify the migration didn't break anything.
Click the Broken Images icon in the DevSuite Pro dock. A panel opens and scans the page automatically.
Top-of-panel stats show Total / OK / Broken / Loading. If Broken > 0, switch to the Broken tab to see them.
Click Locate on any row to scroll its element into view on the page — a red outline flashes around it for 2 seconds.
Click Copy Broken URLs to grab the full list — paste into a ticket, chat, or backend investigation.
After backend fixes, click Re-scan Page to verify all images now load correctly.
Įdiekite „DevSuite Pro“ nemokamai ir atrakinkite 39+ kūrėjų įrankius savo naršyklei.
