झलक दिखाने वाले स्क्रीनशॉट की टेस्टिंग कंपोज़ करें

स्क्रीनशॉट टेस्टिंग, यह पुष्टि करने का एक असरदार तरीका है कि आपका यूज़र इंटरफ़ेस (यूआई) लोगों को कैसा दिखता है. Compose Preview Screenshot Testing टूल में, कंपोज़ेबल झलक की सुविधाओं और इसे इस्तेमाल करने में आसानी के साथ-साथ, होस्ट-साइड स्क्रीनशॉट टेस्ट चलाने से मिलने वाले फ़ायदों को भी शामिल किया गया है. Compose की झलक स्क्रीनशॉट टेस्टिंग को कंपोज़ेबल की झलक की तरह ही इस्तेमाल करने में आसान बनाया गया है.

स्क्रीनशॉट टेस्ट, एक ऑटोमेटेड टेस्ट होता है. इसमें यूज़र इंटरफ़ेस (यूआई) के किसी हिस्से का स्क्रीनशॉट लिया जाता है. इसके बाद, इसकी तुलना पहले से मंज़ूर की गई रेफ़रंस इमेज से की जाती है. अगर इमेज मेल नहीं खाती हैं, तो टेस्ट पूरा नहीं होता. साथ ही, एक एचटीएमएल रिपोर्ट जनरेट होती है. इससे आपको दोनों इमेज की तुलना करने और उनमें अंतर ढूंढने में मदद मिलती है.

'ईमेल लिखने की सुविधा की झलक दिखाने वाले टूल के स्क्रीनशॉट की जांच करने वाले टूल' की मदद से, ये काम किए जा सकते हैं:

• मौजूदा या नई कंपोज़ेबल प्रीव्यू के लिए, स्क्रीनशॉट टेस्ट बनाने के लिए @PreviewTest का इस्तेमाल करें.
• उन कंपोज़ेबल झलक से रेफ़रंस इमेज जनरेट करें.
• एक एचटीएमएल रिपोर्ट जनरेट करें. इससे कोड में बदलाव करने के बाद, उन झलक में हुए बदलावों का पता चलता है.
• अपने टेस्ट को बड़े पैमाने पर करने के लिए, @Preview पैरामीटर का इस्तेमाल करें. जैसे, uiMode या fontScale. साथ ही, एक से ज़्यादा झलकें दिखाएं.
• नए screenshotTest सोर्स सेट की मदद से, अपने टेस्ट को मॉड्यूलर बनाएं.

ज़रूरी शर्तें

Compose झलक की स्क्रीनशॉट टेस्टिंग का इस्तेमाल करने के लिए, आपके पास ये चीज़ें होनी चाहिए:

• Android Gradle प्लगिन 8.5.0 या इसके बाद का वर्शन.
• Kotlin 1.9.20 या इसके बाद का वर्शन. हमारा सुझाव है कि Kotlin 2.0 या इसके बाद के वर्शन का इस्तेमाल करें, ताकि Compose Compiler Gradle प्लगिन का इस्तेमाल किया जा सके.
• JDK 23 या इससे पहले का वर्शन.

• आपके प्रोजेक्ट के लिए, कंपोज़ करने की सुविधा चालू हो. हमारा सुझाव है कि Compose Compiler Gradle प्लगिन का इस्तेमाल करके, Compose को चालू करें.

सेटअप

इस टूल को चालू करने के लिए, यह तरीका अपनाएं:

1. अपने प्रोजेक्ट की gradle.properties फ़ाइल में, एक्सपेरिमेंटल प्रॉपर्टी चालू करें.

         android.experimental.enableScreenshotTest=true
       

2. मॉड्यूल-लेवल की build.gradle.kts फ़ाइल के android {} ब्लॉक में, एक्सपेरिमेंट के तौर पर उपलब्ध फ़्लैग चालू करें, ताकि screenshotTest सोर्स सेट का इस्तेमाल किया जा सके.

         android {
             experimentalProperties["android.experimental.enableScreenshotTest"] = true
         }
       

3. अपने प्रोजेक्ट में com.android.compose.screenshot प्लगिन, वर्शन 0.0.1-alpha13 जोड़ें.
   1. प्लगिन को वर्शन कैटलॉग फ़ाइल में जोड़ें:

                [versions]
                agp = "9.0.0-rc03"
                kotlin = "2.1.20"
                screenshot = "0.0.1-alpha13"
      
                [plugins]
                screenshot = { id = "com.android.compose.screenshot", version.ref = "screenshot"}
              

   2. मॉड्यूल-लेवल की build.gradle.kts फ़ाइल में, plugins {} ब्लॉक में प्लगिन जोड़ें:

                plugins {
                    alias(libs.plugins.screenshot)
                }
              

4. screenshot-validation-api और ui-tooling डिपेंडेंसी जोड़ें.
   1. उन्हें अपने वर्शन कैटलॉग में जोड़ें:

                [libraries]
                screenshot-validation-api = { group = "com.android.tools.screenshot", name = "screenshot-validation-api", version.ref = "screenshot"}
                androidx-ui-tooling = { group = "androidx.compose.ui", name = "ui-tooling"}
              

   2. इन्हें मॉड्यूल-लेवल की build.gradle.kts फ़ाइल में जोड़ें:

                dependencies {
                  screenshotTestImplementation(libs.screenshot.validation.api)
                  screenshotTestImplementation(libs.androidx.ui.tooling)
                }
              

स्क्रीनशॉट टेस्ट के लिए, कंपोज़ेबल झलकियां तय करना

आपको कंपोज़ेबल की जिन झलकियों का इस्तेमाल स्क्रीनशॉट टेस्ट के लिए करना है उन्हें @PreviewTest एनोटेशन से मार्क करें. झलकियां, नए screenshotTest सोर्स सेट में होनी चाहिए. उदाहरण के लिए, app/src/screenshotTest/kotlin/com/example/yourapp/ExamplePreviewScreenshotTest.kt.

इस फ़ाइल या एक ही सोर्स सेट में बनाई गई अन्य फ़ाइलों में, ज़्यादा कंपोज़ेबल और/या झलकें जोड़ी जा सकती हैं. इनमें एक साथ कई झलकें दिखाने की सुविधा भी शामिल है.

package com.example.yourapp

import androidx.compose.runtime.Composable
import androidx.compose.ui.tooling.preview.Preview
import com.android.tools.screenshot.PreviewTest
import com.example.yourapp.ui.theme.MyApplicationTheme

@PreviewTest
@Preview(showBackground = true)
@Composable
fun GreetingPreview() {
    MyApplicationTheme {
        Greeting("Android!")
    }
}

रेफ़रंस इमेज जनरेट करना

टेस्ट क्लास सेट अप करने के बाद, आपको हर झलक के लिए रेफ़रंस इमेज जनरेट करनी होंगी. इन रेफ़रंस इमेज का इस्तेमाल, कोड में बदलाव करने के बाद, बदलावों की पहचान करने के लिए किया जाता है. कंपोज़ेबल की झलक दिखाने वाले स्क्रीनशॉट टेस्ट के लिए रेफ़रंस इमेज जनरेट करने के लिए, यह Gradle टास्क चलाएं:

• Linux और macOS: ./gradlew updateDebugScreenshotTest (./gradlew :{module}:update{Variant}ScreenshotTest)
• Windows: gradlew updateDebugScreenshotTest (gradlew :{module}:update{Variant}ScreenshotTest)

टास्क पूरा होने के बाद, app/src/screenshotTestDebug/reference ({module}/src/screenshotTest{Variant}/reference) में जाकर रेफ़रंस इमेज ढूंढें.

टेस्ट रिपोर्ट जनरेट करना

रेफ़रंस इमेज मौजूद होने के बाद, पुष्टि करने वाला टास्क चलाएं, ताकि नया स्क्रीनशॉट लिया जा सके और उसकी तुलना रेफ़रंस इमेज से की जा सके:

• Linux और macOS: ./gradlew validateDebugScreenshotTest (./gradlew :{module}:validate{Variant}ScreenshotTest)
• Windows: gradlew validateDebugScreenshotTest (gradlew :{module}:validate{Variant}ScreenshotTest)

पुष्टि करने वाला टास्क, {module}/build/reports/screenshotTest/preview/{variant}/index.html पर एक एचटीएमएल रिपोर्ट बनाता है.

पहले से मालूम समस्याएं

टूल के समस्या ट्रैकर कॉम्पोनेंट में, आपको उन समस्याओं की मौजूदा सूची मिल सकती है जिनके बारे में हमें पता है. किसी अन्य समस्या की शिकायत करने या सुझाव/राय देने के लिए, समस्या ट्रैकर का इस्तेमाल करें.

रिलीज़ से जुड़े अपडेट

0.0.1-alpha13

इस रिलीज़ में ये सुविधाएं जोड़ी गई हैं:

• JDK 17 या इसके बाद के वर्शन के साथ काम करता है.
• गड़बड़ियां ठीक की गई हैं और Android Studio के साथ बेहतर तरीके से इंटिग्रेट किया गया है.

0.0.1-alpha12

इस रिलीज़ में ये सुविधाएं जोड़ी गई हैं:

• Android Gradle प्लगिन (AGP) 9.0 के साथ काम करता है.
• JDK 24 और इसके बाद के वर्शन पर, स्क्रीनशॉट टेस्ट चलाने की सुविधा.
• ज़्यादा से ज़्यादा हीप साइज़ को कॉन्फ़िगर करने की सुविधा.
• रेंडरिंग से जुड़ी गड़बड़ियों को ठीक किया गया है. साथ ही, टेस्ट की स्थिरता को बेहतर बनाया गया है.
• रिपोर्टिंग को बेहतर बनाया गया है, ताकि नई और रेफ़रंस इमेज से जुड़े प्रतिशत के अंतर और अन्य मेटाडेटा को शामिल किया जा सके.

0.0.1-alpha11

इस रिलीज़ में ये सुविधाएं जोड़ी गई हैं:

• Android Gradle प्लगिन (AGP) 8.13 के साथ काम करता है.
• होस्ट मशीन की स्थान-भाषा के बावजूद, दशमलव वैल्यू वाले एक्सएमएल ड्रॉएबल को पार्स करने की सुविधा जोड़ी गई.
• अगर होस्ट मशीन पर JDK 24 या इसके बाद का वर्शन इस्तेमाल किया जा रहा है, तो JDK (11-23) का इस्तेमाल किया जाएगा. हालांकि, इसके लिए ज़रूरी है कि JDK (11-23) इंस्टॉल किया गया हो.

0.0.1-alpha10

इस रिलीज़ में ये सुविधाएं जोड़ी गई हैं:

• इस वर्शन से, आपको झलक वाले सभी फ़ंक्शन को @PreviewTest एनोटेशन के साथ मार्क करना होगा. एनोटेशन के बिना झलकें नहीं दिखाई जाएंगी.

• रेफ़रंस इमेज डायरेक्ट्री को {module}/src/{variant}/screenshotTest/reference से बदलकर {module}/src/screenshotTest{Variant}/reference कर दिया गया है. ऐसा इसलिए किया जाता है, ताकि जनरेट की गई रेफ़रंस इमेज, प्रोडक्शन कोड का हिस्सा न बनें. साथ ही, यह भी पक्का किया जा सके कि वे अन्य टेस्ट टाइप के डायरेक्ट्री स्ट्रक्चर के मुताबिक हों.

• {variant}PreviewScreenshotRender टास्क हटा दिया जाता है. इमेज रेंडरिंग को JUnit Test Engine में माइग्रेट किया गया है.

• अपडेट करने से पहले, update{Variant}ScreenshotTest टास्क में रेंडर की गई नई इमेज की तुलना रेफ़रंस इमेज से की जाएगी. यह सिर्फ़ उन इमेज को अपडेट करेगा जिनमें तय की गई सीमा से ज़्यादा अंतर है. --updateFilter कमांडलाइन फ़्लैग को हटा दिया गया है.

0.0.1-alpha06

इस रिलीज़ में ये सुविधाएं जोड़ी गई हैं:

इमेज के अंतर का थ्रेशोल्ड: इस नई ग्लोबल थ्रेशोल्ड सेटिंग की मदद से, आपको स्क्रीनशॉट की तुलना करने की सुविधा पर बेहतर कंट्रोल मिलेगा. इसे कॉन्फ़िगर करने के लिए, अपने मॉड्यूल की build.gradle.kts फ़ाइल को अपडेट करें:

android {
    testOptions {
        screenshotTests {
            imageDifferenceThreshold = 0.0001f // 0.01%
        }
    }
}

यह थ्रेशोल्ड, मॉड्यूल में तय की गई सभी स्क्रीनशॉट जांचों पर लागू होगा.

• गड़बड़ियां ठीक की गईं: कंपोज़ रेंडरर से जुड़ी कुछ गड़बड़ियां ठीक की गईं. साथ ही, खाली कंपोज़ के लिए सहायता जोड़ी गई
• परफ़ॉर्मेंस में सुधार: इमेज की तुलना करने वाले एल्गोरिदम को अपडेट किया गया है, ताकि वह तेज़ी से काम कर सके