Önizleme Ekran Görüntüsü Testi Oluşturma

Ekran görüntüsü testi, kullanıcı arayüzünüzün kullanıcılar tarafından nasıl göründüğünü doğrulamanın etkili bir yoludur. İlgili içeriği oluşturmak için kullanılan Oluşturma Önizleme Ekran Görüntüsü Testi aracı, composable önizlemeler verimlilik artışı elde edeceği anlamına gelir. Önizleme Oluştur Ekran Görüntüsü Testi, composable önizlemeler kadar kolay kullanılacak şekilde tasarlanmıştır.

Ekran görüntüsü testi, bir kullanıcı arayüzü parçasının ekran görüntüsünü alan otomatik bir testtir ve bunu önceden onaylanmış bir referans resimle karşılaştırır. Öğe resimler eşleşmez, test başarısız olur ve size yardımcı olacak bir HTML raporu üretir ve farklılıkları belirlemenize yardımcı olur.

Oluşturma Önizleme Ekran Görüntüsü Testi aracını kullanarak şunları yapabilirsiniz:

• Kullanmak istediğiniz mevcut veya yeni composable önizlemeleri tanımlayın ekran görüntüsü testleri.
• Bu composable önizlemelerden referans resimler oluşturmak
• Aşağıdaki önizlemeleri etkinleştirdikten sonra, bu önizlemelerde yapılan değişiklikleri tanımlayan bir HTML raporu Kod değişiklikleri yapabilirsiniz.
• uiMode veya fontScale gibi @Preview parametrelerini ve çoklu önizlemeleri kullanın kullanabilirsiniz.
• Yeni screenshotTest kaynağı grubuyla testlerinizi modülerleştirin.

Gereksinimler

Oluşturma Önizleme Ekran Görüntüsü Testi'ni kullanmak için aşağıdakilere ihtiyacınız vardır:

• Android Gradle 8.5.0-beta01 veya sonraki sürümler.
• Kotlin 1.9.20 veya sonraki sürümler.

Kurulum

Aracı etkinleştirmek için aşağıdaki adımları uygulayın:

1. com.android.compose.screenshot eklentisi sürümünü ekleyin projenize 0.0.1-alpha01 ekleyin.
1. Eklentiyi sürüm katalogları dosyanıza ekleyin:

   [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. Modül düzeyindeki build.gradle.kts dosyanıza, eklentiyi plugins {} blok:

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

2. Projenizin gradle.properties dosyası yükleyin.

   android.experimental.enableScreenshotTest=true
   

3. Modül seviyenizin android {} bloğunda build.gradle.kts dosyası varsa, screenshotTest kaynağının ayarlandığından ve kotlinCompilerExtensionVersion, 1.5.4 veya sonraki bir sürüme ayarlanmış.

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

4. URL'nin sonuna ui-tooling desteklenmektedir.
   1. Sürümü kataloglarınıza ekleyin:

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

   2. Kodu modül düzeyindeki build.gradle.kts dosyanıza ekleyin:

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

Ekran görüntüsü testleri için kullanılacak composable önizlemeler belirleme

Ekran görüntüsü testleri için kullanmak istediğiniz composable önizlemeleri tanımlamak için önizlemeleri görebilirsiniz. Test sınıfı dosyası yeni screenshotTest kaynak grubu, örneğin app/src/screenshotTest/kotlin/com/google/yourapp/ExamplePreviewScreenshots.kt ({module}/src/screenshotTest/{kotlin|java}/com/your/package).

Çoklu önizlemeler de dahil olmak üzere daha fazla composable ve/veya önizleme ekleyebilirsiniz. bu dosyayı veya aynı kaynak kümesinde oluşturulmuş diğer dosyaları.

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!")
        }
    }
}

Referans resimleri oluşturma

Test sınıfı oluşturduktan sonra her bir sınıf için referans görüntüler oluşturmanız gerekir. önizle. Bu referans görüntüler, sizden daha sonra değişiklikleri tanımlamak için kullanılır. Kod değişiklikleri yapabilirsiniz. composable önizlemeniz için referans görüntüler oluşturmak amacıyla ekran görüntüsü test etmek için aşağıdaki Gradle görevini çalıştırın:

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

Görev tamamlandıktan sonra referans resimleri app/src/debug/screenshotTest/reference. ({module}/src/{variant}/screenshotTest/reference).

Test raporu oluşturma

Referans görüntüler oluşturulduktan sonra yeni ekran görüntüsü almak için doğrulama görevini çalıştırın ve bunu referans resimle karşılaştırın:

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

Doğrulama görevi, şu adreste bir HTML raporu oluşturur: {module}/build/reports/screenshotTest/preview/{variant}/index.html

Bilinen sorunlar

Bilinen sorunların güncel listesini aracın Sorun İzleyici bileşeni. Diğer geri bildirimleri ve sorunları bildirin sorun izleyici ile takip edebilirsiniz.