Questa pagina è stata tradotta dall'API Cloud Translation.

Test dello screenshot di anteprima di Scrivi

I test degli screenshot sono un modo efficace per verificare l'aspetto dell'interfaccia utente per gli utenti. Lo strumento di test degli screenshot di anteprima di Compose combina la semplicità e le funzionalità delle anteprime componibili con i vantaggi in termini di produttività dell'esecuzione di test degli screenshot lato host. Il test di screenshot di Anteprima composta è progettato per essere facile da usare quanto le anteprime componibili.

Un test di screenshot è un test automatico che acquisisce uno screenshot di un componente dell'interfaccia utente e lo confronta con un'immagine di riferimento approvata in precedenza. Se le immagini non corrispondono, il test non va a buon fine e viene generato un report HTML per aiutarti a confrontare e trovare le differenze.

Con lo strumento di test degli screenshot dell'anteprima di composizione, puoi:

Identifica un numero di anteprime composable esistenti o nuove che vuoi utilizzare per i test degli screenshot.
Genera immagini di riferimento da queste anteprime componibili.
Genera un report HTML che identifica le modifiche apportate a queste anteprime dopo aver apportato modifiche al codice.
Utilizza i parametri @Preview, ad esempio uiMode o fontScale, e le anteprime multiple per aiutarti a scalare i test.
Modulare i test con il nuovo set di origini screenshotTest.

Requisiti

Per utilizzare il test di screenshot dell'anteprima di composizione, devi disporre di quanto segue:

Android Gradle 8.5.0-beta01 o versioni successive.
Kotlin 1.9.20 o versioni successive.

Configura

Per attivare lo strumento:

Aggiungi il plug-in com.android.compose.screenshot, versione 0.0.1-alpha07 al progetto.

Aggiungi il plug-in al file dei cataloghi delle versioni:

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

Nel file build.gradle.kts a livello di modulo, aggiungi il plug-in nel blocco plugins {}:
```
plugins {
    ...
    alias(libs.plugins.screenshot)
}
```

Abilita la proprietà sperimentale nel file gradle.properties del progetto.
```
android.experimental.enableScreenshotTest=true
```
Nel blocco android {} del file build.gradle.kts a livello di modulo, attiva il flag sperimentale per utilizzare il set di origine screenshotTest e assicurati che kotlinCompilerExtensionVersion sia impostato su 1.5.4 o versioni successive.
Nota: se utilizzi Kotlin 2.0 o versioni successive, non devi impostare la versione del compilatore Compose separatamente. Scopri di più sul plug-in Gradle del compilatore Compose.
```
android {
    ...
    composeOptions {
        kotlinCompilerExtensionVersion = "1.5.4"
    }
    experimentalProperties["android.experimental.enableScreenshotTest"] = true
}
```

Assicurati di aver aggiunto la dipendenza ui-tooling.

Aggiungila ai cataloghi delle versioni:

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

Aggiungilo al file build.gradle.kts a livello di modulo:

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

Designare le anteprime componibili da utilizzare per i test degli screenshot

Per designare le anteprime composable che vuoi utilizzare per i test degli screenshot, inseriscile in un test class. Il file della classe di test deve trovarsi nel nuovo insieme di origini screenshotTest, ad esempio app/src/screenshotTest/kotlin/com/google/yourapp/ExamplePreviewScreenshots.kt ({module}/src/screenshotTest/{kotlin|java}/com/your/package).

Puoi aggiungere altri composabili e/o anteprime, incluse le anteprime multiple, in questo file o in altri file creati nello stesso set di origini.

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

Genera immagini di riferimento

Dopo aver configurato una classe di test, devi generare immagini di riferimento per ogni anteprima. Queste immagini di riferimento vengono utilizzate per identificare le modifiche in un secondo momento, dopo aver apportato le modifiche al codice. Per generare immagini di riferimento per i test di screenshot di anteprima composable, esegui il seguente task Gradle:

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

Al termine dell'attività, trova le immagini di riferimento in app/src/debug/screenshotTest/reference ({module}/src/{variant}/screenshotTest/reference).

Generare un report di test

Una volta che le immagini di riferimento sono presenti, esegui l'attività di convalida per acquisire un nuovo screenshot e confrontarlo con l'immagine di riferimento:

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

L'attività di verifica crea un report HTML all'indirizzo {module}/build/reports/screenshotTest/preview/{variant}/index.html.

Problemi noti

Puoi trovare l'elenco attuale dei problemi noti nel componente Issue Tracker dello strumento. Segnala eventuali altri feedback e problemi tramite il tracker dei problemi.

Aggiornamenti delle release

Note di rilascio e modifiche per le versioni correnti

0.0.1-alpha06

Questa release introduce:

Soglia di differenza di immagine: questa nuova impostazione della soglia globale ti consente di avere un controllo più preciso sui confronti degli screenshot. Per la configurazione, aggiorna il file build.gradle.kts del modulo:

android {
    ...
    testOptions {
        ...
        screenshotTests {
            imageDifferenceThreshold = 0.0001f // 0.01%
        }
    }
}

Questa soglia verrà applicata a tutti i test di screenshot definiti nel modulo.

Correzioni di bug: alcuni bug di Compose Renderer e supporto aggiunto per la composizione vuota
Miglioramenti delle prestazioni: l'algoritmo di confronto delle immagini è stato aggiornato per essere più veloce