Telefonica · pmartinbTEF · Aug 28, 2023 · Sep 1, 2023 · Sep 4, 2023 · Sep 4, 2023
diff --git a/.github/workflows/compare_screenshots.yml b/.github/workflows/compare_screenshots.yml
@@ -0,0 +1,114 @@
+name: Compare Screenshots
+
+on:
+  workflow_dispatch:
+  pull_request:
+
+jobs:
+  CompareScreenshots:
+
+    runs-on: ubuntu-latest
+
+    steps:
+      - name: Checkout repo
+        uses: actions/checkout@v3
+
+      - name: Verify Screenshots (roborazzi)
+        run: 'bash ./gradlew verifyRoborazziDebug'
+
+      - id: generate-html
+        name: Generate Html Report
+        if: failure()
+        env:
+          BRANCH_NAME: companion_${{ github.event.workflow_run.head_branch }}
+        shell: bash
+        run: |
+          mkdir reports
+          touch reports/report.html
+          cp */screenshots/*_compare.png reports/
+          files=$(find . -type f -name "*_compare.png" | grep "reports/")
+          {
+            echo '<!doctype html>'
+            echo '<html>'
+              echo '<head>'
+                echo '<title>Screenshots failure report</title>'
+                echo '<link href="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.100.2/css/materialize.min.css" rel="stylesheet">'
+                echo '<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">'
+                echo '<meta charset="UTF-8">'
+              echo '</head>'
+              echo '<style>'
+              echo 'body {'
+                echo 'display: flex;'
+                echo 'min-height: 100vh;'
+                echo 'flex-direction: column;'
+              echo '}'
+              echo 'main {'
+                echo 'flex: 1 0 auto;'
+              echo '}'
+              echo '</style>'
+            echo '<body>'
+            echo '<nav>'
+              echo '<div class="nav-wrapper indigo darken-3">'
+                echo '<a href="#" class="brand-logo left">Screenshots failure report</a>'
+                echo '<ul id="nav-mobile" class="right hide-on-med-and-down">'
+                  echo '<li><a href="https://github.com/takahirom/roborazzi">Roborazzi</a></li>'
+                echo '</ul>'
+              echo '</div>'
+            echo '</nav>'
+            echo '<main class="container">'
+              echo '<div class="section">'
+              echo '<table class="highlight responsive-table">'
+                echo '<tr><th>File name</th><th>Comparison</th></tr>'
+          } >> reports/report.html
+
+                for file in $files; do
+                  # Get the file name and insert newlines every 100 characters
+                  fileName=$(basename "$file" | sed -r 's/(.{100})/\1<br>/g')
+                  echo "<tr><td>$(basename "$file")</td>" >> reports/report.html
+                  echo "<td><a href=\"$(basename "$file")\"><img src=\"$(basename "$file")\" width=\"100%\" height=\"100%\" /></a></td></tr>" >> reports/report.html
+                done
+          {
+                echo '</table>'
+              echo '</div>'
+            echo '</main>'
+            echo '<footer class="page-footer indigo darken-3">'
+              echo '<div></div>'
+            echo '</footer>'
+            echo '<script src="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.100.2/js/materialize.min.js"></script>'
+            echo '</body></html>'
+          } >> reports/report.html
+
+          echo "Report: "
+          cat reports/report.html
+
+      - name: Generate screenshots tests reports tar.gz
+        if: failure()
+        run: |
+          tar cvzf mistica-screenshots-tests-report.tar.gz reports || echo "No screenshots tests reports found"
+        shell: bash
+
+      - name: Checkout Telefonica/github-actions repo
+        if: failure()
+        uses: actions/checkout@v3
+        with:
+          repository: Telefonica/github-actions
+          token: "${{ secrets.NOVUM_PRIVATE_REPOS }}"
+          path: .github/shared-actions
+
+      - name: Upload reports to azure
+        if: failure()
+        uses: ./.github/shared-actions/azure/upload-to-storage
+        with:
+          azure-account-name: ${{secrets.AZURE_ACCOUNT_NAME}}
+          azure-account-key: ${{secrets.AZURE_ACCOUNT_KEY}}
+          globs: |
+            mistica-screenshots-tests-report.tar.gz
+          generate-summary: true
+
+      - name: Upload reports to github
+        uses: actions/upload-artifact@v3
+        if: failure()
+        with:
+          name: failure-report
+          path: 'reports/*'
+          retention-days: 14
diff --git a/.github/workflows/update_screenshot_baseline.yml b/.github/workflows/update_screenshot_baseline.yml
@@ -0,0 +1,24 @@
+name: "Update screenshot baseline"
+on:
+  workflow_dispatch:
+
+jobs:
+  screenshots_baseline:
+    runs-on: ubuntu-latest
+    steps:
+      - name: Checkout repo
+        uses: actions/checkout@v2
+
+      - name: Run Roborazzi Record
+        run: 'bash ./gradlew clean recordRoborazziDebug'
+
+      - name: Check Git status
+        run: 'git status'
+        shell: bash
+
+      - name: Commit and push screenshots baseline
+        id: commitAndPushScreenshotsBaseline
+        uses: EndBug/add-and-commit@v7
+        with:
+          message: 'Updated screenshots baseline'
+          add: './**/screenshots/*'
diff --git a/build.gradle b/build.gradle
@@ -27,6 +27,7 @@ buildscript {
 plugins {
     id 'org.jetbrains.kotlin.android' version '1.5.21' apply false
     id 'io.github.gradle-nexus.publish-plugin' version '1.1.0' apply false
+    id "io.github.takahirom.roborazzi" version "1.4.0" apply false
 }
 
 allprojects {

diff --git a/gradle/wrapper/gradle-wrapper.properties b/gradle/wrapper/gradle-wrapper.properties
@@ -1,6 +1,6 @@
 #Fri May 19 13:07:06 CEST 2023
 distributionBase=GRADLE_USER_HOME
 distributionPath=wrapper/dists
-distributionUrl=https\://services.gradle.org/distributions/gradle-7.5-bin.zip
+distributionUrl=https\://services.gradle.org/distributions/gradle-7.6.2-bin.zip
 zipStoreBase=GRADLE_USER_HOME
 zipStorePath=wrapper/dists
diff --git a/library/build.gradle b/library/build.gradle
@@ -3,6 +3,7 @@ plugins {
     id 'org.jetbrains.kotlin.android'
     id 'kotlin-kapt'
     id 'maven-publish'
+    id 'io.github.takahirom.roborazzi'
 }
 
 android {
@@ -51,6 +52,15 @@ android {
         sarifReport true
         checkDependencies true
     }
+
+    testOptions {
+        unitTests {
+            includeAndroidResources = true
+            all {
+                systemProperty 'robolectric.graphicsMode', 'NATIVE'
+            }
+        }
+    }
 }
 
 task sourceJar(type: Jar) {
@@ -88,6 +98,10 @@ dependencies {
 
     testImplementation 'junit:junit:4.13.2'
     testImplementation "androidx.compose.ui:ui-test-junit4:$compose_ui_version"
+    testImplementation 'androidx.compose.ui:ui-test-manifest:1.0.5'
+    testImplementation 'org.robolectric:robolectric:4.10.3'
+    testImplementation 'io.github.takahirom.roborazzi:roborazzi:1.4.0'
+    testImplementation 'io.github.takahirom.roborazzi:roborazzi-compose:1.4.0'
     testImplementation "org.mockito.kotlin:mockito-kotlin:4.0.0"
 
     debugImplementation "androidx.compose.ui:ui-tooling:$compose_ui_version"

diff --git a/library/screenshots/check_the_button_screenshot_BlauBrand.png b/library/screenshots/check_the_button_screenshot_BlauBrand.png
diff --git a/library/screenshots/check_the_button_screenshot_MovistarBrand.png b/library/screenshots/check_the_button_screenshot_MovistarBrand.png
diff --git a/library/screenshots/check_the_button_screenshot_O2Brand.png b/library/screenshots/check_the_button_screenshot_O2Brand.png
diff --git a/library/screenshots/check_the_button_screenshot_TelefonicaBrand.png b/library/screenshots/check_the_button_screenshot_TelefonicaBrand.png
diff --git a/library/screenshots/check_the_button_screenshot_VivoBrand.png b/library/screenshots/check_the_button_screenshot_VivoBrand.png
diff --git a/library/screenshots/check_the_password_is_initially_not_visible.png b/library/screenshots/check_the_password_is_initially_not_visible.png
diff --git a/...heck_the_password_is_not_visible_after_toggling_twice_the_visibility_button.png b/...heck_the_password_is_not_visible_after_toggling_twice_the_visibility_button.png
diff --git a/...nshots/check_the_password_is_visible_after_the_visibility_button_is_clicked.png b/...nshots/check_the_password_is_visible_after_the_visibility_button_is_clicked.png
diff --git a/library/src/main/java/com/telefonica/mistica/compose/button/Button.kt b/library/src/main/java/com/telefonica/mistica/compose/button/Button.kt
@@ -39,6 +39,7 @@ import androidx.compose.ui.platform.LocalDensity
 import androidx.compose.ui.res.dimensionResource
 import androidx.compose.ui.res.painterResource
 import androidx.compose.ui.text.style.TextOverflow
+import androidx.compose.ui.text.toUpperCase
 import androidx.compose.ui.tooling.preview.Preview
 import androidx.compose.ui.tooling.preview.PreviewParameter
 import androidx.compose.ui.tooling.preview.PreviewParameterProvider
@@ -175,7 +176,7 @@ private fun ButtonContent(
                             it.size.height.toDp()
                         }
                     },
-                text = text,
+                text = text.toUpperCase(),
                 color = textColor,
                 style = size.textStyle,
                 maxLines = 1,

diff --git a/library/src/test/java/com/telefonica/mistica/compose/button/ButtonKtTest.kt b/library/src/test/java/com/telefonica/mistica/compose/button/ButtonKtTest.kt
@@ -0,0 +1,154 @@
+package com.telefonica.mistica.compose.button
+
+import androidx.compose.foundation.layout.padding
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.test.junit4.createComposeRule
+import androidx.compose.ui.test.onNodeWithText
+import androidx.compose.ui.test.onRoot
+import androidx.compose.ui.test.performClick
+import androidx.compose.ui.unit.dp
+import com.github.takahirom.roborazzi.RobolectricDeviceQualifiers
+import com.github.takahirom.roborazzi.captureRoboImage
+import com.telefonica.mistica.compose.theme.MisticaTheme
+import com.telefonica.mistica.compose.theme.brand.BlauBrand
+import com.telefonica.mistica.compose.theme.brand.Brand
+import com.telefonica.mistica.compose.theme.brand.MovistarBrand
+import com.telefonica.mistica.compose.theme.brand.O2Brand
+import com.telefonica.mistica.compose.theme.brand.TelefonicaBrand
+import com.telefonica.mistica.compose.theme.brand.VivoBrand
+import com.telefonica.mistica.testutils.ScreenshotUtils
+import org.junit.Assert.assertTrue
+import org.junit.Rule
+import org.junit.Test
+import org.junit.experimental.runners.Enclosed
+import org.junit.runner.RunWith
+import org.robolectric.ParameterizedRobolectricTestRunner
+import org.robolectric.RobolectricTestRunner
+import org.robolectric.annotation.Config
+
+@RunWith(Enclosed::class)
+internal class ButtonKtTest {
+
+    @RunWith(ParameterizedRobolectricTestRunner::class)
+    @Config(qualifiers = RobolectricDeviceQualifiers.Pixel5)
+    internal class ButtonKtTestParametrized(private val brand: Brand) {
+        @get:Rule
+        val composeTestRule = createComposeRule()
+
+        @Test
+        fun `check the button screenshot`() = test {
+            `when Button`(brand)
+
+            `then screenshot is OK`(brand)
+        }
+
+        @Test
+        fun `check the button is clicked`() = test {
+            `given Button`()
+
+            `when the button is clicked`()
+
+            `then the onClickListener has been invoked`()
+        }
+
+        private fun TestScope.`given Button`() {
+            `when Button`()
+        }
+
+        private fun TestScope.`when Button`(brand: Brand = MovistarBrand) {
+            composeTestRule.setContent {
+                MisticaTheme(brand = brand) {
+                    Button(
+                        text = textValue,
+                        onClickListener = onClickListener,
+                        modifier = Modifier.padding(16.dp)
+                    )
+                }
+            }
+        }
+
+        private fun TestScope.`when the button is clicked`() {
+            composeTestRule.onNodeWithText(textValue).performClick()
+        }
+
+        private fun `then screenshot is OK`(brand: Brand) {
+            composeTestRule.onRoot()
+                .captureRoboImage(ScreenshotUtils.getScreenshotName(brand))
+        }
+
+        private fun TestScope.`then the onClickListener has been invoked`() {
+            assertTrue(clicked)
+        }
+
+        private fun test(block: TestScope.() -> Unit) {
+            TestScope().block()
+        }
+
+        private class TestScope {
+            val textValue = "TEXTVALUE"
+            var clicked = false
+            val onClickListener: () -> Unit = { clicked = true }
+        }
+
+        companion object {
+            @JvmStatic
+            @ParameterizedRobolectricTestRunner.Parameters(name = "Input: {0}")
+            fun brands() = listOf(
+                arrayOf(MovistarBrand),
+                arrayOf(VivoBrand),
+                arrayOf(O2Brand),
+                arrayOf(BlauBrand),
+                arrayOf(TelefonicaBrand),
+            )
+        }
+    }
+
+    @RunWith(RobolectricTestRunner::class)
+    internal class ButtonKtTestNotParametrized {
+        @get:Rule
+        val composeTestRule = createComposeRule()
+
+        @Test
+        fun `check the button is clicked`() = test {
+            `given Button`()
+
+            `when the button is clicked`()
+
+            `then the onClickListener has been invoked`()
+        }
+
+        private fun TestScope.`given Button`() {
+            `when Button`()
+        }
+
+        private fun TestScope.`when Button`() {
+            composeTestRule.setContent {
+                MisticaTheme(brand = MovistarBrand) {
+                    Button(
+                        text = textValue,
+                        onClickListener = onClickListener,
+                        modifier = Modifier.padding(16.dp)
+                    )
+                }
+            }
+        }
+
+        private fun TestScope.`when the button is clicked`() {
+            composeTestRule.onNodeWithText(textValue).performClick()
+        }
+
+        private fun TestScope.`then the onClickListener has been invoked`() {
+            assertTrue(clicked)
+        }
+
+        private fun test(block: TestScope.() -> Unit) {
+            TestScope().block()
+        }
+
+        private class TestScope {
+            val textValue = "TEXTVALUE"
+            var clicked = false
+            val onClickListener: () -> Unit = { clicked = true }
+        }
+    }
+}