Home

AppraiseJS

Try locally Generated output View demo GitHub

Open source visual test automation

Bridge QA and Engineering with visual tests you can actually version control.

Visually author browser flows and generate reviewable Playwright/Cucumber artifacts your team can run locally, inspect in git, and carry into CI.

npx create-appraisejs@latest

Curious how it works?

See the workflow

Evaluate in 15 minutes

Prove it to yourself in 15 minutes.

01 Run `npx create-appraisejs@latest`

Scaffold the local project and open the generated workspace.

npx create-appraisejs@latest

02 Build one visual smoke flow

Author a small browser journey with locators and assertions.

Open creating-tests guide 03 Inspect generated Playwright/Cucumber output

Review the feature, step code, locator data, and report shape.

Open generated output sample

Team handoff

Anyone authors flows, engineers review files, CI runs normal automation.

AppraiseJS gives the whole team a visual authoring layer while preserving the Playwright/Cucumber artifacts engineers expect to inspect, version, and run in existing pipelines.

Test Suite .feature

Test Case *.feature.scenario

Template Step *.step.ts

Locators locators.json

Evidence report.json

Generated Output

Inspect what gets committed to your repo beforehand

Start with the files. A visual checkout smoke test becomes Gherkin, Cucumber steps using Playwright, locator data, and report evidence your team can review before adopting the tool.

AppraiseJS Entity Authoring Source

• Visual flow Checkout smoke test
• Locator capture Cart, email, payment selectors
• Reusable step Sign in and complete purchase
• Local run Chromium execution

 

AppraiseJS Engine Generated Artifacts Output

• features/checkout.feature Readable Gherkin feature file with scenario
• locators/checkout.locators.json Repo-owned locators with mapping to page routes
• steps/checkout.steps.ts Playwright step definition with reusable parameters
• /reports/checkout/report.json Cucumber report with timing, debug evidence, and scenario details

• Visual flow Checkout smoke test
  features/checkout.feature Readable Gherkin feature file with scenario
• Locator capture Cart, email, payment selectors
  locators/checkout.locators.json Repo-owned locators with mapping to page routes
• Reusable step Sign in and complete purchase
  steps/checkout.steps.ts Playwright step definition with reusable parameters
• Local run Chromium execution
  /reports/checkout/report.json Cucumber report with timing, debug evidence, and scenario details

sample repo output mock IDE

Explorer

tests/appraise/

tests/appraise/features/checkout-smoke.feature tests/appraise/steps/checkout.steps.ts tests/appraise/locators/checkout.locators.json test-results/appraise/checkout-smoke/report.json

checkout-smoke.feature checkout.steps.ts checkout.locators.json report.json

checkout-smoke.feature

Gherkin

# tests/appraise/features/checkout-smoke.featureFeature: Checkout smoke  Scenario: Returning buyer completes a card checkout    When I add "Everyday Hoodie" to the cart    And I use the saved shipping address    And I pay with "visa_success"    Then the order confirmation should be visible    And the confirmation total should equal "$64.00"

Show full file output

checkout.steps.ts

TypeScript

import { expect } from "@playwright/test";import locators from "../locators/checkout.locators.json";When("I add {string} to the cart", async ({ page }, itemName) => {  await page.getByRole("link", { name: itemName }).click();  await page.locator(locators.product.addToCart.selector).click();  await expect(page.locator(locators.cart.summary.selector)).toBeVisible();});When("I pay with {string}", async ({ page }, cardName) => {  await page.locator(locators.payment.savedCard.selector).selectOption(cardName);  await page.locator(locators.payment.submit.selector).click();});Then("the confirmation total should equal {string}", async ({ page }, total) => {  await expect(page.locator(locators.order.total.selector)).toHaveText(total);});

Show full file output

checkout.locators.json

JSON

{  "addToCart": "[data-testid='add-to-cart']",  "paymentSubmit": "[data-testid='submit-payment']",  "orderTotal": "[data-testid='confirmation-total']"}

Show full file output

report.json

JSON

{  "status": "passed",  "browser": "chromium",  "durationMs": 18420,  "startedAt": "2026-05-24T10:32:08.842Z",  "artifacts": [    "trace.zip",    "screenshots/order-confirmation.png",    "run-evidence.json"  ],  "steps": [    { "name": "open storefront", "status": "passed" },    { "name": "complete checkout", "status": "passed" }  ]}

Show full file output

What to inspect before adopting

• Review the generated Gherkin, step code, and locator data.
• Confirm the Playwright output fits your existing CI shape.
• Check reports for enough failed-run debugging evidence.

Creating tests See how visual flows transforms into test scenarios. Reports Where local run evidence and report data live.

Anyone can model flows

Browser journeys start as visual steps, locators, and assertions before they become automation.

Engineers review generated code

The output lands as repo-owned Playwright/Cucumber files instead of trapped recorder scripts.

CI runs normal automation

Run locally first, then carry the same generated artifacts into your existing CI loop.

Run quick start locally

Quick start npx create-appraisejs@latest

Open source core

Local-first project

Playwright/Cucumber artifacts

No hosted runner required

Architecture, sync, reports, and runtime docs

Runs from the generated repo

Workflow proof

One workflow, concrete artifacts at every step.

Follow a single visual flow as it becomes locator context, generated test files, and local run evidence.

01 Create flow Author the login journey as a saved flow definition. 02 Add locators/assertions Attach selectors and assertions to the locator map. 03 Generate code Save the test flow and AppraiseJS conversion engine automatically coverts the flow to relevant artifacts(feature files, step definitions, locator entries) 04 Run locally Run the flow and keep report/log evidence in the project. 05 Examine reports Inspect run evidence, timing, and failure details.

01 Create flow

Author the login journey as a saved flow definition.

Create Test

Navigate

Fill Username

Fill Password

Click Login

02 Add locators/assertions

Attach selectors and assertions to the locator map.

Create Test

Navigate

Fill Username

Fill Password

Click Login

Assert Text

Add Node

Assert Text

Extract Locator

03 Generate code

Save the test flow and AppraiseJS conversion engine automatically coverts the flow to relevant artifacts(feature files, step definitions, locator entries)

Generated test files

login.feature login.steps.ts login.locators.json

# features/login.feature
Feature: Login smoke

  Scenario: Valid user signs in
    When I open the login page
    And I submit valid credentials
    Then the dashboard should be visible

04 Run locally

Run the flow and keep report/log evidence in the project.

Create Test Run

Start Test Run

Executing Tests

05 Examine reports

Inspect run evidence, timing, and failure details.

Test Report

What engineers keep

Visual authoring without giving up the engineering loop.

AppraiseJS should fit a serious test stack: generated artifacts stay portable, execution stays local-first, and the evaluation path starts with one real smoke test.

Local execution Run the generated project on your machine before CI.

Git-reviewed files Review feature files, steps, locators, and reports in PRs.

CI-compatible runs Carry the generated Playwright/Cucumber output into pipelines.

Open source core Inspect the implementation instead of trusting a black box.

Tradeoffs

Use AppraiseJS when visual authoring and repo-owned automation both matter.

It is not a replacement for every testing tool. It is a bridge for teams that need non-code authoring without losing Playwright, Cucumber, git review, and local execution.

Current path Keep it when Use AppraiseJS when

Playwright alone Engineers own all authoring, locators, maintenance, and review. Product, test, or engineering teammates need visual authoring while engineers still review repo output.

Cypress and recorders Quick capture and a single-tool workflow are enough. Generated Playwright/Cucumber files need to live in git, not recorder state.

TestRail and Gherkin Planning, traceability, and scenario language are the main need. Authoring, locators, execution, and reports must stay connected.

Custom frameworks Your team already has mature authoring, locator, CI, and reporting infrastructure. Fragmentation across those pieces is the problem to reduce.

Not for you if...

• You want a hosted test-management suite to replace your existing planning tool.
• Your engineers prefer to hand-author every test and do not need visual collaboration.
• Your team is not willing to inspect generated code and own it in the repo.

Open source

No hidden runner. No generated-code black box.

AppraiseJS is built around local projects, pull requests, and automation artifacts that remain useful outside the visual editor.

Run quick start locally View GitHub Repository

AppraiseJS Deterministic browser automation from visual workflows.

Quick Start Reference Architecture GitHub