# Mimik: a browser extension that records clicks into a guide

> Mimik is a Manifest V3 extension for Chrome, Firefox and Edge that captures clicks, keystrokes and navigations while you work, turns each one into a step with an annotated screenshot, and stores everything on the device with no account and no telemetry.

**westpoint-io/mimik** — 🪄 A browser extension that captures your workflow as you click and turns it into a step-by-step guide with annotated screenshots 📸

- Repository: https://github.com/westpoint-io/mimik
- Website: https://mimik.westpoint.io
- Stars: 1,629 · Forks: 197
- Language: TypeScript
- License: MIT
- Published: 2026-10-16 · Updated: 2026-10-16 · Language: en
- Canonical page: https://hysenlabs.com/projects/westpoint-io-mimik

## What Mimik records while you work

Mimik is a browser extension that captures a workflow as you click through a page and turns it into a step-by-step guide with annotated screenshots. The README's summary is that there is no account, no cloud and no tracking, and that the extension runs entirely in the browser with no backend and no telemetry.

The capture is broad. Clicks on buttons and links, form inputs, keyboard shortcuts, clipboard actions, drag events and page navigations all become steps. Two details matter for the quality of the resulting guide. Rapid clicks on nearby elements are merged so the output stays readable, and clicks are intercepted before the page navigates away, which means a step is not lost on a single page application or on a full page load.

Each step gets its own screenshot with the clicked element highlighted and zoomed in, so there is no cropping or annotation tool to learn. There is also a pause and resume pair: pause stops capture without ending the recording, and entering Smart blur pauses the recording the same way, which is how you avoid recording the moment where you paste a real password.

The extension is available for Chrome, Firefox and Edge, and the interface is translated into English, Spanish, Brazilian Portuguese, French, German and Simplified Chinese, with the language used for generated descriptions set separately from the interface language.

## Installing the extension and the first recording

Mimik is distributed through the browser stores rather than built from source for ordinary use. The README lists a Chrome Web Store listing, a Firefox Add-ons listing and a Microsoft Edge Add-ons listing, with the supported version badges for each browser.

The workflow once it is installed is short. Start a recording, do the task, and stop. The recording becomes a guide with one step per meaningful action, each with an annotated screenshot. The README also describes narration while you work, editing afterwards, and then replaying or exporting the result, so the guide is a document rather than a video.

Building the extension yourself is a different path, and the repository is set up for it. The project uses WXT as its extension framework, and the package scripts cover both browser targets:

```json
"dev": "wxt",
"dev:firefox": "wxt -b firefox --mv3",
"build": "wxt build",
"build:firefox": "wxt build -b firefox --mv3",
"zip": "wxt zip",
"zip:firefox": "wxt zip -b firefox --mv3",
"zip:all": "pnpm zip && pnpm zip:firefox",
```

The Firefox variants pass --mv3 explicitly, which is the manifest version that target expects. A developer runs pnpm dev for a Chrome build with hot reload, and pnpm dev:firefox for the Firefox one.

## Smart blur and the gaps the README admits

Smart blur is the feature that decides whether Mimik can be used on a real application, and the README is unusually explicit about its limits. It is a mode you enter while recording rather than an always-on filter. While it is active, capture pauses, Mimik detects and masks sensitive data on the page, emails, phone numbers, social security numbers, credit cards, IP addresses and MAC addresses, and screenshots of that page stay masked once you click Done. Each category can be toggled independently, and a manual blur picker masks any DOM element you select across every screenshot where it appears.

The README then lists what is not covered, and the list is structural rather than a bug backlog. The scan reads text nodes and input values in the top frame only, so content inside iframes is skipped, shadow DOM is not descended into, text painted on a canvas and text inside images are pixels rather than text, CSS ::before and ::after content is not a text node, select and option text is excluded, and values held only in attributes such as title or alt are not scanned. Only the tab you entered the mode on is scanned. And the scan stops when you click Done, so a later single page application re-render, a next page of a list, or a navigation comes back unmasked.

Two edge behaviours are worth knowing. A match inside SVG text is removed from the render rather than blurred, because the mask is an HTML element SVG will not draw, so the data does not leak but the text disappears. A matching input or textarea is blurred as a whole field rather than only the matched substring. Blur also applies only from the moment the mode is entered, so earlier screenshots are not masked retroactively and have to be deleted in the editor.

## Descriptions generated from DOM context, not from pixels

Mimik can describe each step in words instead of leaving the rule-based form. The README shows the difference between a generated sentence such as Click the Submit button to save changes and the plain Click Submit.

The mechanism is the interesting part. You bring your own API key, OpenAI or Anthropic, and the descriptions are generated from a lightweight DOM context of roughly 50 to 100 tokens rather than from the screenshot. The README puts the cost at around 15 to 30 times cheaper than a vision model, which follows from never sending pixels. The description language is chosen separately from the interface language, so a guide can be written in English while the extension runs in German.

The dependency list shows the implementation. The ai package, the OpenAI and Anthropic provider packages from the AI SDK, and the use of DOM context rather than image input, together explain the cost claim. It also means the model sees a text representation of the element and not the rendered page, so a description can be accurate about the element and still miss the surrounding context.

Because the key is supplied by the user, the extension itself has no account, which is consistent with the local-first design, and the rest of the documentation, voice narration and video voice-over features are described as optional in the same way.

## How the project is built and tested

The extension is a React and TypeScript application built on WXT, and the tooling choices are visible in the manifest:

```json
"wxt": "^0.20.20",
"react": "^19.2.4",
"dexie": "^4.3.0",
"xstate": "^5.28.0",
"zustand": "^5.0.12",
"dayjs": "^1.11.20",
"ai": "^6.0.142",
"tailwindcss": "^4.2.2",
```

Dexie handles the local database, which is what makes the no-backend claim work. XState drives the recording state machine, with the separate @xstate/react package for the React bindings, and Zustand holds lighter UI state. dayjs handles dates, which matters for a tool that stamps guides. Tailwind 4 with the Vite plugin and Radix UI cover the interface, and Biome is the linter and formatter rather than ESLint and Prettier.

The remaining scripts follow the same discipline:

```json
"typecheck": "tsc --noEmit",
"test": "vitest run",
"test:cov": "vitest run --coverage",
"lint": "biome check .",
"prepare": "husky",
"postinstall": "wxt prepare"
```

The postinstall hook runs wxt prepare, which generates the extension types, so a fresh clone has them before the first build. Husky manages the git hooks, and the repository also carries AGENTS.md, CLAUDE.md and a .husky/ directory, which is a hint that the project expects contributors to work with an assistant as well as an editor.

## Where Mimik is the wrong tool

The first case is compliance work that assumes every screenshot is scrubbed. The README is clear that Smart blur misses iframes, shadow DOM, canvas text, images, generated CSS content and select elements, and that it only covers the tab and the moment it was active. A team that needs a guarantee rather than a best effort should either check every screenshot by hand, as the README advises, or use a different tool.

The second case is a workflow that must be repeatable rather than merely documented. Mimik captures what a person did, and a guide that describes clicks is not a test. A team that wants a regression test for a web application needs something that drives the browser from a script, and the difference is fundamental: a captured trace has to be interpreted, while a script is executed. If the goal is a tutorial for a colleague, Mimik is the right shape; if the goal is a check that runs on every commit, it is not.

The third limitation is the extension boundary. Only what happens in the browser is recorded. A workflow that spans a desktop application, a terminal or a second screen is outside the capture, and the guide will be missing those steps, which is a gap that a screen recording tool would not have.

There is also a per-feature cost to keep in mind. The descriptions need your own API key, and every generation is a call to a third party service with the DOM context of the page you were on, so a team that cannot send page content to an external API can use the rule-based descriptions and the rest of the tool, but not that feature.

## Conclusion

Mimik fits a team documenting a web application for colleagues who did not build it, and its local-first storage and optional API key make it usable on internal tools that cannot leave the network. It does not fit a compliance workflow that assumes every screenshot is scrubbed, because the README lists the cases Smart blur cannot reach. Check first whether the pages you record live in iframes, shadow DOM or canvases, since those are listed as gaps.

## FAQ

### Does Mimik send my recordings to a server?

No. The README states that Mimik runs entirely in the browser with no backend, no account, no telemetry and nothing leaving the device. The local database is handled by Dexie in the extension, and the optional AI descriptions are the only feature that calls an external service, using a key you supply.

### What does Smart blur not cover?

The README lists the gaps: content inside iframes, shadow DOM, text painted on a canvas, text inside images, CSS ::before and ::after content, select and option text, values held only in attributes, frames other than the top one, and any content that appears after you click Done.

### Which browsers does the Mimik extension support?

Chrome, Firefox and Edge, each through its own store listing. The Firefox builds are produced with the --mv3 flag in the WXT commands, and zip:all packages both targets.

### How are step descriptions generated?

You bring an OpenAI or Anthropic key, and Mimik sends a lightweight DOM context of roughly 50 to 100 tokens rather than the screenshot, which the README puts at around 15 to 30 times cheaper than a vision model. The description language is chosen separately from the interface language.

## Sources

- [License: MIT](https://github.com/westpoint-io/mimik/blob/dev/LICENSE)
- [Project website](https://mimik.westpoint.io)
- [README](https://github.com/westpoint-io/mimik/blob/dev/README.md)
- [Releases](https://github.com/westpoint-io/mimik/releases)
- [westpoint-io/mimik on GitHub](https://github.com/westpoint-io/mimik)

---

Hysen Labs editorial analysis, written from the project's own repository and release notes. Cite the canonical page: https://hysenlabs.com/projects/westpoint-io-mimik