نوشتن آزمایش پیش‌نمایش عکس صفحه

تست اسکرین شات روشی موثر برای بررسی ظاهر رابط کاربری شما برای کاربران است. ابزار Compose Preview Screenshot Testing سادگی و ویژگی‌های پیش‌نمایش‌های قابل ترکیب را با دستاوردهای بهره‌وری اجرای آزمایش‌های اسکرین‌شات سمت میزبان ترکیب می‌کند. تست اسکرین شات پیش نمایش نوشتن به گونه ای طراحی شده است که استفاده از آن به آسانی پیش نمایش های قابل ترکیب باشد.

تست اسکرین شات یک تست خودکار است که یک اسکرین شات از یک UI می گیرد و سپس آن را با یک تصویر مرجع قبلا تایید شده مقایسه می کند. اگر تصاویر مطابقت نداشتند، آزمایش با شکست مواجه می‌شود و یک گزارش HTML تولید می‌کند تا به شما در مقایسه و یافتن تفاوت‌ها کمک کند.

با ابزار Compose Preview Screenshot Testing، می توانید:

• تعدادی پیش‌نمایش قابل ترکیب موجود یا جدید را که می‌خواهید برای آزمایش‌های اسکرین‌شات استفاده کنید، شناسایی کنید.
• تصاویر مرجع را از آن پیش نمایش های قابل ترکیب ایجاد کنید.
• یک گزارش HTML ایجاد کنید که تغییرات در آن پیش نمایش ها را پس از ایجاد تغییرات کد مشخص می کند.
• از پارامترهای @Preview ، مانند uiMode یا fontScale و پیش‌نمایش‌های چندگانه برای کمک به مقیاس‌بندی تست‌های خود استفاده کنید.
• تست های خود را با مجموعه منبع جدید screenshotTest مدولار کنید.

الزامات

برای استفاده از Compose Preview Screenshot Testing، به موارد زیر نیاز دارید:

• اندروید Gradle 8.5.0-beta01 یا بالاتر.
• Kotlin 1.9.20 یا بالاتر.

راه اندازی

برای فعال کردن ابزار، مراحل زیر را دنبال کنید:

1. افزونه com.android.compose.screenshot نسخه 0.0.1-alpha01 به پروژه خود اضافه کنید.
1. افزونه را به فایل کاتالوگ نسخه خود اضافه کنید:

   [versions]
   agp = "8.5.0-beta01"
   kotlin = "1.9.20"
   ...
   screenshot = "0.0.1-alpha01"
   
   [plugins]
   ...
   screenshot = { id = "com.android.compose.screenshot", version.ref = "screenshot"}
   

2. در فایل build.gradle.kts در سطح ماژول، افزونه را در بلوک plugins {} اضافه کنید:

   plugins {
       ...
       alias(libs.plugins.screenshot)
   }
   

2. ویژگی آزمایشی را در فایل gradle.properties پروژه خود فعال کنید.

   android.experimental.enableScreenshotTest=true
   

3. در بلوک android {} فایل build.gradle.kts در سطح ماژول خود، پرچم آزمایشی را فعال کنید تا از مجموعه منبع screenshotTest استفاده کند و مطمئن شوید که kotlinCompilerExtensionVersion روی 1.5.4 یا بالاتر تنظیم شده است.

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

4. مطمئن شوید که وابستگی ui-tooling را اضافه کرده اید.
   1. آن را به کاتالوگ های نسخه خود اضافه کنید:

      [libraries]
      androidx-compose-ui-tooling = { group = "androidx.compose.ui", name = "ui-tooling"}
      

   2. آن را به فایل build.gradle.kts در سطح ماژول خود اضافه کنید:

      dependencies {
        screenshotTestImplementation(libs.androidx.compose.ui.tooling)
      }
      

پیش‌نمایش‌های قابل ترکیب را برای استفاده برای آزمایش‌های اسکرین‌شات تعیین کنید

برای تعیین پیش نمایش های قابل ترکیبی که می خواهید برای آزمایش های اسکرین شات استفاده کنید، پیش نمایش ها را در یک کلاس آزمایشی قرار دهید. فایل کلاس آزمایشی باید در مجموعه منبع جدید screenshotTest قرار داشته باشد، برای مثال app/src/screenshotTest/kotlin/com/google/yourapp/ExamplePreviewScreenshots.kt ( {module}/src/screenshotTest/{kotlin|java}/com/your/package ).

می‌توانید ترکیب‌پذیرها و/یا پیش‌نمایش‌های بیشتری، از جمله پیش‌نمایش‌های چندگانه، در این فایل یا فایل‌های دیگری که در همان مجموعه منبع ایجاد شده‌اند، اضافه کنید.

package com.google.yourapp

import androidx.compose.runtime.Composable
import androidx.compose.ui.tooling.preview.Preview
import com.google.yourapp.ui.theme.MyApplicationTheme

class ExamplePreviewsScreenshots {

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

تصاویر مرجع تولید کنید

پس از راه‌اندازی یک کلاس آزمایشی، باید تصاویر مرجع برای هر پیش‌نمایش تولید کنید. این تصاویر مرجع برای شناسایی تغییرات بعداً، پس از ایجاد تغییرات کد استفاده می‌شوند. برای تولید تصاویر مرجع برای آزمایش‌های اسکرین‌شات پیش‌نمایش، کار Gradle زیر را اجرا کنید:

• لینوکس و macOS: ./gradlew updateDebugScreenshotTest ( ./gradlew {:module:}update{Variant}ScreenshotTest )
• ویندوز: gradlew updateDebugScreenshotTest ( gradlew {:module:}update{Variant}ScreenshotTest )

پس از تکمیل کار، تصاویر مرجع را در app/src/debug/screenshotTest/reference ( {module}/src/{variant}/screenshotTest/reference ) پیدا کنید.

یک گزارش تست ایجاد کنید

هنگامی که تصاویر مرجع وجود دارند، وظیفه اعتبارسنجی را اجرا کنید تا یک اسکرین شات جدید بگیرید و آن را با تصویر مرجع مقایسه کنید:

• لینوکس و macOS: ./gradlew validateDebugScreenshotTest ( ./gradlew {:module:}validate{Variant}ScreenshotTest )
• Windows: gradlew validateDebugScreenshotTest ( gradlew {:module:}validate{Variant}ScreenshotTest )

کار تأیید یک گزارش HTML در {module}/build/reports/screenshotTest/preview/{variant}/index.html ایجاد می‌کند.

مسائل شناخته شده

می‌توانید فهرست فعلی مشکلات شناخته‌شده را در مؤلفه «ردیاب مشکل» ابزار پیدا کنید. هرگونه بازخورد و مشکل دیگر را از طریق ردیاب مشکل گزارش دهید.