تست اسکرین شات روشی موثر برای بررسی ظاهر رابط کاربری شما برای کاربران است. ابزار 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 یا بالاتر.
راه اندازی
برای فعال کردن ابزار، مراحل زیر را دنبال کنید:
- افزونه
com.android.compose.screenshot
نسخه0.0.1-alpha07
را به پروژه خود اضافه کنید. - افزونه را به فایل کاتالوگ نسخه خود اضافه کنید:
[versions] agp = "8.5.0-beta01" kotlin = "1.9.20" ... screenshot = "0.0.1-alpha07" [plugins] ... screenshot = { id = "com.android.compose.screenshot", version.ref = "screenshot"}
- در فایل
build.gradle.kts
در سطح ماژول، افزونه را در بلوکplugins {}
اضافه کنید:plugins { ... alias(libs.plugins.screenshot) }
- ویژگی آزمایشی را در فایل
gradle.properties
پروژه خود فعال کنید.android.experimental.enableScreenshotTest=true
- در بلوک
android {}
فایلbuild.gradle.kts
در سطح ماژول خود، پرچم آزمایشی را فعال کنید تا از مجموعه منبعscreenshotTest
استفاده کند و مطمئن شوید کهkotlinCompilerExtensionVersion
روی 1.5.4 یا بالاتر تنظیم شده است.android { ... composeOptions { kotlinCompilerExtensionVersion = "1.5.4" } experimentalProperties["android.experimental.enableScreenshotTest"] = true }
- مطمئن شوید که وابستگی
ui-tooling
را اضافه کرده اید.- آن را به کاتالوگ های نسخه خود اضافه کنید:
[libraries] androidx-compose-ui-tooling = { group = "androidx.compose.ui", name = "ui-tooling"}
- آن را به فایل
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
ایجاد میکند.
مسائل شناخته شده
میتوانید فهرست فعلی مشکلات شناختهشده را در مؤلفه «ردیاب مشکل» ابزار پیدا کنید. هرگونه بازخورد و مشکل دیگر را از طریق ردیاب مشکل گزارش دهید.
به روز رسانی ها را منتشر کنید
یادداشت های انتشار و تغییرات برای نسخه های در حال اجرا
0.0.1-alpha06
این نسخه معرفی می کند:
آستانه تفاوت تصویر: این تنظیم آستانه جهانی جدید به شما این امکان را می دهد که کنترل دقیق تری بر مقایسه اسکرین شات بدست آورید. برای پیکربندی، build.gradle.kts ماژول خود را به روز کنید:
android {
...
testOptions {
...
screenshotTests {
imageDifferenceThreshold = 0.0001f // 0.01%
}
}
}
این آستانه برای تمام تست های اسکرین شات تعریف شده در ماژول اعمال خواهد شد.
- رفع اشکال: برخی از اشکالات Compose Renderer و پشتیبانی اضافه شده برای نوشتن خالی
- بهبود عملکرد: الگوریتم تفاوت تصویر بهروزرسانی شد تا سریعتر باشد
تست اسکرین شات روشی موثر برای بررسی ظاهر رابط کاربری شما برای کاربران است. ابزار 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 یا بالاتر.
راه اندازی
برای فعال کردن ابزار، مراحل زیر را دنبال کنید:
- افزونه
com.android.compose.screenshot
نسخه0.0.1-alpha07
را به پروژه خود اضافه کنید. - افزونه را به فایل کاتالوگ نسخه خود اضافه کنید:
[versions] agp = "8.5.0-beta01" kotlin = "1.9.20" ... screenshot = "0.0.1-alpha07" [plugins] ... screenshot = { id = "com.android.compose.screenshot", version.ref = "screenshot"}
- در فایل
build.gradle.kts
در سطح ماژول، افزونه را در بلوکplugins {}
اضافه کنید:plugins { ... alias(libs.plugins.screenshot) }
- ویژگی آزمایشی را در فایل
gradle.properties
پروژه خود فعال کنید.android.experimental.enableScreenshotTest=true
- در بلوک
android {}
فایلbuild.gradle.kts
در سطح ماژول خود، پرچم آزمایشی را فعال کنید تا از مجموعه منبعscreenshotTest
استفاده کند و مطمئن شوید کهkotlinCompilerExtensionVersion
روی 1.5.4 یا بالاتر تنظیم شده است.android { ... composeOptions { kotlinCompilerExtensionVersion = "1.5.4" } experimentalProperties["android.experimental.enableScreenshotTest"] = true }
- مطمئن شوید که وابستگی
ui-tooling
را اضافه کرده اید.- آن را به کاتالوگ های نسخه خود اضافه کنید:
[libraries] androidx-compose-ui-tooling = { group = "androidx.compose.ui", name = "ui-tooling"}
- آن را به فایل
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
ایجاد میکند.
مسائل شناخته شده
میتوانید فهرست فعلی مشکلات شناختهشده را در مؤلفه «ردیاب مشکل» ابزار پیدا کنید. هرگونه بازخورد و مشکل دیگر را از طریق ردیاب مشکل گزارش دهید.
به روز رسانی ها را منتشر کنید
یادداشت های انتشار و تغییرات برای نسخه های در حال اجرا
0.0.1-alpha06
این نسخه معرفی می کند:
آستانه تفاوت تصویر: این تنظیم آستانه جهانی جدید به شما این امکان را می دهد که کنترل دقیق تری بر مقایسه اسکرین شات بدست آورید. برای پیکربندی، build.gradle.kts ماژول خود را به روز کنید:
android {
...
testOptions {
...
screenshotTests {
imageDifferenceThreshold = 0.0001f // 0.01%
}
}
}
این آستانه برای تمام تست های اسکرین شات تعریف شده در ماژول اعمال خواهد شد.
- رفع اشکال: برخی از اشکالات Compose Renderer و پشتیبانی اضافه شده برای نوشتن خالی
- بهبود عملکرد: الگوریتم تفاوت تصویر بهروزرسانی شد تا سریعتر باشد