Bojātu Attēlu Meklētājs skenē katru <img> un CSS background-image lapā, atklāj bojātas ielādes (404, CORS kļūmes, netīri canvas objekti) un parāda tos pārskatāmā sarakstā. Filtrējiet pēc bojāts/viss/CSS foni, pārlecat uz katru attēlu lapā un izceliet to, un kopējiet bojāto URL sarakstu ātriem kļūdu ziņojumiem.
Bojāti attēli ir viena no vismanāmākajām kļūdām tīmekļa lapā — taču tos negaidīti viegli palaist garām QA laikā, jo tie nogāžas klusi. Bojātu Attēlu Meklētājs tos visus notver. Aktivizēts, rīks pārstaigā DOM, meklējot katru <img> elementu (pārbaudot naturalWidth / naturalHeight, lai atklātu neizdevušās ielādes) un katru CSS background-image URL (pārbaudot katru ar jaunu Image() objektu, lai apstiprinātu tā ielādi). Rezultāti tiek kategorizēti kā OK / Broken / Loading un parādīti filtrējamā sarakstā ar statistikas skaitītājiem augšā. Katrs ieraksts parāda URL, tipu (img vai CSS fons), izmērus, ja ielādēts, un alt tekstu, ja tāds ir. Bojātie attēli tiek izcelti sarkanā krāsā, un tiem ir "Locate" poga, kas ripina elementu redzamības zonā un uzplaiksnī sarkanu apveidu ap to. "Copy Broken URLs" poga uzreiz iegūst visus neizdevušos URL kļūdu ziņojuma kopēšanai/ielīmēšanai. Darbojas jebkurā lapā bez piekļuves backend žurnāliem — ātrs vizuālais QA slieksnis.
Pārbauda katru <img> elementu, kā arī katru background-image URL aprēķinātajos stilos. Data URI un blob URL tiek izlaisti (tie vienmēr ir derīgi).
Statistika ar vienu skatienu parāda lapas attēlu stāvokli. Skaitļi atjauninās dzīvē, kamēr asinhronās pārbaudes atrisinās.
Pārslēdzieties starp Broken, All un CSS Backgrounds cilnēm. Koncentrējieties uz to, kas jālabo.
Noklikšķiniet Locate pie jebkura attēla, lai ripinātu uz tā elementu lapā un uzplaiksnītu sarkanu izcēlumu ap to.
Viens klikšķis nokopē bojāto attēlu URL sarakstu — ielīmējiet kļūdu ziņojumā vai dalieties ar backend komandu.
Ierobežots līdz 500 CSS fona skenējumiem, lai saglabātu UI atsaucīgu satura ziņā smagās lapās.
Palaidiet uz staging pirms izvietošanas, lai atklātu 404 kļūdas, ko izraisījusi refaktorēšana, pārdēvēti resursi vai CDN migrācijas.
Periodiski skenējiet tiešraides lapas — bojāti attēli kaitē SEO un lietotāju uzticībai, un tie bieži paslīd garām automatizētiem testiem.
Kad redaktori augšupielādē attēlus, daži var nekad nenokļūt galīgajā URL. Skenējiet, lai atklātu nedzīvās atsauces.
Ja paļaujaties uz ārējiem attēlu pakalpojumiem (avatāri, tieši sasaistītas produktu fotogrāfijas), skenējiet regulāri, lai atklātu darbības pārtraukumus.
Pēc resursu pārvietošanas uz jaunu CDN vai bucket, noskenējiet katru svarīgo lapu, lai pārliecinātos, ka migrācija nekas nav salauzusi.
Noklikšķiniet uz Broken Images ikonas DevSuite Pro dokā. Atveras panelis un automātiski noskenē lapu.
Paneļa augšdaļā statistika parāda Total / OK / Broken / Loading. Ja Broken > 0, pārslēdzieties uz Broken cilni, lai tos redzētu.
Noklikšķiniet Locate pie jebkuras rindas, lai ripinātu tās elementu redzamības zonā lapā — ap to 2 sekundes uzplaiksnī sarkans apveids.
Noklikšķiniet Copy Broken URLs, lai iegūtu pilnu sarakstu — ielīmējiet biļetē, čatā vai backend izmeklēšanā.
Pēc backend labojumiem noklikšķiniet Re-scan Page, lai pārliecinātos, ka visi attēli tagad ielādējas pareizi.
Instalējiet DevSuite Pro bez maksas un atbloķējiet 64+ izstrādātāju rīkus savam pārlūkam.
