# screenshot-testing Published articles for screenshot-testing. This is one page of public article previews, not the complete archive. Follow Next page to continue. Summaries are not the original full articles. ## Android Studio Rabbit 1 Canary 3 now available DevFeed: [Android Studio Rabbit 1 Canary 3 now available]() Original publisher: [Read original article]() Author: Android Studio Releaser (noreply@blogger.com) Published: 2026-08-27T13:26:09Z Content type: release Language: en Sources: [Android Studio Release Updates]() Topics: [Android Studio](), [Release notes](), [Android Gradle Plugin](), [bug](), [Compose](), [screenshot-testing]() Tags: [android](), [android-gradle-plugin](), [android-studio](), [bug](), [compose](), [preview](), [release-notes](), [screenshot-testing](), [testing]() ### AI overview Android Studio Rabbit 1 Canary 3 is available in the Canary channel. The release includes general fixes for Android Studio Rabbit 1 and Android Gradle Plugin 9.5.0-alpha03, along with fixes for reported issues across several development tools and features. ### Source excerpt Android Studio Rabbit 1 Canary 3 is now available in the Canary channel. If you already have an Android Studio build on the Canary channel, you can get the update by clicking Help > Check for Updates (or Android Studio > Check for Updates on macOS). Otherwise, you can download it here. For information on new features and changes in Android Studio Rabbit 1, see the Android Studio Preview release notes. For details of bugs fixed in each previous release of Android Studio Rabbit 1, see closed issues. General fixes and features Below is a list of general fixes in Android Studio Rabbit 1 Canary 3 and Android Gradle Plugin 9.5.0-alpha03. These are a result of your bug reports, which help us to make Android Studio better. If you encounter a problem, let us know by reporting a bug. You can also vote for an existing issue to indicate that it also affects you. Fixed Issues Android Gradle Plugin Issue #550220873 AGP 9.2.0 regression: `LibraryExtension.getSourceSets()` is typed on an interface the source-set implementation no longer implements, causing ClassCastException Issue #548314106 CommonExtension.resourcePrefix has incomplete docs Compose Preview Screenshot Testing Issue #539672113 Compose Preview Screenshot Testing: false "Cyclic style parent definitions" error for a dotted-name style with explicit parent="" CPU Issue #549911097 Trace File was not parsed Device Manager Issue #541776384 Device Manager: "Add a new device..." link throws IllegalArgumentException and does nothing when the tool window toolbar is hidden Gemini Issue #549864592 Invalid StreamExperience Request. Violations: contents[18].parts[0].text: Text part must not be empty. Profilers Issue #545999552 Mouse cursor not showing full symbol name when you hover over them in Profiler's Stack Sample ## Handling Asynchronous Images in Android Screenshot Tests DevFeed: [Handling Asynchronous Images in Android Screenshot Tests]() Original publisher: [Read original article]() Author: Alex Zhukovich Published: 2026-08-27T07:41:23Z Content type: tutorial Language: en Sources: [Alex Zhuk - Android development and testing]() Topics: [Testing](), [Android](), [test](), [Compose]() Tags: [android](), [asynchronous](), [junit](), [screenshot-testing](), [tests]() ### AI overview This tutorial explains why asynchronous image loading makes Android screenshot tests unstable or inconsistent. It presents two approaches for deterministic results: injecting fake images with the coil-test library and using Compose inspection mode when the first approach is unavailable. ### Source excerpt This article is based on a chapter from my book, Mastering Android Screenshot Testing. Modern applications frequently load images asynchronously, which is a common cause of unstable screenshot tests or confusion when you review newly generated screenshots. A test can pass locally and fail on CI, produce a different image ## Android Studio Rabbit 1 Canary 1 now available DevFeed: [Android Studio Rabbit 1 Canary 1 now available]() Original publisher: [Read original article]() Author: Android Studio Releaser (noreply@blogger.com) Published: 2026-08-17T14:06:36Z Content type: release Language: en Sources: [Android Studio Release Updates]() Topics: [Android Studio](), [Release notes](), [Android Gradle Plugin](), [bug]() Tags: [android-gradle-plugin](), [android-studio](), [bug](), [channel](), [compose](), [release](), [release-notes](), [screenshot-testing](), [update]() ### AI overview Android Studio Rabbit 1 Canary 1 is available in the Canary channel. The release includes general fixes for Android Studio, Android Gradle Plugin 9.5.0-alpha01, baseline profiles, Compose Preview Screenshot Testing, profilers, and other components. ### Source excerpt Android Studio Rabbit 1 Canary 1 is now available in the Canary channel. If you already have an Android Studio build on the Canary channel, you can get the update by clicking Help > Check for Updates (or Android Studio > Check for Updates on macOS). Otherwise, you can download it here. For information on new features and changes in Android Studio Rabbit 1, see the Android Studio Preview release notes. General fixes and features Below is a list of general fixes in Android Studio Rabbit 1 Canary 1 and Android Gradle Plugin 9.5.0-alpha01. These are a result of your bug reports, which help us to make Android Studio better. If you encounter a problem, let us know by reporting a bug. You can also vote for an existing issue to indicate that it also affects you. Fixed Issues Android Gradle Plugin Issue #533547933 Add a test that validate relocation does not affect task execution Baseline Profiles & ProfileInstaller Issue #543799367 Baseline profile is pulled off the device but never registered in test-result.pb, so collectBaselineProfile finds nothing and copyBaselineProfileIntoSrc deletes the committed profile Compose Preview Screenshot Testing Issue #538484834 Compose Preview Screenshot Testing (alpha15): renderer fails on all previews with IncompatibleClassChangeError: .R and .R$attr disagree on InnerClasses attribute Gemini Issue #540709807 S0 CRITICAL: Data Loss - AI Agent executed malformed shell command deleting drive contents Profilers Issue #347764600 TabbedToolbarTest.noCloseButtonWhenNoListener() broken ## How We Moved 1,500 Android Screenshot Tests to Roborazzi DevFeed: [How We Moved 1,500 Android Screenshot Tests to Roborazzi]() Original publisher: [Read original article]() Author: Zachary Wander Published: 2026-08-08T05:03:41Z Content type: tutorial Language: en Sources: [Thumbtack Engineering - Medium]() Topics: [screenshot-testing](), [Android](), [Testing](), [Compose](), [Kotlin](), [Firebase](), [Git]() Tags: [android](), [compose](), [consistency](), [firebase](), [git](), [jetpack-compose](), [kotlin](), [mobile](), [robolectric](), [roborazzi](), [screenshot](), [screenshot-testing](), [software-testing](), [technology](), [testing](), [tests]() ### AI overview Thumbtack Engineering describes migrating 1,500 Android screenshot tests from Firebase Test Lab to Roborazzi, which runs locally on the JVM. The article covers porting existing suites, comparing screenshots in Git, and addressing rendering, test-data injection, and dependency-injection differences. ### Source excerpt How we moved 1,500 Android screenshot tests to Roborazzi.Introduction If you're a mobile developer you're probably no stranger to screenshot tests. Making sure that layouts remain consistent as time goes on and code changes is important for ensuring functionality and accessibility. Since Thumbtack uses Kotlin and Jetpack Compose for its Android apps, we had historically been using Firebase Test Lab to capture and compare layouts. However, using Firebase can be slow, tedious, and error-prone, so we decided it was time for a change. Instead of Firebase, we decided to migrate to using Roborazzi, a screenshot testing framework that runs fully locally inside the local JVM instead of relying on remote emulators and devices. For more details on why we migrated and the alternatives we evaluated, check out the previous blog post from Brian. This post is going to go into the details of how we migrated, and the challenges we faced along the way. Porting Loop Because the purpose of screenshot tests is ensuring consistency over time, we wanted to bring over our existing test suites into Roborazzi. Deleting the old ones and just creating new tests as we built new layouts was a potential option, but it would wipe out a lot of our automated verification. Instead, we ported our existing Firebase Test Lab screenshot test suites over to Roborazzi. In general, the porting process was pretty simple: Delete the old screenshots. Move the test suites over from androidTest to test. Adjust the code for any API differences. Record new screenshots. Compare the old and new screenshots in the git diff to make sure nothing is broken. Fix broken screenshots. Since Roborazzi uses Robolectric, and Robolectric implements the Android API, most of the test suites needed very few changes to work, with updating the main test rule and test annotations being enough to get them running. A few, like those that relied on permission granting rules or interacted directly with the test Activity, needed some more ## Writing interactive screenshot tests in Compose UI with Touch Robot DevFeed: [Writing interactive screenshot tests in Compose UI with Touch Robot]() Original publisher: [Read original article]() Author: Saket Narayan Published: 2026-05-24T06:09:55Z Content type: tutorial Language: en Sources: [Saket Narayan]() Topics: [Compose](), [screenshot-testing](), [ui-testing](), [Testing]() Tags: [android](), [compose](), [screenshot-testing](), [snapshots](), [testing](), [ui-testing]() ### AI overview The article explains how Block built Touch Robot to generate fake touch events for interactive screenshot tests in Compose UI. It describes using animated PNG snapshots to verify interactions such as clicks, swipes, drawing, and pinch gestures, with deterministic frame comparisons for regression testing. ### Source excerpt These are some examples of real issues that were happening at Block. Each of them was frustrating because we were regularly shipping broken experiences to customers despite having sufficient test coverage. We had screenshot tests using Paparazzi, but they were mostly static snapshots that verified layout correctness. We had connected device tests, but they ran [...] The post Writing interactive screenshot tests in Compose UI with Touch Robot appeared first on Saket Narayan. ## How Compose is changing UI development DevFeed: [How Compose is changing UI development]() Original publisher: [Read original article]() Published: 2026-05-11T00:00:00Z Content type: opinion Language: en Sources: [Kt. Academy]() Topics: [Compose](), [Jetpack Compose](), [Android](), [Kotlin](), [Web Development](), [React](), [Vue.js](), [Web](), [wasm]() Tags: [adaptive](), [android](), [android-compose](), [android-development](), [compose](), [desktop](), [frontend-development](), [ios](), [javascript](), [kotlin](), [react](), [screenshot-testing](), [workshop-learning-programming]() ### AI overview This video transcript argues that Compose, a Kotlin-based declarative UI framework, is expanding beyond Android to iOS, desktop, and websites. It highlights Compose's shared tooling, adaptive layouts, previews, screenshot testing, and native animations while acknowledging weaker browser debugging support than traditional web tools. ### Source excerpt How Compose is changing the game in UI development. ## Headless Screenshot Testing in Thumbtack's Android Apps DevFeed: [Headless Screenshot Testing in Thumbtack's Android Apps]() Original publisher: [Read original article]() Author: Brian Terczynski Published: 2026-03-31T22:47:00Z Content type: tutorial Language: en Sources: [Thumbtack Engineering - Medium]() Topics: [screenshot-testing](), [Testing](), [Android](), [Emulator](), [Firebase](), [Jenkins]() Tags: [android](), [android-app-development](), [emulator](), [firebase](), [jenkins](), [mobile](), [robolectric](), [roborazzi](), [screenshot-testing](), [sdk](), [testing]() ### AI overview Thumbtack explains how it chose Roborazzi to run high-fidelity screenshot tests for its Android apps without an emulator. The article describes how emulator-based testing was slow and difficult to use for Jenkins verification, especially with more than 1,500 tests. ### Source excerpt How we chose Roborazzi for fast, easy, and high-fidelity screenshot tests of our Android apps, without needing to run them on an emulator. As mentioned in our earlier blog post, screenshot tests are a fundamental part of our testing pyramid at Thumbtack. They validate that our UI code renders correctly. They catch UI regressions as our code evolves. They make it easy to share incremental progress with designers. In code reviews, they provide a great way for reviewers to "see" what the UI code is doing. Finally, they are very easy to write! But they were not always easy to run. Because they tested Android UI code, they had to run in a "real" Android environment so that the drawing operations would work. This meant running them on an Android device or emulator. To ensure consistent renderings, developers would have to run their tests on the same device used by our CI job. In the past, this meant having to run a script that would connect to our cloud device testing provider to generate the reference image, which would then be downloaded for inclusion in the local Git branch. Such a process would take minutes to run (not including build time). This got easier when we switched to Firebase Test Lab (FTL), because their emulators were the same as the emulators provided in the Android SDK used on developers' machines. Developers could then simply run their tests on a local emulator which sped up execution time significantly. But it still meant the emulator profile needed to match that of the device on FTL; in particular, the screen size and pixel density. Another problem was, because these were run on an emulator, they could not run with our CR verification job on Jenkins because their execution time was too slow (especially since we have over 1,500 of these tests!). This therefore meant that we had to run our screenshot tests separately, and they could not be used to gate code pushes because they were just too slow to run. So what would often happen was developers would me ## Introducing Visual Testing in Maestro DevFeed: [Introducing Visual Testing in Maestro]() Original publisher: [Read original article]() Author: Dan Caseley Published: 2026-03-02T07:00:00Z Content type: release Language: en Sources: [mobile.dev - Medium]() Topics: [Testing](), [Command-line interface]() Tags: [cli](), [maestro](), [regression](), [screenshot](), [screenshot-testing](), [screenshots](), [testing](), [visual-regression-testing](), [visual-testing]() ### AI overview Maestro's Visual Testing compares screenshots with saved baselines to detect unexpected visual changes. The article explains assertScreenshot, takeScreenshot, cropOn, and thresholdPercentage, and describes use cases including shared design-system components, dependency upgrades, dark mode, and complex layouts. ### Source excerpt Available in CLI v2.2.0, Maestro Studio, and Maestro Cloud ## Why Visual Testing Is Critical for Mobile App Quality DevFeed: [Why Visual Testing Is Critical for Mobile App Quality]() Original publisher: [Read original article]() Author: Alex Zhukovich Published: 2025-03-13T20:59:10Z Content type: tutorial Language: en Sources: [Alex Zhuk - Android development and testing]() Topics: [Testing](), [Mobile](), [Android](), [App]() Tags: [accessibility](), [android](), [android-testing](), [app-quality](), [devices](), [mobile](), [screenshot](), [screenshot-testing](), [testing](), [tests](), [themes](), [ui](), [visual-testing]() ### AI overview The article explains that visual testing can detect UI imperfections that conventional UI tests may miss. It introduces screenshot comparison in Android, using baseline "golden screenshots" to identify alignment, color, layout, localization, and accessibility issues across devices and themes. ### Source excerpt Visual tests catches UI imperfections that traditional UI tests miss. They detect misalignments, color issues, and layout problems across different devices and themes. This article introduces visual testing concepts, explains how screenshot comparison works, and demonstrates implementation. ## Snapshot Testing Libraries for Android: Paparazzi vs Shot DevFeed: [Snapshot Testing Libraries for Android: Paparazzi vs Shot]() Original publisher: [Read original article]() Author: Fajar Febriyan Published: 2024-02-29T03:56:36Z Content type: comparison Language: en Sources: [astronauts-id - Medium]() Topics: [Android](), [screenshot-testing](), [Testing](), [ui-testing](), [testing-library](), [Framework]() Tags: [android](), [android-app-development](), [compare](), [comparison](), [developers](), [screenshot-testing](), [testing](), [testing-library](), [ui-testing]() ### AI overview This comparison explains snapshot testing for Android UI components and contrasts the Shot and Paparazzi libraries. It covers visual regression detection, cross-device consistency, setup, golden images, and verification. ### Source excerpt What is snapshot testing? Snapshot testing, also known as screenshot testing, is an automated testing technique that captures screenshots of User Interface (UI) components and compares them against reference images. The idea is simple: we save a reference screenshot of a UI component in a known good state, and during testing, we capture a new screenshot and compare it to the reference. If these two images match, the test passes; if not, it fails. Comparing the golden image (real pineapple) with the image (pineapple illustration)Then why snapshot testing? According to the Testing Pyramid, UI testing, also known as, end-to-end testing is a type of testing recommended to be carried out in application development. UI testing is basically a mechanism meant to test the UI aspect of any software that users come into contact with. One way to do this is with a simple concept not requiring painful scenarios which is the snapshot testing. The image above is referenced from Martin Fowler's post regarding the Test Pyramid Snapshot testing is beneficial for various reasons: Visual Regression Detection: It helps identifying unintended visual changes introduced during development. Ease of Use: Writing snapshot tests is often simpler and more intuitive than crafting complex UI test scripts. Cross-Platform Testing: Snapshot tests can be used to ensure consistency across various Android devices and configurations. Let's dive into the libraries We chose to discuss and compare these 2 libraries because they have different methods and produce different results. Shot Shot is an open-source snapshot testing library developed by Pedro Vicente Gómez Sánchez. It integrates seamlessly with popular testing frameworks like JUnit and Espresso, making it a popular choice among Android developers. Paparazzi Paparazzi is another popular snapshot testing library developed by Cash App. It offers robust screenshot comparison and supports testing on a wide range of Android devices. How it works? Setup: ## Efficient Testing with Robolectric & Roborazzi Across Many UI States, Devices and Configurations DevFeed: [Efficient Testing with Robolectric & Roborazzi Across Many UI States, Devices and Configurations]() Original publisher: [Read original article]() Author: Sergio Sastre Florez Published: 2023-11-09T21:45:00Z Content type: tutorial Language: en Sources: [Sergio's little tech corner]() Topics: [Testing](), [screenshot-testing](), [ui-testing](), [Android](), [Software Process](), [enum]() Tags: [android](), [android-app-development](), [devices](), [emulator](), [espresso](), [google](), [robolectric](), [roborazzi](), [screenshot-testing](), [screenshots](), [software](), [software-process](), [testing](), [tests](), [ui](), [ui-testing]() ### AI overview This tutorial explains how to use Robolectric and Roborazzi for screenshot testing across many UI states, devices, and configurations. It introduces parameterized tests, enum-based UI states, and device qualifiers for generating screenshots efficiently. ### Source excerpt Robolectric is a popular UI testing tool from Google that enables running UI tests without a physical device or emulator. It supports most androidx.test APIs, like Espresso, ActivityScenario & FragmentScenario as well as ComposeTestRule. Robolectric ... ## Screenshot Tests Are Manual Tests DevFeed: [Screenshot Tests Are Manual Tests]() Original publisher: [Read original article]() Published: 2023-10-17T16:00:00Z Content type: opinion Language: en Sources: [Blogs on Ryan Harter]() Topics: [screenshot-testing](), [Testing](), [ui-testing](), [test-coverage]() Tags: [code-coverage](), [screenshot-testing](), [testing](), [ui-testing]() ### AI overview The article explains that screenshot tests validate UI appearance and can reveal visual changes, but they do not validate application behavior. It argues that screenshot-based coverage can increase coverage numbers while still requiring manual review and complementary UI testing. ### Source excerpt When I joined Dropbox almost 2 years ago, I was asked to help improve the screenshot testing experience, resulting in Dropshots. While I'd played around with early versions of Paparazzi by that point, many of our tests were too heavily reliant on full Activities and Fragments to make use of host side JUnit tests. The more I've worked with screenshot tests, the more I've come to understand their promises and limitations. What screenshot tests offer Screenshot testing can be really helpful to validate that elements on the screen are rendered as you expect. They can help you detect visual changes that might have otherwise gone unnoticed. ## Write Once, Test Everywhere: Cross-Library Screenshot Testing with AndroidUiTestingUtils 2.0.0 DevFeed: [Write Once, Test Everywhere: Cross-Library Screenshot Testing with AndroidUiTestingUtils 2.0.0]() Original publisher: [Read original article]() Author: Sergio Sastre Florez Published: 2023-09-15T15:06:04Z Content type: tutorial Language: en Sources: [Sergio's little tech corner]() Topics: [screenshot-testing](), [ui-testing](), [Testing](), [Android]() Tags: [android](), [android-app-development](), [robolectric](), [roborazzi](), [screenshot-testing](), [testing](), [ui-testing]() ### AI overview This tutorial explains how AndroidUiTestingUtils 2.0.0 supports cross-library screenshot tests. It describes a common interface for device configuration, the subject under test, and screenshot recording or verification, with separate modules for Paparazzi, Dropshots, Roborazzi, and Shot. It also discusses enabling Robolectric Native Graphics mode through Gradle. ### Source excerpt As observed in the previous blog post of this series, screenshot tests have a lot in common regardless of the library they're written with, namely: Setting the device configuration (e.g. Locale, Ui Mode, Font scale...) Setting the Subject Under Tes... ## A World Beyond Libraries: Cross-Library screenshot tests on Android DevFeed: [A World Beyond Libraries: Cross-Library screenshot tests on Android]() Original publisher: [Read original article]() Author: Sergio Sastre Florez Published: 2023-08-23T21:23:13Z Content type: opinion Language: en Sources: [Sergio's little tech corner]() Topics: [screenshot-testing](), [Android](), [Testing](), [Library]() Tags: [android](), [android-app-development](), [robolectric](), [roborazzi](), [screenshot-testing](), [screenshots](), [testing]() ### AI overview An analysis of Android screenshot-testing libraries, comparing JVM-based approaches such as Paparazzi and Roborazzi with on-device tools. It explains trade-offs involving rendering fidelity, emulator reliability, speed, and platform limitations, including fixes in Robolectric 4.12.1. ### Source excerpt The state of the art of screenshot testing for Android Screenshot testing is trending in Android. Many new libraries have come up, and even Google announced at I/O 20231 that they're working on a new tool for this based on Composable Previews powered... ## Android UI screenshot testing across locales, font sizes, orientations, and UI modes DevFeed: [Android UI screenshot testing across locales, font sizes, orientations, and UI modes]() Original publisher: [Read original article]() Author: Sergio Sastre Florez Published: 2022-03-30T05:29:19Z Content type: tutorial Language: en Sources: [Sergio's little tech corner]() Topics: [Android](), [screenshot-testing](), [ui-testing](), [ui](), [Testing](), [User experience (UX)]() Tags: [android](), [android-app-development](), [arabic](), [best-practices](), [design](), [language](), [layout](), [pixel](), [screenshot-testing](), [test](), [testing](), [ui-testing](), [ux]() ### AI overview This tutorial explains how Android screenshot testing can verify UI correctness across configurations such as locales, font sizes, orientations, and light or dark modes. It also discusses localization concerns including right-to-left layouts, mirrored drawables, and numeral systems. ### Source excerpt The success of your app depends heavily on its UI/UX. The more popular your app becomes, the more you should care about the diversity of your users. They might speak different languages, suffer from some sort of visual impairment, or feel too much ey... ## UI tests vs. snapshot tests on Android: which one should I write? 🤔 DevFeed: [UI tests vs. snapshot tests on Android: which one should I write? 🤔]() Original publisher: [Read original article]() Author: Sergio Sastre Florez Published: 2021-12-15T21:03:56Z Content type: tutorial Language: en Sources: [Sergio's little tech corner]() Topics: [screenshot-testing](), [Testing](), [ui-testing](), [Android]() Tags: [android](), [android-app-development](), [best-practices](), [kotlin](), [screenshot-testing](), [testing](), [tests](), [ui-testing]() ### AI overview This Android testing article explains that UI tests and snapshot tests serve different purposes and should not replace each other. UI tests verify behavior and outcomes after interaction, while snapshot tests verify visual appearance across states and configurations such as themes, languages, font sizes, and screen widths. ### Source excerpt Snapshot tests on Android have become very popular lately. They run much faster and are easier to write than UI tests if done correctly. For those who've already fought with UI tests and are new to snapshot testing, it's normal to wonder why to still... ## An introduction to snapshot testing on Android in 2021 📸 DevFeed: [An introduction to snapshot testing on Android in 2021 📸]() Original publisher: [Read original article]() Author: Sergio Sastre Florez Published: 2021-08-09T20:07:20Z Content type: tutorial Language: en Sources: [Sergio's little tech corner]() Topics: [screenshot-testing](), [Android](), [Testing](), [ui-testing]() Tags: [android](), [android-app-development](), [best-practices](), [espresso](), [introduction](), [screenshot-testing](), [testing](), [ui](), [ui-testing](), [uiautomator]() ### AI overview This introduction explains snapshot testing on Android, also known as screenshot testing. It describes how snapshot tests compare rendered views with stored reference images, how they complement interaction-focused UI tests, and how they can detect visual regressions across commits. ### Source excerpt Snapshot testing (also called screenshot testing) has been in the Android world for a while, since 8th October 2015, when Facebook open sourced the first version of their snapshot testing library. They are a special type of UI tests that inflate a vi... ## Screenshot testing with React and Storybook DevFeed: [Screenshot testing with React and Storybook]() Original publisher: [Read original article]() Author: Jesse Pinho Published: 2018-03-19T09:18:02Z Content type: tutorial Language: en Sources: [Bleeding Edge - Medium]() Topics: [screenshot-testing](), [Storybook](), [React](), [Testing](), [styled-components](), [Selenium]() Tags: [continuous-integration](), [react](), [screenshot-testing](), [selenium](), [storybook](), [styled-components](), [testing](), [visual-regression-testing]() ### AI overview The article explains why end-to-end UI tests can miss visual regressions and explores screenshot testing with React and Storybook to check component appearance across different states. ### Source excerpt Visual regression testing for fun, profit, and peace of mind Illustration by Marta Pucci A friend of mine recently related a scary story about the lack of automated visual regression testing where he works--a huge international tech firm that you've heard of and probably use. He'd added a CSS class to an element to hide it from the user. Unbeknownst to him, and despite using BEM-style naming for CSS classes, this class name was already being used for an important checkbox in the user settings screen of his company's web app. The result? Users could no longer change the setting represented by the checkbox, because it was invisible! I asked him why that hadn't been caught by automated tests. He explained that, although they did have end-to-end tests in place that went through the UI and tested its functionality, the tests didn't catch the bug. Selenium was still able to check the original checkbox via its selector, so its visibility had no effect on the outcome of the test. The only way this could have been caught is via visual regression testing -- or, as it is sometimes called, screenshot testing. 💅 Switching to styled-components I recalled this story recently while working on a sizable project at Clue: converting all of our "native" CSS to use styled-components. The new helloclue.com website consists of dozens of components. An article page, for example, contains at least ten different React components, all of which have accompanying CSS files. Converting all of this CSS to styled-components means there's an enormous risk of bugs exactly like the one my friend experienced. So before the project began, I investigated setting up screenshot testing for the site. 📕 Enter Storybook (Note: if you're already familiar with Storybook and @storybook/react, feel free to skip to the next section.) We use Storybook when developing simple presentational components. This way, we can test them in every possible state, without having to reproduce all the logic and so forth required t