Screenshot Test: यह क्या है, प्रकार और परीक्षण में यह कैसे काम करता है

Screenshot Test क्या है और इसकी आवश्यकता क्यों है?

Screenshot Test एक एंड-टू-एंड उपयोगकर्ता इंटरफ़ेस परीक्षण है जहाँ परीक्षण एप्लिकेशन स्क्रीन खोलता है, क्रियाएँ करता है (टैप, टेक्स्ट इनपुट, स्क्रॉल) और परिणामी स्थिति का स्क्रीनशॉट लेता है। स्क्रीनशॉट की तुलना रिपॉजिटरी में संग्रहीत बेसलाइन से की जाती है। यदि स्क्रीनशॉट भिन्न होते हैं — परीक्षण विफल हो जाता है। स्क्रीनशॉट टेस्ट दृश्य प्रतिगमन का पता लगाते हैं जो यूनिट टेस्ट नहीं देख सकते: गलत मार्जिन, ओवरलैपिंग तत्व, गलत रंग।

अगर हमारे पास गोल्डन टेस्ट हैं तो स्क्रीनशॉट टेस्ट की आवश्यकता क्यों है — गोल्डन टेस्ट घटकों को अलगाव में जाँचते हैं: एक बटन, एक कार्ड, एक टेक्स्ट। स्क्रीनशॉट टेस्ट एक पूर्ण स्क्रीन को प्रोडक्शन के जितना करीब हो सके वातावरण में जाँचते हैं: वास्तविक नेविगेशन, वास्तविक डेटा (या अधिकतम यथार्थवादी मॉक), वास्तविक सिस्टम फ़ॉन्ट, वास्तविक स्टेटस बार। केवल एक स्क्रीनशॉट टेस्ट दिखाएगा कि एक बटन वास्तविक डिवाइस पर किसी अन्य तत्व के साथ ओवरलैप होता है।

स्क्रीनशॉट टेस्ट का व्यावसायिक मूल्य

व्यावसायिक मूल्य — Google (2023) के अनुसार, दृश्य बग सभी मोबाइल एप्लिकेशन बग का 15-25% होते हैं। स्क्रीनशॉट टेस्ट दृश्य गुणवत्ता जाँच को स्वचालित करते हैं जो पहले QA इंजीनियरों द्वारा मैन्युअल रूप से की जाती थी। एक स्क्रीनशॉट टेस्ट एक स्क्रीन के 5-10 मिनट के मैन्युअल परीक्षण की जगह लेता है। 50 स्क्रीन वाले एप्लिकेशन के लिए, बचत: प्रति रिग्रेशन रन 4-8 व्यक्ति-घंटे। स्क्रीनशॉट टेस्ट 2-3 रिलीज़ चक्रों में भुगतान करते हैं।

Screenshot Test बनाम Golden Test: दृष्टिकोणों की तुलना

गोल्डन टेस्ट तेज़ और सरल होते हैं: ऑफ-स्क्रीन बफर में एक घटक को रेंडर करने में मिलीसेकंड लगते हैं, डिवाइस की आवश्यकता नहीं होती, और CI पर स्थिर होते हैं। स्क्रीनशॉट टेस्ट अधिक यथार्थवादी होते हैं: वे सिस्टम तत्वों के साथ एक वास्तविक स्क्रीन कैप्चर करते हैं, एनिमेशन और नेविगेशन का समर्थन करते हैं, और वास्तविक उपकरणों पर काम करते हैं। चुनाव लक्ष्य पर निर्भर करता है: डेवलपर के लिए तेज़ प्रतिक्रिया (गोल्डन) या रिलीज़ से पहले अधिकतम यथार्थवाद (स्क्रीनशॉट)।

कवरेज रणनीति: गोल्डन + स्क्रीनशॉट

Golden + Screenshot — घटक लाइब्रेरी (Design System) में प्रत्येक UI घटक के लिए गोल्डन टेस्ट का उपयोग करें। 80% दृश्य प्रतिगमन घटक स्तर पर पकड़े जाते हैं। स्क्रीनशॉट टेस्ट — महत्वपूर्ण उपयोगकर्ता पथों के लिए: ऑनबोर्डिंग, लॉगिन, भुगतान फ़्लो, शॉपिंग कार्ट। वास्तविक स्क्रीन पर घटक एकीकरण से संबंधित 20% प्रतिगमन केवल स्क्रीनशॉट टेस्ट द्वारा पकड़े जाते हैं। IT Sectr में हम 80/20 अनुपात का उपयोग करते हैं: 400 गोल्डन + 100 स्क्रीनशॉट।

स्क्रीनशॉट टेस्ट कब आवश्यक नहीं है — यदि स्क्रीन बिना इंटरैक्टिविटी के स्थिर सामग्री से बनी है, तो एक गोल्डन घटक परीक्षण कम लागत पर समान स्तर का सत्यापन प्रदान करता है। यदि स्क्रीन गतिशील रूप से बदलती है (फ़ीड, चैट), तो स्क्रीनशॉट टेस्ट में जटिल डेटा सेटअप और प्रतीक्षा समय की आवश्यकता होती है। ऐसे मामलों में, बेसलाइन स्थिति (खाली सूची, लोडिंग) के लिए स्क्रीनशॉट और सूची में अलग-अलग कार्ड के लिए गोल्डन का उपयोग करें।

Android के लिए UI Automator और Firebase Test Lab

UI Automator क्रॉस-एप्लिकेशन UI परीक्षण के लिए एक Android फ्रेमवर्क है। यह UiDevice.takeScreenshot() के माध्यम से स्क्रीनशॉट लेने की अनुमति देता है। Espresso के विपरीत (एक ही एप्लिकेशन के अंदर काम करता है), UI Automator सिस्टम डायलॉग (अनुमतियाँ, सूचनाएँ) और अन्य एप्लिकेशन के साथ बातचीत कर सकता है। UI Automator पर स्क्रीनशॉट टेस्ट: ऐप खोलें, लोड होने की प्रतीक्षा करें, स्क्रीनशॉट लें, बेसलाइन से तुलना करें।

class LoginScreenScreenshotTest {

    @get:Rule
    val rule = ComposeTestRule.createAndroidComposeRule<MainActivity>()

    @Test
    fun login_screen_default() {
        val device = UiDevice.getInstance(
            InstrumentationRegistry.getInstrumentation()
        )

        // स्क्रीन लोड होने की प्रतीक्षा
        IdlingRegistry.getInstance().waitForIdle()

        // स्क्रीनशॉट लेते हैं
        val screenshot = device.takeScreenshot()
        val golden = loadGolden("login_default.png")

        // संदर्भ के साथ तुलना करते हैं
        val diff = ImageComparator.compare(screenshot, golden)
        assertTrue(diff.similarity > 0.98)
    }
}

Firebase Test Lab सैकड़ों वास्तविक उपकरणों पर समानांतर में इंस्ट्रूमेंटेड टेस्ट चलाने के लिए एक Google Cloud सेवा है। Firebase Test Lab पर स्क्रीनशॉट टेस्ट विभिन्न उपकरणों (Pixel 7, Galaxy S24, Xiaomi 14) पर स्क्रीनशॉट कैप्चर करते हैं और बेसलाइन से तुलना करते हैं। लाभ: एक परीक्षण 20 उपकरणों पर 10-15 मिनट में UI की जाँच करता है। नुकसान: लागत ($1-5 प्रति परीक्षण 20 उपकरणों पर)। Firebase Test Lab gcloud CLI या Gradle प्लगइन के माध्यम से CI के साथ एकीकृत होता है।

Shot: स्क्रीनशॉट टेस्ट को सरल बनाने के लिए लाइब्रेरी

Shot Android पर स्क्रीनशॉट परीक्षण के लिए एक लाइब्रेरी है जो स्क्रीनशॉट बनाने और तुलना करने को सरल बनाती है। Shot Espresso और UI Automator के शीर्ष पर काम करता है, गोल्डन प्रबंधन (बनाना, अपडेट करना, हटाना), थ्रेशोल्ड के साथ तुलना (पिक्सेल या प्रतिशत) और HTML रिपोर्ट जनरेशन जोड़ता है। Shot उन परियोजनाओं के लिए उपयुक्त है जो अपनी स्वयं की छवि तुलना बुनियादी ढाँचा लिखे बिना जल्दी से स्क्रीनशॉट परीक्षण लागू करना चाहते हैं।

iOS के लिए XCUITest और Xcode Cloud

XCUITest iOS, iPadOS और tvOS एप्लिकेशन के UI परीक्षण के लिए Apple का फ्रेमवर्क है। XCUITest पर स्क्रीनशॉट टेस्ट स्क्रीन कैप्चर के लिए XCUIScreen.main.screenshot() और स्क्रीनशॉट सहेजने के लिए XCAttachment का उपयोग करते हैं। XCUITest उपयोगकर्ता क्रियाओं का अनुकरण करता है: टैप, स्वाइप, typeText, और प्रत्येक चरण के बाद स्क्रीनशॉट लेता है। Xcode 16+ में, XCTAttachment के माध्यम से बेसलाइन के साथ अंतर्निहित स्क्रीनशॉट तुलना जोड़ी गई है।

final class LoginScreenScreenshotTests: XCTestCase {

    var app: XCUIApplication!

    override func setUp() {
        super.setUp()
        app = XCUIApplication()
        app.launch()
    }

    func test_login_initial_state() {
        let loginButton = app.buttons["login_button"]
        XCTAssertTrue(loginButton.exists)

        // स्क्रीनशॉट लेते हैं
        let screenshot = app.screenshot()
        let attachment = XCTAttachment(screenshot: screenshot)
        attachment.name = "Login-Screen-Initial"
        attachment.lifetime = .keepAlways
        add(attachment)

        // संदर्भ के साथ तुलना (XCTAttachment + golden की आवश्यकता है)
        assertScreenshot(
            screenshot: screenshot,
            goldenName: "login_initial_state"
        )
    }
}

Xcode Cloud iOS एप्लिकेशन बनाने और परीक्षण करने के लिए Apple का क्लाउड CI है। Xcode Cloud सिमुलेटर पर XCUITest टेस्ट चलाने का समर्थन करता है। स्क्रीनशॉट टेस्ट कई सिमुलेटर पर समानांतर में चलाए जा सकते हैं (iPhone 15, iPhone 15 Pro Max, iPad Pro)। परिणाम: अटैचमेंट के साथ XCResult Bundle। Xcode Cloud GitHub/GitLab में निर्मित नहीं है — एकीकरण के लिए Xcode Cloud Webhooks का उपयोग करें। विकल्प: macos-14 और xcodebuild के साथ GitHub Actions।

तुलना फ्रेमवर्क — iOSSnapshotTestCase (Uber) सिमुलेटर पर चलाए जाने पर स्क्रीनशॉट टेस्ट के लिए भी काम करता है। SwiftSnapshotTesting (pointfree) घटक गोल्डन टेस्ट के लिए अधिक उन्मुख है। iOS पर स्क्रीनशॉट टेस्ट के लिए, अंतर्निहित XCUITest टूल + XCTAttachment + कस्टम ImageComparator (Pixelmator या AImage) का उपयोग करें। CI पर सिमुलेटर का उपयोग करें — वास्तविक उपकरणों पर स्क्रीनशॉट टेस्ट केवल Device Farm (AWS Device Farm) के माध्यम से काम करते हैं।

CI में स्क्रीनशॉट टेस्ट स्वचालन प्रक्रिया

बेसलाइन प्रबंधन — बेसलाइन स्क्रीनशॉट रिपॉजिटरी (Git LFS) या S3 में संग्रहीत किए जाते हैं। प्रत्येक स्क्रीनशॉट को टेम्पलेट के अनुसार नाम दिया जाता है: {testName}_{device}_{orientation}_{locale}.png। उदाहरण: loginScreenPixel7PortraitRu.png। नया डिवाइस या लोकेल जोड़ने पर, एक नई बेसलाइन बनाई जाती है। UI बदलने पर, कोड समीक्षा के बाद पुरानी बेसलाइन को नई से बदल दिया जाता है। बेसलाइन कोड बेस का हिस्सा है, परीक्षण स्रोतों की तरह।

CI पाइपलाइन — (1) एप्लिकेशन बनाएँ। (2) एमुलेटर/सिमुलेटर पर स्क्रीनशॉट टेस्ट चलाएँ। (3) स्क्रीनशॉट की बेसलाइन से तुलना करें। (4) बेमेल होने पर — diff छवि उत्पन्न करें। (5) diff आर्टिफैक्ट अपलोड करें (actual, expected, diff — तीन फ़ाइलें)। (6) परिणाम तालिका के साथ HTML रिपोर्ट प्रकाशित करें। (7) यदि थ्रेशोल्ड पार हो गया — परीक्षण विफल होता है। (8) समीक्षक diff आर्टिफैक्ट की समीक्षा करता है और निर्णय लेता है: अनुमोदन (बेसलाइन अपडेट करें) या अस्वीकार (कोड ठीक करें)।

थ्रेशोल्ड और सहनशीलता — पिक्सेल-दर-पिक्सेल पूर्ण तुलना बहुत सख्त है। SSIM (स्ट्रक्चरल सिमिलरिटी इंडेक्स) या MSE (मीन स्क्वेर्ड एरर) का उपयोग करें। SSIM 0.98 = 98% संरचनात्मक समानता — एक अच्छा थ्रेशोल्ड। विभिन्न स्क्रीन को अलग-अलग थ्रेशोल्ड की आवश्यकता हो सकती है: डार्क थीम (अधिक काला — उच्च सटीकता), ग्रेडिएंट (अधिक शोर — कम सटीकता)। पैरामीटर के माध्यम से प्रति-परीक्षण थ्रेशोल्ड कॉन्फ़िगर करें: @ScreenshotTest(threshold = 0.99)।

Device Farm बनाम सिमुलेटर — वास्तविक उपकरणों (Firebase Test Lab, AWS Device Farm) पर परीक्षण अधिकतम यथार्थवाद प्रदान करते हैं लेकिन धीमे और भुगतान वाले होते हैं। सिमुलेटर/एमुलेटर पर परीक्षण तेज़ और मुफ़्त होते हैं लेकिन वास्तविक-डिवाइस सुविधाएँ (विभिन्न GPU, डिस्प्ले रंग प्रजनन, पिक्सेल घनत्व) नहीं दिखाते। रणनीति: प्री-मर्ज जाँच के लिए सिमुलेटर (5 मिनट), रात्रिकालीन के लिए Device Farm (30 मिनट, 20 डिवाइस)। IT Sectr में हम शीर्ष 10 Android उपकरणों पर रात्रिकालीन रन के लिए Firebase Test Lab का उपयोग करते हैं।