Diese Seite wurde von der Cloud Translation API übersetzt.

Test zum Erstellen eines Screenshots mit der Vorschau
Mit Sammlungen den Überblick behalten Sie können Inhalte basierend auf Ihren Einstellungen speichern und kategorisieren.

Screenshot-Tests sind eine effektive Möglichkeit, zu prüfen, wie Ihre Benutzeroberfläche für Nutzer aussieht. Das Tool zum Erstellen von Vorschau-Screenshot-Tests kombiniert die Einfachheit und Funktionen von kombinierbaren Vorschauen mit den Produktivitätsvorteilen von hostseitigen Screenshot-Tests. Die Funktion „Vorschau erstellen“ für Screenshot-Tests ist genauso einfach zu verwenden wie die Funktion „Vorschau erstellen“.

Ein Screenshot-Test ist ein automatisierter Test, bei dem ein Screenshot einer Benutzeroberfläche erstellt und dann mit einem zuvor genehmigten Referenzbild verglichen wird. Wenn die Bilder nicht übereinstimmen, schlägt der Test fehl und es wird ein HTML-Bericht erstellt, mit dem Sie die Unterschiede vergleichen und finden können.

Mit dem Tool zum Testen von Screenshots in der Vorschau von Compose haben Sie folgende Möglichkeiten:

Mit @PreviewTest können Sie Screenshot-Tests für vorhandene oder neue Vorschauelemente erstellen.
Erstellen Sie Referenzbilder aus diesen zusammensetzbaren Vorschaubildern.
Erstellen Sie einen HTML-Bericht, in dem Änderungen an diesen Vorschauen nach Codeänderungen aufgeführt werden.
Verwenden Sie @Preview-Parameter wie uiMode oder fontScale und mehrere Vorschauen, um Ihre Tests zu skalieren.
Mit dem neuen screenshotTest-Quellsatz können Sie Ihre Tests modularisieren.

**Abbildung 1.** Beispiel für einen HTML-Bericht

Voraussetzungen

Für den Screenshot-Test in der Compose-Vorschau benötigen Sie Folgendes:

Android Gradle-Plug-in 8.5.0-beta01 oder höher
Kotlin 1.9.20 oder höher Wir empfehlen Kotlin 2.0 oder höher, damit Sie das Gradle-Plug-in für den Compose-Compiler verwenden können.
„Compose“ ist für Ihr Projekt aktiviert. Wir empfehlen, Compose mit dem Compose Compiler Gradle-Plug-in zu aktivieren.

Hinweis: Wenn Sie das Compose Compiler Gradle-Plug-in nicht verwenden können, können Sie Compose aktivieren, indem Sie direkt eine Abhängigkeit vom Compose Compiler deklarieren. Verwenden Sie kotlinCompilerExtensionVersion Version 1.5.4 oder höher.

Einrichten

So aktivieren Sie das Tool:

Fügen Sie Ihrem Projekt das com.android.compose.screenshot-Plug-in, Version 0.0.1-alpha10, hinzu.

Fügen Sie das Plug-in der Datei „version_catalogs“ hinzu:

[versions]
agp = "8.11.0-alpha06"
kotlin = "2.1.20"
screenshot = "0.0.1-alpha10"

[plugins]
screenshot = { id = "com.android.compose.screenshot", version.ref = "screenshot"}

Fügen Sie das Plug-in in der Datei build.gradle.kts auf Modulebene in den Block plugins {} ein:
```
plugins {
    alias(libs.plugins.screenshot)
}
```

Aktivieren Sie das experimentelle Attribut in der gradle.properties-Datei Ihres Projekts.
```
android.experimental.enableScreenshotTest=true
```
Aktivieren Sie im Block android {} der build.gradle.kts-Datei auf Modulebene das Flag „experimental“, um das screenshotTest-Quellset zu verwenden.
```
android {
    experimentalProperties["android.experimental.enableScreenshotTest"] = true
}
```

Fügen Sie die Abhängigkeiten screenshot-validation-api und ui-tooling hinzu.

Fügen Sie sie Ihren Versionskatalogen hinzu:

[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"}

Fügen Sie sie der Datei build.gradle.kts auf Modulebene hinzu:

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

Zusammensetzbare Vorschauelemente für Screenshot-Tests festlegen

Wenn Sie die zusammensetzbaren Vorschauelemente festlegen möchten, die für Screenshot-Tests verwendet werden sollen, kennzeichnen Sie sie mit der Anmerkung @PreviewTest. Die Vorschaubilder müssen sich im neuen screenshotTest-Quellsatz befinden, z. B. app/src/screenshotTest/kotlin/com/example/yourapp/ExamplePreviewScreenshotTest.kt.

Sie können dieser Datei oder anderen Dateien, die im selben Quellsatz erstellt wurden, weitere Elemente und/oder Vorschauen hinzufügen, einschließlich mehrerer Vorschauen.

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

Referenzbilder generieren

Nachdem Sie eine Testklasse eingerichtet haben, müssen Sie für jede Vorschau Referenzbilder generieren. Anhand dieser Referenzbilder können Sie später Änderungen erkennen, nachdem Sie Codeänderungen vorgenommen haben. Führen Sie zum Generieren von Referenzbildern für Ihre zusammensetzbaren Vorschau-Screenshot-Tests die folgende Gradle-Aufgabe aus:

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

Nach Abschluss der Aufgabe finden Sie die Referenzbilder unter app/src/screenshotTestDebug/reference ({module}/src/screenshotTest{Variant}/reference).

Testbericht erstellen

Sobald die Referenzbilder vorhanden sind, führen Sie die Validierungsaufgabe aus, um einen neuen Screenshot aufzunehmen und mit dem Referenzbild zu vergleichen:

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

Durch die Überprüfungsaufgabe wird ein HTML-Bericht unter {module}/build/reports/screenshotTest/preview/{variant}/index.html erstellt.

Bekannte Probleme

Eine aktuelle Liste der bekannten Probleme finden Sie in der Problem-Tracker-Komponente des Tools. Anderes Feedback und Probleme können Sie über den Issue Tracker melden.

Versionsupdates

Versionshinweise und Änderungen für aktuelle Versionen.

0.0.1-alpha10

Diese Version enthält folgende Neuerungen:

Ab dieser Version müssen Sie alle Ihre Vorabversionsfunktionen mit der Anmerkung @PreviewTest kennzeichnen. Vorschauen ohne Anmerkung werden nicht ausgeführt.
Das Verzeichnis mit den Referenzbildern wurde von {module}/src/{variant}/screenshotTest/reference in {module}/src/screenshotTest{Variant}/reference geändert. So wird sichergestellt, dass die generierten Referenzbilder nicht Teil des Produktionscodes sind und der Verzeichnisstruktur anderer Testtypen entsprechen.
Die Aufgabe {variant}PreviewScreenshotRender wird entfernt. Das Bild-Rendering wird in die JUnit-Test-Engine migriert.
Bei der Aufgabe update{Variant}ScreenshotTest werden neue Renderingbilder vor der Aktualisierung mit Referenzbildern verglichen. Es werden nur Bilder aktualisiert, bei denen die Unterschiede über einem bestimmten Grenzwert liegen. Das --updateFilter-Befehlszeilenflag wurde entfernt.

0.0.1-alpha06