CRX id
begcddgpiamjkanbgdcihlbfdmogcloo
begcddgpiamjkanbgdcihlbfdmogcloo
Description from extension meta
ለድር ጣቢያዎች የሀገር ውስጥ የእይታ ሪግሬሽን ሙከራ - UI ለውጦችን በእይታ ያወዳድሩ እና DOM/CSS ልዩነቶችን ያግኙ ከክላውድ
Image from store
Description from store
ከእያንዳንዱ ኮድ ለውጥ በኋላ የእይታ ስህተቶችን በእጅ ከመፈተሽ ተሰልቻችሁ? UI Testing Inspector DOM ትንተና ያላቸው የእርስዎ አስተማማኝ የሀገር ውስጥ የእይታ ልዩነት ፈታሽ ነው።
ለምንድ ነው የሚጠቀሙት?
⚡ 100% የሀገር ውስጥ እና ግላዊ: ሁሉም ስክሪን ሾቶች እና የማወዳደሪያ መረጃዎች በእርስዎ ኮምፒተር ውስጥ ይቆያሉ። ምንም የክላውድ አገልግሎቶች ወይም መረጃ ተጋራ የለም
⚡ ፈጣን ግብረ መልስ: ኤክስቴንሽኑን ጫኑ፣ ቤዝላይን ይውሰዱ፣ የኮድ ለውጦችን ያድርጉ እና ልዩነቶቹን ወዲያውኑ ይመልከቱ። ለፈጣን ሪግሬሽን ሙከራ ፍጹም
⚡ ፒክሴል-ፍጹም ተመልካች: የሰው ዓይን ሊያመልጣቸው የሚችሉ እንኳ ትንሽ የእይታ ለውጦችን ይይዙ
ዋና ባህሪያት:
🔸 አንድ-ክሊክ ቤዝላይን: የማንኛውም ወድ ጣቢያ "በፊት" ሁኔታን በአንድ ክሊክ ይያዙ
🔸 ፒክሴል-ፍጹም የእይታ ልዩነት: ቤዝላይኑን፣ አሁን ያለውን ሁኔታ እና ትክክለኛ ልዩነቶችን በሚያጎላ ምስል የሚያሳይ ግልፅ ሪፖርት ያግኙ
🔸 ኤለመንት መመርመር: ከመሰረታዊ ፈታሽ በላይ ይሂዱ። ኮዱን ብቻ ሳይሆን በDOM እና CSS ውስጥ የተቀየረውን ይመልከቱ
🔸 ሙሉ ገፅ እና ሁወትሽ ይዘት: በሚታየው አካባቢ ውስጥ ወይም ሙሉ ማሳረፊያ ገፅ መያዝን ይምረጡ
🔸 ሪፖርት ታሪክ: እስከ 15 ያህል ቀደሙ ማወዳደሪያ ሪፖርቶች ያስቀምጡ እና ይመርምሩ
🔸 ንጹህ እና ጨለማ ጠቀሚዎች: ለምቹ ይዘት፣ በቀን ወይም በሌሊት
በዝርዝሩ ሪፖርት ውስጥ
🔍 ከእያንዳንዱ ማወዳደሪያ በኋላ፣ ሙሉ ምስል የሚሰጥ ሰፊ ሪፖርት ታገኛላችሁ:
✔️ ማጠቃለያ: የእይታ ልዩነቶች ፐርሰንት እና የተጨመሩ፣ የተወገዱ እና የተቀየሩ ንዋያት ብዛት
✔️ ለጎን ይመለከቱ: "በፊት" እና "በኋላ" ስክሪን ሾቶችን ከተጎላ "ልዩነቶች" ምስል ጎን አወዳድሩ
✔️ DOM እና CSS ለውጦች ዝርዝር: በትክክል የተቀየሩ ንዋያትን ይለዩ። አንድ ፒክሴል የለወጠው ለምን እንደሆነ መገመት አያስፈልግም - እንደ ቀለም፣ ፊደል መጠን ወይም ወሰን ያሉ ኮድ-ደረጃ ለውጦችን ይመልከቱ
✔️ ቴክኒካዊ ዝርዝሮች: የአቀማመጥ ለውጦች፣ የይዘት ማሻሻያዎች እና የመዋቅር ማሻሻያዎች ሰፊ ትንተና
የሚያዙዋቸው ነገሮች:
➤ የአቀማመጥ ለውጦች እና የተደራጅ ስህተቶች
➤ የቀለም እና የቅጥ ለውጦች
➤ የጠፉ ወይም የተዛወሩ ንዋያት
➤ የፊደል እና የጽሑፍ ማሻሻያዎች
➤ የምስል ልዩነቶች
እንዴት ይሰራል:
1️⃣ የእይታ ቤዝላይን ይስጡ: ለመፈተሽ የሚፈልጉትን ገፅ ይሂዱ እና በኤክስቴንሽን ፖፕአፕ ውስጥ "ቤዝላይን ይስጡ" ይጫኑ። ይህ የእርስዎ የእውነት ምንጭ ነው።
2️⃣ በመተማመን ኮድ ያርግ: በCSS ላይ ለውጦችን ያድርጉ፣ ይዘትን ያዘምኑ ወይም አካላትን እንደገና ያደራጁ።
3️⃣ ለውጦችን ወዲያውኑ ይፈትሹ: "ከቤዝላይን ጋር አወዳድር" ይጫኑ። በዝርዝሩ የእይታ ሪፖርት አዲስ ታብ ይከፈታል።
4️⃣ ልዩነቶችን ተንትኑ: እያንዳንዱን ችግር ለመለየት የጎን-ለ-ጎን እይታን እና የተያዙ ለውጦች ዝርዝርን ይጠቀሙ।
5️⃣ ቤዝላይኑን ያዘምኑ: በአዲሱ ስሪት ተደሰታችሁ? አዲሱን መልክ እንደ ማጣቀሻ ለማስቀመጥ "ቤዝላይን ይስጡ" ን እንደገና ይጫኑ።
ባለሙያ ጠቃሚ ምክሮች
✨ ቤዝላይኖችን ከመያዝ በፊት ገፆች ሙሉ በሙሉ እስኪጫኑ ድረስ ይጠብቁ
✨ ለሰፊ ሙከራ የሙሉ ገፅ መያዝን ይጠቀሙ
✨ ለትክክለኛ ማወዳደሪያ በተመሳሳይ የብሮውዘር መስኮት መጠን ስክሪን ሾቶችን ይውሰዱ
✨ ይዘት ወጥ በሆነ ጊዜ ቤዝላይኖችን ይያዙ
✨ ለግልፅ ልዩነት ውጤቶች በአንድ ጊዜ አንድ ለውጥ ይፈትሹ
✨ ከትላልቅ ኮድ ማዳሰሶች በፊት አስፈላጊ ቤዝላይኖችን ያስቀምጡ
✨ ተመሳሳይ የገፅ ሁኔታዎችን ያወዳድሩ (ተመሳሳይ የተጠቃሚ መግቢያ ሁኔታ፣ የተጫኑ መረጃዎች)
የአጠቃቀም ጉዳዮች
✅ የእይታ ሪግሬሽን ሙከራ: ዋናው የአጠቃቀም ጉዳይ። ለውጦችን ካደረጉ በኋላ፣ ማንኛውንም ያልታሰበ የእይታ ስህተት ለመያዝ ማወዳደሪያ ያስኬዱ።
✅ UI/ዲዛይን ማረጋገጫ: ከዲዛይን ሞዴሎች ጋር ፒክሴል-ፍጹም ትግበራ እና የምርት ወጥነት ያረጋግጡ።
✅ CSS እንደገና አደረጃጀት: የቀድሞ CSS ን ያለ ፍርሃት እንደገና ያደራጁ። ፈጣን የእይታ ልዩነት ሙከራ ለውጦችዎ ያልተጠበቁ የጎንዮሽ ተፅእኖዎች እንዳላቸው ወዲያውኑ ይነግርዎታል።
✅ የፊት-ወደ-ፊት ሙከራ: ለማንኛውም የፊት-ወደ-ፊት ሙከራ የስራ ሂደት አስፈላጊ መሳሪያ፣ ወዲያውኑ የእይታ ግብረ መልስ ይሰጣል።
ለማን ተሠርቷል?
➡️ የፊት-ወደ-ፊት ገንቢዎች: ኮድዎን ከመስጠትዎ በፊት የአቀማመጥ ችግሮችን ይያዙ
➡️ QA ኢንጂነሮች: በአስተማማኝ የእይታ ማረጋገጫ ደረጃ የእጅ UI ሙከራዎችዎን ያሻሽሉ
➡️ UI/UX ዲዛይነሮች: የቀጥታ ትግበራ ከዲዛይንዎ ጋር እንደሚዛመድ በፍጥነት ያረጋግጡ
➡️ ነፃ ሰራተኞች እና ትንንሽ ቡድኖች: ያለ ኢንተርፕራይዝ ዋጋ መለያ የእይታ ሙከራ መሳሪያ
ለምን ይልቅ ይታያል
🖼️ ከእጅ ስክሪን ሾቶች የተሻለ: በዴስክቶፕ አቃፊዎችዎ ውስጥ የ"በፊት" እና "በኋላ" ምስሎችን ማስተዳደር ያቁሙ
📝ዜሮ የመማሪያ ኩርባ: ማሰስ ከቻሉ፣ ይህንን መሳሪያ መጠቀም ይችላሉ
ተደጋጋሚ ጥያቄዎች
❓ ለውጦችን እንዴት ይያዛል?
💬 ሁለት ዘዴ አቀራረብ ይጠቀማል: ለእይታ ልዩነት ፒክሴል-በ-ፒክሴል ማወዳደሪያ እና ለDOM/CSS ለውጦች ዝርዝር መዋቅራዊ ስካን።
❓ መረጃዬ አስተማማኝ ነው?
💬አዎ። ሁሉም ነገር በብሮውዘርዎ ውስጥ 100% በሀገር ውስጥ ይሠራል እና ይቀመጣል።
❓በሎካልሆስት ላይ መጠቀም እችላለሁ?
💬በፍጹም! በሀገር ውስጥ ልማት ወቅት በትክክል ይሰራል።
❓ስለ ተለዋዋጭ ይዘት ምን ይባላል?
💬 መሳሪያው የተንቀሳቃሽ ሁኔታዎችን ለማወዳደር ተዘጋጅቷል። ለተሻለ ውጤቶች፣ አኒሜሽኖች ሲሟሉ እና ማስታወቂያዎች ወጥ ሲሆኑ ስክሪን ሾቶችዎን ይያዙ።
Latest reviews
- (2025-07-09) Дарья Петрова: Creates a full and detailed report of differences between two versions of web pages. Waiting for Visual comparison of whole page, not just viewport visible parts.