වෙබ් අඩවි නවීකරණය හෝ දෝෂ පරීක්ෂණයක් සඳහා වෙනස්කම් නිරීක්ෂණ මෙවලම් භාවිතා කරන බොහෝ සංවර්ධකයින්ට "අසත්ය ඇලර්ට්" කියන ගැටළුව අත්විඳිනවා. ක්රෝන් ජොබ් එකක් සැකසී, 15 මිනිත්තුකට එක්වර සැනක් සිංහල පින්තූරයක් ගෙන, ඒවා අතර වෙනස්කම් සොයා බලනවා. නමුත් තාක්ෂණිකව පවතින තත්ත්වයන් හේතුවෙන්, අඩුම තරම් අන්තර්ගත වෙනසක් නොමැතිවම ඉ-මේල් පෙට්ටිය පූර්ණයෙන් පිරෙයි.
ගැටලුව 1 – ගොඩනැගිලි කට්ටල වල අස්ථිර හැෂ් අගය නවතම ෆ්රේම්වර්ක් (Next.js, Nuxt, Remix) මගින් HTML ටැග් වලට බිලියන වරක් වෙනස් වන build‑ID, hydration key, CSS chunk hash වැනි අංග එක් කරයි. ඒ නිසා <p class="text-gray-700 css-1a2b3c"> වැනි ටැග් එකක් css-9x8y7z ලෙස වෙනස් වීම, අන්තර්ගතය නොවෙනස් වුවත්, සරල string comparison එකට වැරදි වෙනස්කමක් ලෙස හඳුනාගනී.
විසඳුම 1 – ගුණාත්මක ගුණාංග සෝදිසි හා CSS පන්තීන් පිරිසිදු කිරීම PageWatch.tech කණ්ඩායම DOM node එකක් පරීක්ෂා කරන විට, දත්ත‑reactroot, data‑hydration‑id වැනි volatile attribute ඉවත් කරයි. එමෙන්ම css-xxxx වැනි hash class ගණනාවක් css-scoped ලෙස සමාන කර, alphabetically sort කරයි. මේ පියවරෙන් පසු structural hash ගණනය කළ විට, නියම අන්තර්ගත වෙනස්කමක් පමණක් සලකා බලයි.
ගැටලුව 2 – පින්තූර සැසියෙහි පිකසෙල් ජිටරය Headless Chromium (Playwright, Puppeteer) භාවිතා කර පින්තූර දෙකක් ගත කර pixel‑by‑pixel diff කිරීමේදී, OS අනුව sub‑pixel font rendering, GIF/වීඩියෝ ෆ්රේම්, caret blink වැනි සුළු වෙනස්කම් false positive වලට හේතුවේ.
විසඳුම 2 – පර්සෙප්ශනල් රঙ දුර හා බවුන්ඩ්රි බොක්ස් ෆිල්ටරය සාමාන්ය RGB සමානතාව වෙනුවට YUV පර්සෙප්ශනල් color distance (pixelmatch) භාවිතා කර, threshold 0.15 දක්වා sub‑pixel වෙනස්කම් නොසලකා හරී. එමෙන්ම minor rendering shift වලට bounding box filter එකක් යොදා, අවශ්ය ප්රදේශ පමණක් diff කරනවා.
ගැටලුව 3 – lazy‑load, anti‑bot, hydration mismatch Lazy‑load images, invisible DOM nodes added by bot‑check scripts, React/Vue SPA වල hydration mismatch වැනි අංගයන් මත, අන්තර්ගතය වෙනස් නොවූවත් alert එකක් එයි.
විසඳුම 3 – අකලා නොහැකි node සහ invisible element ඉවත් කිරීම නිරීක්ෂණ යන්ත්රය DOM tree එකේ visibility attribute පරීක්ෂා කර, display:none, opacity:0, aria‑hidden වැනි node ඉවත් කරයි. එමෙන්ම lazy‑load images සඳහා placeholder hash භාවිතා කර, real image load වෙනකොට diff නොකරයි.
ශ්රී ලංකාවට ඇති වැදගත්කම
- විශ්වවිද්යාල සිසුන්ට visual testing මූලික කරුණු ඉගෙන ගැනීමට ප්රායෝගික උදාහරණයක්.
- දේශීය සංවර්ධකයින්ට CI/CD pipeline වල false positive alerts අඩු කර, deployment වේගය වැඩි කිරීමට උපකාරී.
- ව්යාපාරික වෙබ් අඩවි අධීක්ෂණය කිරීමේදී අධික ඊ‑මේල් පිරිසැලසුම් වැළැක්වීමෙන් IT support කාර්යය බර අඩු වේ.
- සිංහල UI/UX පරීක්ෂණය කරන සමාගම්ට localized CSS hash sanitization ක්රමවේදය භාවිතා කර, පාරිභෝගික අත්දැකීම අඩු නොකරන්න.
මෙම තාක්ෂණික ප්රගතිය, වෙබ් අඩවි නිරීක්ෂණය කළමනාකරණය කිරීමේ නව මාර්ගයක් ඉදිරිපත් කරයි. සංවර්ධකයින්, QA ඉංජිනේරුවන්, සහ ව්යාපාරිකයින්ට දැන් අසත්ය ඇලර්ට් වලින් තොරව, නිවැරදිව වෙනස්කම් සලකන්න පුළුවන්.
