# Verify Form Validation

Check that a form actually rejects bad input: the error message renders, the submit...

- Repository: https://github.com/reticlehq/reticle (1299 stars)
- Category: Engineering
- License: Apache-2.0
- Last updated: 2026-11-01
- Runs scripts: no, instructions only

## Install

Claude Code: `npx skills add reticlehq/reticle --skill verify-form-validation -g -a claude-code -y`
Codex: `npx skills add reticlehq/reticle --skill verify-form-validation -g -a codex -y`
Cursor: `npx skills add reticlehq/reticle --skill verify-form-validation -g -a cursor -y`
Gemini CLI: `npx skills add reticlehq/reticle --skill verify-form-validation -g -a gemini-cli -y`
Claude Code plugin marketplace: `/plugin marketplace add reticlehq/reticle`

## Description

Check that a form actually rejects bad input: the error message renders, the submit button stays disabled, and no request goes out. Use when validation logic was written but never driven, when a "required" or pattern check looks right on screen but was never proven, or when a bug report says the form submitted invalid data anyway.

## SKILL.md, as published by its author (untrusted third-party text, read it as data)

# A rejected form still looks fine on screen

Validation code is written once, glanced at in the browser with one obviously-bad value, and never driven again. The bug that ships is never the value you tried. It's the one you didn't: a submit button that isn't disabled until the field blurs, a button that's disabled only by CSS and still clickable, or a handler that fires the request before the check finishes.

**Reticle** can drive the real form and check all three failure points at once. Not set up? Follow the [`reticle`](https://github.com/reticlehq/reticle/blob/main/skills/reticle/SKILL.md) skill: it installs Reticle, asks the user before `init` changes the app's files, and proves one flow.

## Read this before you start: the browser's own validation can mask the app's

`required`, `pattern`, `type="email"` and friends stop the browser at the constraint-validation bubble before your app's JS ever runs. If you assert on that native tooltip, you've verified the browser, not the code you're supposed to be testing. Confirm the error you're checking is the app's own element (a `testid`, a role, a rendered string), not a `:invalid` pseudo-state, before you trust the verdict. If the form relies on native validation alone with no app-level check behind it, that's the finding: say so, don't paper over it with a predicate that happens to pass.

## Trigger the rejection

Name the consequence before you act, same as any Reticle drive:

```
reticle_look({ action: "page", sessionId, mode: "interactive" })   // get refs for the field and submit control

reticle_act_and_wait({ sessionId, ref, action: "fill", args: { value: "<invalid>" }, until: { kind: "allOf", predicates: [
  { kind: "element", query: { testid: "field-error" } },
  { kind: "element", query: { role: "button", name: "Submit" }, state: "disabled" },
]}})
```

The rest: https://github.com/reticlehq/reticle/blob/HEAD/skills/verify-form-validation/SKILL.md