Visual BDD Test Builder for Playwright
Create Gherkin scenarios with drag-and-drop, run them with Playwright. No code required to write tests.
SuiSui is a free, open-source desktop app that lets QA engineers and developers build BDD tests visually. It integrates with playwright-bdd and Playwright so you can go from idea to running test without writing Gherkin by hand.
- Pick steps from your project's step definitions
- Fill parameters inline (strings, tables, examples)
- Hit Run — tests execute headless or in Playwright UI
https://github.com/user-attachments/assets/scenario-builder-demo
Every demo video on the project website is auto-generated from an end-to-end Playwright test.
| Feature | Description |
|---|---|
| Visual Scenario Builder | Drag-and-drop Given/When/Then steps. Edit arguments inline. |
| Automatic Step Discovery | Imports step definitions from your playwright-bdd project. |
| Smart Step Matching | Cucumber expressions, enums, optional text, DataTables, anonymous params. |
| Real-time Validation | Validates scenarios against step definitions before running. |
| Integrated Test Runner | Run headless or with Playwright UI from the app. |
| Feature File Management | Create, edit, and organize .feature files in a tree view. |
| Git Integration | Built-in version control via isomorphic-git. |
| Self-Contained Runtime | Ships with embedded Node.js — no external install required. |
Grab the latest release for your platform:
| Platform | Format |
|---|---|
| Linux | AppImage, .deb |
| macOS | .dmg |
| Windows | .exe installer |
- Launch SuiSui and select a workspace folder (or clone a repo)
- Initialize a new BDD project or open an existing playwright-bdd project
- Create a feature file in the tree view
- Build scenarios by selecting steps from the catalog
- Run tests with the integrated runner
- Click New Feature → name it "Login"
- Add steps from the catalog:
Given I am on the "login" pageWhen I fill "username" with "testuser"When I fill "password" with "secret123"When I click on "Submit"Then I should see "Welcome"
- Click Save then Run
SuiSui's pattern processor handles the full Cucumber expression syntax:
| Syntax | Example | Description |
|---|---|---|
{string} |
I click on {string} |
Quoted string parameter |
{int} |
I wait {int} seconds |
Integer (supports negatives) |
{float} |
price is {float} |
Decimal number |
{word} |
I click {word} |
Single word |
{} |
I see {} |
Anonymous parameter |
(a|b|c) |
I login as (admin|user) |
Enum alternation |
(text) |
{int} cucumber(s) |
Optional text |
word1/word2 |
belly/stomach |
Alternative text |
(col1, col2): |
users (name, email): |
DataTable with columns |
| Layer | Technology |
|---|---|
| Desktop | Electron 35 |
| Frontend | Nuxt 4 (Vue 3) |
| UI Components | PrimeVue 4 |
| State | Pinia |
| Test Runner | Playwright + playwright-bdd |
| Git | isomorphic-git |
| Unit Tests | Vitest |
| E2E Tests | Playwright Electron |
| Runtime | Embedded Node.js 22 |
git clone https://github.com/Asteb612/SuiSui.git
cd SuiSui
pnpm install
pnpm dev| Command | Description |
|---|---|
pnpm dev |
Start dev mode with hot reload |
pnpm build |
Production build |
pnpm test |
Run unit tests |
pnpm test:e2e |
Run E2E tests (build first) |
pnpm typecheck |
Full TypeScript type checking |
pnpm lint:fix |
Fix linting issues |
pnpm dist |
Build distributable packages |
SuiSui/
├── apps/desktop/ # Electron + Nuxt desktop app
│ ├── app/ # Frontend (Vue components, stores, pages)
│ ├── electron/ # Backend (services, IPC, main process)
│ └── e2e/ # E2E tests + demo recordings
├── packages/shared/ # Shared types and IPC contracts
└── doc/ # Documentation + GitHub Pages site
SuiSui follows strict process isolation:
- Main Process (Electron) — Node.js with file system access
- Renderer Process (Nuxt) — Browser-based UI
- Preload Script — Typed IPC bridge between the two
See Architecture docs for details.
| Document | Description |
|---|---|
| User Guide | End-user documentation |
| Architecture | Design and data flow |
| Services | Backend services |
| Frontend | Components and stores |
| IPC & Types | IPC channels and types |
| Development | Dev workflow |
| Testing | Testing strategies |
Contributions welcome! See CONTRIBUTING.md for guidelines.
- Fork the repository
- Create a feature branch (
git checkout -b feature/amazing-feature) - Commit your changes
- Open a Pull Request
MIT — see LICENSE for details.
- playwright-bdd — BDD framework for Playwright
- Playwright — Browser automation
- PrimeVue — Vue UI components