વેબ-આધારિત ડિઝાઇન ટૂલ પર ચાલતા AI-driven QA એ "બધી સુવિધાઓ કાર્યરત છે, પાસ" (All features working, pass) રિપોર્ટ કર્યો, છતાં કેનવાસ પર કંઈ દેખાતું નહોતું. આ ખોટો પાસ મોડેલના તર્કની ખામી નહોતી; તે બ્રાઉઝર કેવી રીતે છુપાયેલા ટેબ્સને હેન્ડલ કરે છે અને ટેસ્ટ સ્ક્રિપ્ટ વિઝ્યુઅલ આઉટપુટને બદલે "હેલ્થ" ને કેવી રીતે માપે છે તેનો આડઅસર હતી.

AI QA એજન્ટ્સ ખાલી કેનવાસ કેમ ચૂકી શકે છે

તેઓ JavaScript એક્ઝિક્યુટ કરે છે, સ્ક્રીનશોટ લે છે, અને મોડેલ દ્વારા ફીચર યોગ્ય રીતે કામ કરી રહ્યું છે કે નહીં તેનો અંદાજ લગાવે છે. વ્યવહારમાં, બે ટેકનિકલ અંધબિંદુઓ (blind spots) વારંવાર ત્યારે પાસ રિપોર્ટ આપે છે જ્યારે UI ખરેખર ખાલી હોય છે.

Hidden-tab throttling ની સમજૂતી

Chrome MCP ઘણીવાર મુખ્ય વિન્ડોને અન્ય કામ માટે ખાલી રાખવા માટે બેકગ્રાઉન્ડ ટેબ્સમાં ટેસ્ટ ચલાવે છે. જ્યારે ટેબનું document.visibilityState hidden હોય છે, ત્યારે બ્રાઉઝર રેન્ડરિંગ પાઇપલાઇનને થ્રોટલ (throttle) કરે છે:

  • JavaScript ચાલતું રહે છે, તેથી કોઈ રનટાઇમ એરર દેખાતી નથી.
  • requestAnimationFrame કોલબેક્સ ચાલતા બંધ થઈ જાય છે, જેનાથી એનિમેશન ફ્રેમ કાઉન્ટ શૂન્ય થઈ જાય છે.
  • ટાઈમર્સ ઘણી ઓછી વાર ફાયર થાય છે; જે ટેસ્ટ 33 ms ના અંતરાલની અપેક્ષા રાખતો હતો તેણે માત્ર ચાર જ અવલોકન કર્યા.

AI એજન્ટ ક્લીન JS પરિણામો અને સ્ક્રીનશોટ જુએ છે, અને માની લે છે કે એનિમેશન સફળ રહ્યું. કારણ કે રેન્ડરિંગ લૂપે ક્યારેય પિક્સેલ્સ ઉત્પન્ન કર્યા નથી, તેથી વિઝ્યુઅલ ખામી છુપાયેલી રહે છે.

Hidden-tab સમસ્યાઓ માટેના ઉપાયો

  • કોઈપણ કેનવાસ, એનિમેશન અથવા ગ્રાફિક્સ વેરિફિકેશન માટે ટેસ્ટ ટેબને વિઝિબલ (visible) રાખો.
  • ટેબ ફોરગ્રાઉન્ડમાં આવે તે પછી જ ઇન્ટરેક્શન ટ્રિગર કરો.
  • સ્ક્રીનશોટ લેતા પહેલા થોડી રાહ જુઓ (થોડી સેકન્ડો), જેથી ખાતરી કરી શકાય કે ફ્રેમ બફર ભરાઈ ગયું છે.
  • જો છુપાયેલું ટેબ વાપરવું જ પડે, તો રિપોર્ટમાં “rendering not visually observed” જેવી ડિસ્ક્લેમર લાઇન ઉમેરો.

Code health vs. feature behavior

મોટાભાગના AI QA સ્ક્રિપ્ટ્સ "code health" નું મૂલ્યાંકન કરે છે: તેઓ પુષ્ટિ કરે છે કે ક્લિક હેન્ડલર્સ જોડાયેલા છે, કોઈ JavaScript એક્સેપ્શન આવતા નથી, અને જરૂરી લાઇબ્રેરીઓ લોડ થઈ છે. આ સંકેતો સાબિત કરે છે કે કોડ ચાલ્યો છે, પરંતુ UI ઈચ્છિત રીતે બદલાયું છે તે સાબિત કરતા નથી. એક કેનવાસ એલિમેન્ટ બનાવી શકાય છે, ડ્રોઇંગ રૂટિન કોલ કરી શકાય છે, અને તેમ છતાં જો ડ્રોઇંગ કમાન્ડ્સ શૂન્ય-કદના બફર અથવા ખાલી એસેટને ટાર્ગેટ કરતા હોય, તો કંઈ જ રેન્ડર થશે નહીં.

આ તફાવત મહત્વનો છે કારણ કે હેલ્ધી કોડ પાથ વિઝ્યુઅલ ખામીને છુપાવી શકે છે.

બિહેવિયર ચેક્સ ઉમેરવા

  1. ડાયનેમિક એલિમેન્ટ્સ ઓળખો – કેનવાસ ટેગ્સ, file-input ફીલ્ડ્સ, ડાઉનલોડ બટનો અને એનિમેશન લૂપ્સ માટે સોર્સ સ્કેન કરો.
  2. અવલોકન કરી શકાય તેવા પરિણામો વ્યાખ્યાયિત કરો – કેનવાસ માટે, પિક્સેલ-લેવલ ચેક કરો કે બીટમેપ ખાલી નથી. ફાઇલ ઇનપુટ માટે, પ્રિવ્યૂ ઈમેજ દેખાય છે તેની ખાતરી કરો. ડાઉનલોડ માટે, ફાઇલ ફાઇલસિસ્ટમ પર બની છે તેની પુષ્ટિ કરો. એનિમેશન માટે, ટ્રેક કરેલ પ્રોપર્ટી સમય જતાં બદલાય છે તેની ખાતરી કરો.
  3. કવરેજ રિપોર્ટ કરો – QA આઉટપુટ સાથે એક ટેબલ જોડો જેમાં દરેક ફીચર, કોડ-હેલ્થ સ્ટેટસ અને બિહેવિયર વેરિફિકેશન રિઝલ્ટની યાદી હોય. જે ફીચરમાં બિહેવિયર ચેક નથી, તેને “pass” ને બદલે “unverified” તરીકે દર્શાવો.

આ નિયમ લાગુ કરવાથી લેખકની ટેસ્ટ સૂટમાં ફોલ્સ પોઝિટિવ્સમાં મોટો ઘટાડો થયો અને CSS મિસમેચ પણ સામે આવ્યા જ્યાં સ્ટાઇલશીટમાં એક રંગ જાહેર કરવામાં આવ્યો હતો પરંતુ રેન્ડર થયેલ પિક્સેલ અલગ હતો.

વિશ્વસનીય વિઝ્યુઅલ ટેસ્ટિંગ માટે વ્યવહારુ પગલાં

  • ટેસ્ટ વિઝિબલ ટેબમાં ચલાવો જ્યારે પણ ફીચરમાં રેન્ડરિંગ સામેલ હોય.
  • UI સ્થિર થાય ત્યાં સુધી રાહ જુઓ; થોડી સેકન્ડોનો ફિક્સ વિલંબ ઘણીવાર પૂરતો હોય છે, પરંતુ વધુ મજબૂત અભિગમ એ getImageData નો ઉપયોગ કરીને નોન-બ્લેન્ક કેનવાસ માટે પોલ (poll) કરવાનો છે.
  • ટેસ્ટ સ્ક્રિપ્ટમાં code-health એસરશનને વિઝ્યુઅલ એસરશનથી અલગ કરો; AI મોડેલને દરેકનું સ્વતંત્ર રીતે મૂલ્યાંકન કરવા દો.
  • ડાયગ્નોસ્ટિક આઉટપુટના ભાગ રૂપે visibility state અને ફ્રેમ કાઉન્ટર્સ (requestAnimationFrame કોલ્સ) લોગ કરો.
  • કોઈપણ અનિવાર્ય hidden-tab રન માટે સ્પષ્ટ ચેતવણી સાથે દસ્તાવેજીકરણ કરો જેથી ડાઉનસ્ટ્રીમ રિવ્યુઅર્સ મર્યાદા સમજી શકે.

આગળ શું ધ્યાન રાખવું

જેમ જેમ AI-આધારિત QA ટૂલ્સ વધતા જાય છે, તેમ ડેવલપર્સે તેમને સહાયક (assistants) તરીકે જોવા જોઈએ, ન્યાયાધીશ (arbiters) તરીકે નહીં. કોડ-હેલ્થ મેટ્રિક્સ હંમેશા યુઝર-ફેસિંગ બિહેવિયર માટે અધૂરો પ્રોક્સી રહેશે. સારાંશ સરળ છે: AI મોડેલ ફક્ત તે જ રિપોર્ટ કરી શકે છે જે તે જુએ છે. જો ટેબ છુપાયેલું હોવાને કારણે બ્રાઉઝર ક્યારેય પેઇન્ટ ન કરે, અથવા જો ટેસ્ટ સ્ક્રિપ્ટ ક્યારેય “શું સ્ક્રીન પર કંઈક દેખાયું?” એવું ન પૂછે, તો મોડેલ ખુશીથી સફળતા જાહેર કરશે. વિઝિબિલિટી જરૂરિયાત અને બિહેવિયર-વેરિફિકેશન સ્ટેપ ઉમેરવાથી એક ઉપરછલ્લો પાસ વિશ્વસનીય પરિણામમાં બદલાઈ જશે.