Loki.js or Playwright - looking for Storybook ( React ) visual testing - automation

Answer

Sure, let's talk about some tools you can use for Storybook visual testing.

First up, we have Chromatic. This tool integrates with Storybook to automatically capture and compare screenshots of your UI components across different states and environments. It's a great way to catch visual regressions and ensure consistent UI rendering.

Next, there's Percy. Like Chromatic, Percy integrates with Storybook and provides automated visual testing capabilities. It captures screenshots of your components and allows you to review visual changes between different versions or branches of your codebase.

Finally, there's Applitools Eyes. This tool uses AI-powered image comparison algorithms to detect visual differences in your UI components across various browsers and devices.

These tools offer features like baseline management, integration with CI/CD pipelines, collaboration capabilities, and more to streamline the process of visually validating your Storybook components.

While @playwright/test is a versatile tool for browser automation and testing purposes, it may not be the best choice specifically for storybook visual testing. Tools like Chromatic, Percy, or Applitools Eyes are better suited for this particular use case as they provide dedicated features tailored towards capturing and comparing screenshots of Storybook components.