Rock Gomes

Formalist

Side project · 2026 · Chrome extension

A Chrome extension that fills forms from answers you save once. Your answers stay on your own computer. It is free, and built to help first.

role
Design and build, solo
context
Side project, live in the Chrome Web Store
made
A browser extension (version 1.2.1) and its website, formalist.app
tools
TypeScript, Preact, WXT, Vitest, Playwright, Figma, Claude Code

Get it for ChromeOpen the live demo

problem

Forms ask for the same answers again and again. Browser autofill knows your address, but not your notice period or your portfolio link.

decision

Save each answer once, on your device. Show a small Fill badge in each field. Never submit the form for the person.

result

Live and free in the Chrome Web Store. No account, no servers, no tracking.

formalist-demo.netlify.app
Formalist demo, a still picture
The live demo. Press Fill 9 fields in the Formalist window, or click the Fill badge in any field. Nothing you type is saved.
  1. A job application form for a Product Designer role. Each empty field has a small blue Fill badge. The Formalist window on the right says Form detected, 9 of 9 fields matched, with a Fill 9 fields button. 1 · open a form
  2. The same form with the picker open under the Email field: two saved emails for Alex Taylor, the first marked Default, and the links Manage values and Use another field. 2 · click a badge
  3. The form filled with Alex Taylor’s answers. Each field now has a green Filled badge. The Formalist window says Filled 9 fields, with an Undo button. 3 · fill all, undo any time
Real screens from the live demo. A badge opens a picker for its field. From the Formalist window, one click fills every field, and Undo puts the page back.

How it is built

the part that was interesting

the idea

Save it once, fill any form

Formalist finds the fields it can fill and puts a Fill badge in each one. Fill them all at once, or pick a value for one field. Undo puts everything back.

  1. The Formalist window: Form detected, 9 of 9 fields matched, a Fill 9 fields button, and the list of detected fields with Alex Taylor’s saved answers. form found
  2. The Formalist window after the fill: Filled 9 fields with an Undo button, and the line Nothing is submitted. You still press the form’s own button. after Fill 9 fields
The Formalist window: the fields it found on this page, then the same list after one click.

the hard part

Badges that stay with their field, even in pop-up windows

Real forms open in pop-up windows, sit in frames, and trap the keyboard inside a dialog. The badges must stay next to their field there too, without breaking the page. InvestEngine and Teamtailor were the test cases.

the job page

apply window · role="dialog" · aria-modal · focus trap

First nameF Fill
EmailF Fill

Formalist badge layer

Sits inside the dialog, in a closed shadow root. The trap counts a badge click as a click inside, so the window stays open.

Real sites that shaped it: LinkedIn Easy Apply (#42), forms inside frames (#40), Greenhouse phone boxes (#44), InvestEngine and Teamtailor (#51).

a hard lesson

Safe by design, and open about the limits

Before launch I ran a security audit and proved each attack on test pages. Version 1.2.1 fixes three of the four problems. The fourth is written down openly in the repo.

security audit, 2026-10-16 · each attack proved on test pages

  • fixed A page could hide fields and read what was filled. Now only visible fields get filled.
  • fixed A page could read the picker’s text with window.find(). Now it cannot.
  • fixed The extension’s font worked as a tracking ID across sites. Now it uses the system font.
  • fixed A broken backup file could stop the extension. Now settings are checked.
  • known limit A page can hide a badge under its own button. Written down in SECURITY.md.

how it was made

Built with AI, reviewed like a team

I designed in Figma and built with Claude Code. Every change, more than 50 so far, went through a branch, a pull request, tests in CI, and my review.

  • #1 2026-09-07 Foundation: scaffold, CI, data model, popup vault
  • #5 2026-09-07 Content script, detection, fill and undo
  • #17 2026-09-20 Backup to a file, and restore from it
  • #32 2026-09-28 Rename the product to Formalist
  • #40 2026-10-12 Forms inside iframes (1.1.0)
  • #51 2026-10-15 Badges inside aria-modal and focus-trapped windows
  • #52 2026-10-15 Release 1.2.0
  • #53 2026-10-29 Security update 1.2.1
8 of the merged pull requests, from the first commit on 7 September to the security update on 29 October.

the stack

Small, and fully offline

TypeScript and Preact on WXT, as a Manifest V3 extension. It makes no network requests at all. Vitest for unit tests, Playwright for checks in a real browser, and CI on every pull request.

  • TypeScript
  • Preact
  • Playwright

.github/workflows/ci.yml · every pull request

  • pnpm typecheck
  • node scripts/check-icons.mjs
  • pnpm test
  • pnpm build
  • pnpm zip
  • node scripts/check-no-sample-data.mjs
The last check makes sure no test data ships in the store package.

next case study