visual-testing-desktop-electron

Capture Electron app screenshots with Playwright Electron and Storybook for visual regression testing.

2|Updated Dec 21, 2025
One-click install
npx skills add https://github.com/telum-ai/speck --skill visual-testing-desktop-electron
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: visual-testing-desktop-electron
Source: https://github.com/telum-ai/speck/tree/main/.cursor/skills/visual-testing-desktop-electron
Command: npx skills add https://github.com/telum-ai/speck --skill visual-testing-desktop-electron

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

This Skill streamlines the process of visually validating Electron desktop applications, ensuring UI consistency across different states and platforms.

Core Features & Use Cases

  • Automated Screenshotting: Captures screenshots of the main window, specific elements, and different window states.
  • Cross-Platform Testing: Facilitates testing on macOS, Windows, and Linux, with support for platform-specific baselines.
  • Use Case: After updating a UI component in your Electron app, use this Skill to automatically generate screenshots of the updated component in various sizes and themes, comparing them against existing baselines to catch regressions.

Quick Start

Run the visual regression tests for your Electron application using the provided Playwright configuration.

Frequently Asked Questions about visual-testing-desktop-electron

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I run visual regression testing for an Electron desktop app?

Visual regression testing for Electron apps is performed using Playwright and Storybook to capture screenshots. The Skill automates capturing main windows and element states, integrating with Percy to compare against baselines and detect UI regressions across macOS, Windows, and Linux.

Can I capture screenshots of different window sizes and themes in Electron?

Yes, you can capture screenshots of different window sizes and themes in Electron. The Skill validates various window states and specific UI elements, supporting platform-specific baselines across macOS, Windows, and Linux.

Does Playwright work with Percy for Electron visual testing?

Playwright works with Percy for Electron visual testing by capturing application screenshots. The Skill uses Playwright Electron to automate screenshot generation and integrates with Percy to manage baseline comparisons and detect visual regressions.

What is the best way to catch UI regressions in an Electron application?

The best way to catch UI regressions in an Electron application is through automated visual validation. This Skill uses Playwright to screenshot elements and window states across macOS, Windows, and Linux, comparing them with Percy to detect visual inconsistencies.

How do I test Electron app visuals across macOS, Windows, and Linux?

To test Electron app visuals across macOS, Windows, and Linux, this Skill facilitates cross-platform screenshot capture. It supports platform-specific baselines, allowing you to validate main windows and UI elements consistently across different operating systems.