Golden Test — bu nədir, snapshot-test necə işləyir və tətbiqi

Golden Test nədir və necə işləyir?

Golden Test — komponentin görünüşünün etalonla piksel-piksel müqayisəsi yolu ilə avtomatlaşdırılmış yoxlamadır. Proses: (1) tərtibatçı və ya testçi komponentin ilk şəklini çəkir — bu “golden” (etalon) olur. (2) Golden faylı testin yanında depozitariyada saxlanılır. (3) Növbəti icralarda test komponenti yenidən render edir və saxlanmış golden ilə müqayisə edir. (4) Şəkillər uyğun gəlirsə — test yaşıl olur. Fərqlənirsə — test diff ilə qırmızı olur. Qərar: ya dəyişikliklər gözlənilir (golden yenilənir), ya da bu səhvdir.

Golden necə yaradılır — kitabxana komponenti real ekran olmadan off-screen buferdə render edir (Android: Canvas, iOS: UIGraphicsImageRenderer). Bu o deməkdir ki, golden-testlər CI-da virtual displey olmadan işləyir, bu da icranı sürətləndirir. Paparazzi Android-də Layoutlib (Android Studio-nun Layout Editor ilə eyni mühərrik) istifadə edir. iOSSnapshotTestCase UIKit renderini CGImage-ə çevirir. Nəticə — sabit ölçülü PNG faylı.

Golden fayllarının ölçüsü və yaddaşın idarə edilməsi

Golden faylları — bir ekranın PNG şəkli (1080x1920) mürəkkəblikdən asılı olaraq 200-800 KB yer tutur. 500 golden-testi olan layihə üçün bu ~100-400 MB depozitariyadır. Həll yolları: (1) golden-i Git LFS-də saxlamaq. (2) PNG sıxılmasından istifadə (pngcrush, oxipng). (3) Golden-i ayrıca anbarda (S3) saxlamaq və qurarkən çəkmək. IT Sectr-də golden-i hər fayl üçün 1 MB həddi ilə Git LFS-də saxlayırıq — bu testlərin 90% üçün kifayətdir.

Flaky golden testlər və onların həlli

Flaky golden testlər — golden-testlərin əsas problemi. Müxtəlif GPU, şrift versiyaları və anti-aliasing piksellərdə mikro-fərqlər verir. Həll yolları: threshold (fərqli piksellərin icazə verilən faizi), fuzzy comparison (bulanık müqayisə) və eyni CI agentlərində işə salmaq (eyni GPU, OS, emulator versiyası). Paparazzi-də pixel-perfect müqayisə istifadə olunur, ona görə də CI agentləri eyni olmalıdır.

Golden Test vs Screenshot Test: fərq nədir?

Golden Test — sabit etalon ilə screenshot-testin bir növüdür. “Golden” termini etalonun komanda tərəfindən təsdiqləndiyini və depozitariyada saxlandığını bildirir. Şəklin hər hansı dəyişməsi tərtibatçının şüurlu qərarını tələb edir: golden-i yeniləmək və ya kodu düzəltmək. Golden Test ayrı-ayrı komponentlər səviyyəsində işləyir (Composable, UIView) və real cihaz tələb etmir.

Screenshot Test — daha geniş anlayış. Screenshot-test real məlumatlar, naviqasiya, sistem status çubuğu və animasiyalarla bütün ekranı çəkə bilər. Screenshot-testlər çox vaxt real cihazlarda və ya emulatorlarda UI Automator (Android) və ya XCUITest (iOS) vasitəsilə işə salınır. Golden-testlər emulatorsız unit-test mühitində (JVM, XCTest) işləyir və yalnız tək komponenti çəkir.

Əhatə strategiyası: golden vs screenshot

Golden vs Screenshot — hər commit-də ayrı-ayrı UI komponentlərini (düymə, kart, dialoq) yoxlamaq üçün golden-testlər. Screenshot-testlər — buraxılışdan əvvəl bütün ekranların E2E yoxlanması üçün. Golden-testlər tərtibatçıya sürətli geribildirim verir, screenshot-testlər — bütün tətbiqin bütövlüyünə inam. IT Sectr-də Pull Request üçün golden-testlərdən (3-5 dəqiqə), nightly üçün isə screenshot-testlərdən (30-60 dəqiqə) istifadə edirik.

Paparazzi və Roborazzi: Android-də snapshot-test

Paparazzi — Cash App (Square) kitabxanası olub, Android View və Jetpack Compose komponentlərini emulatorsız PNG-ə render edir. Layoutlib (Android Studio Preview ilə eyni mühərrik) istifadə edir. Quraşdırma: Gradle plaqini qoşmaq, @Test və @RunWith(PaparazziRule::class) ilə test yazmaq, paparazzi.snapshot(view) çağırmaq. Paparazzi animasiyaları, videonu və Real Device-i dəstəkləmir — yalnız statik render.

// build.gradle.kts (module)
plugins {
    id("app.cash.paparazzi") version "1.3.1"
}

// Compose komponenti üçün Golden test
class ButtonGoldenTest {

    @get:Rule
    val paparazzi = Paparazzi(
        Paparazzi.PaparazziSnapshotConfig(
            deviceConfig = DeviceConfig.PIXEL_6,
            theme = "android:Theme.Material.Light.NoActionBar"
        )
    )

    @Test
    fun primary_button() {
        paparazzi.snapshot {
            Button(
                onClick = { },
                modifier = Modifier.width(200.dp)
            ) {
                Text("Submit")
            }
        }
    }
}

Roborazzi — Compose, View və şəkil müqayisəsini dəstəkləyən Paparazzi alternativi. Fərq: Roborazzi Robolectric vasitəsilə işləyir və threshold (icazə verilən piksel fərqi faizi) dəstəkləyir. Bu, CI-da müxtəlif GPU-larla flakiness-i azaldır. Roborazzi həmçinin dəyişikliklərin GIF animasiyasını (əvvəl/sonra/diff) yarada bilir, bu kod baxışı üçün əlverişlidir. Golden fayllarının formatı: PNG + JSON metadatası.

Golden yeniləmə — UI-nin məqsədli dəyişikliyindən sonra tərtibatçı köhnə golden fayllarını silir və testləri record flag ilə işə salır. Paparazzi bütün golden fayllarını yenidən yaradır. Sonra tərtibatçı kodu ilə birlikdə yeni golden-i commit edir. Kod baxışında rəyçi köhnə və yeni golden-lərin diff-ni görür. Dəyişikliklər təsdiqlənərsə — PR birləşdirilir. Yoxsa — tərtibatçı kodu düzəldir və testləri yenidən işə salır. Heç vaxt golden-i CI-da avtomatik yeniləməyin — yalnız lokalda.

iOS-da SwiftSnapshotTesting və iOSSnapshotTestCase

SwiftSnapshotTesting — pointfree.co kitabxanası, Composable Architecture yaradıcıları. UIView, UIViewController, CALayer və SwiftUI View dəstəkləyir. Prinsip: assertSnapshot(matching: view, as: .image). İlk işə salmada golden avtomatik yaradılır. Sonrakılarda — müqayisə edilir. Fərq icazə veriləni aşarsa — test uğursuz olur. SwiftSnapshotTesting CI ilə uyğun olan UIGraphicsImageRenderer vasitəsilə işləyir (Xcode Cloud, GitHub Actions).

import SnapshotTesting
import XCTest

final class ProfileCardSnapshotTests: XCTestCase {

    func test_profile_card_default() {
        let card = ProfileCard(
            name: "Alice",
            avatar: UIImage.testImage(),
            badge: "Pro"
        )
        let controller = UIHostingController(rootView: card)

        assertSnapshot(
            matching: controller,
            as: .image(on: .iPhoneSe),
            record: ProcessInfo.processInfo
                .environment["RECORD"] != nil
        )
    }
}

iOSSnapshotTestCase (keçmiş FBSnapshotTestCase) — Uber-dən UIKit üçün kitabxana. SwiftSnapshotTesting-dən fərqli olaraq, iOSSnapshotTestCase ekran ölçüsü və oriyentasiyanın təyin edilməsini tələb edir. Golden fayllar — ReferenceImages qovluğunda PNG. Üstünlük: SwiftUI olmadan UIKit ilə işləyir və iOS 12+ dəstəkləyir. Çatışmazlıq: golden-i avtomatik yeniləmir — record flag ilə işə salmaq lazımdır. SwiftSnapshotTesting daha müasirdir və yeni layihələr üçün tövsiyə olunur.

Cihaza özəl golden — golden faylları müxtəlif ekran ölçüləri və oriyentasiyalar üçün fərqlənir. Standart yanaşma: golden-i TestName@3x~iPhone14.png olaraq adlandırmaq. SwiftSnapshotTesting .image(on: .iPhoneSe) parametri verildikdə avtomatik cihaz suffiksi əlavə edir. Android-də Paparazzi ölçü təyini üçün DeviceConfig istifadə edir. Hər dəstəklənən cihaz form faktoru üçün golden-i ayrı saxlayın. Müxtəlif ölçülər üçün bir golden istifadə etməyin — bu flaky testlərə gətirib çıxarır.

CI-da golden-fayllarla iş və yeniləmələrin idarə edilməsi

CI pipeline — golden-testlər hər Pull Request-də işə salınmalıdır. Test uğursuz olarsa, CI diff şəklini qurma artefaktı kimi göstərir. Tərtibatçı diff-ə baxır və qərar verir. Əhəmiyyətli: CI-da yaradılmış golden faylları heç vaxt avtomatik commit edilmir. Yalnız tərtibatçı tərəfindən məqsədli dəyişiklikdən sonra lokal yaradılma. GitHub Actions və GitLab CI brauzerdə diff-ə baxmaq üçün artefaktların (png, html) yüklənməsini dəstəkləyir.

Depozitariyanın ölçüsü — golden faylları sürətlə böyüyür. 500 test = 100-400 MB PNG. Həll yolları: (1) Git LFS — hər golden LFS-də saxlanılır, yalnız checkout-da klonlanır. (2) Golden-i ayrı depozitariyada saxlamaq və altmodul kimi qoşmaq. (3) S3 + keşləmə — golden S3-də, CI yalnız yoxlama məbləği ilə dəyişdirilmiş faylları yükləyir. IT Sectr-də track *.png filter=lfs diff=lfs merge=lfs text=false ilə Git LFS istifadə edirik. Lokalda golden-lər src/test/goldens/ qovluğunda yerləşir.

Golden-ə kod baxışı — adi git diff PNG dəyişikliklərini göstərmir. Həll yolları: (1) GitHub PNG şəkillərini klikdə açır. (2) Golden-diff-in brauzerdə göründüyü Review Apps-dən istifadə. (3) Əvvəl/sonra/diff sütunları ilə HTML hesabatı yaratmaq. Paparazzi üç sütunlu HTML hesabatı yaradır: actual, expected, diff. Hesabat CI artefaktlarına əlavə olunur. Rəyçilər faylları lokalda endirmədən hesabata baxırlar.

Golden nə vaxt yenilənməlidir — yalnız UI-nin şüurlu dəyişikliyindən sonra. Şrift, rəng, boşluq, işarənin dəyişməsi — golden yenilənməlidir. Yeni düymənin əlavə edilməsi, elementlərin yerdəyişməsi — golden yenilənməlidir. Görünüşü dəyişən səhv düzəlişi — golden yenilənməlidir. UI dəyişmədən refaktorinq — golden yenilənməməlidir. Golden UI kodu dəyişmədən dəyişirsə — bu mühit səbəbindən flaky testdir, səbəbi CI agentlərində və ya asılılıq versiyalarında axtarın.