DOMAN — End-to-End Documentation

Browser Extension: Community-Powered Security Layer for Base Chain
Version 0.2.0 | Last Updated: 28 April 2026

1. Introduction

1.1 What is DOMAN?

DOMAN is a browser extension that provides a community-powered security layer for the Base chain ecosystem. The extension protects users from:

• Phishing sites — automatic detection when users visit dangerous sites
• Scam addresses — community database that flags suspicious wallets
• Risky contracts — scanner that analyzes smart contracts before interaction
• Wallet-draining bots — bots that auto-approve transactions and drain balances

1.2 Problem Solved

User wallets on Base chain can be auto-drained by bots — malicious bots that auto-approve transactions. Whenever funds exceeding $1 enter, they are immediately transferred to the attacker’s wallet. There is no security layer that warns users before dangerous transactions are executed.

1.3 Target Users

• Base chain users (DeFi users, traders, airdrop hunters)
• Web3 communities active on Base
• dApp developers on Base

2. System Architecture

Execution Worlds

The extension uses two execution worlds in content scripts:

Important: Plasmo v0.90.5 does not reliably register .ts MAIN world content scripts in the manifest. Therefore, MAIN world code is injected via chrome.scripting.executeScript({ world: "MAIN" }) from the background script. This is the same pattern used by MetaMask.

3. Tech Stack

4. Project Structure

doman-extension/
├── package.json                          # Dependencies, scripts, manifest config
├── tailwind.config.js                    # Tailwind theme, colors, animations
├── tsconfig.json                         # TypeScript configuration
├── postcss.config.js                     # PostCSS + Tailwind + Autoprefixer
├── README.md                             # Quick start guide
│
├── docs/
│   ├── PRD.md                            # Product Requirements Document
│   └── DOCUMENTATION.md                  # This file
│
├── walkthrough.md                        # Implementation walkthrough
│
├── src/
│   ├── constants/
│   │   └── index.ts                      # Message types, chain config, safety lists, types
│   │
│   ├── background/
│   │   └── index.ts                      # Background service entry point
│   ├── background.ts                     # Background service worker logic
│   │
│   ├── popup/
│   │   └── index.tsx                     # Popup entry point
│   ├── popup.tsx                         # Popup UI component (main UI)
│   │
│   ├── options.tsx                       # Options/Settings page (full tab)
│   │
│   ├── content/
│   │   └── index.tsx                     # Content script badge entry
│   │
│   ├── contents/
│   │   ├── index.tsx                     # Address overlay + badge content script
│   │   ├── wallet-bridge.ts             # Wallet event bridge content script
│   │   └── dapp-checker.tsx             # Auto safety checker content script
│   │
│   ├── utils/
│   │   ├── api.ts                        # Backend API client
│   │   ├── detect-dapp.ts               # dApp detection heuristics
│   │   └── cn.ts                         # clsx + tailwind-merge utility
│   │
│   ├── types/
│   │   ├── ethereum.d.ts                # Window.ethereum type definitions
│   │   └── style.d.ts                   # CSS module type declarations
│   │
│   ├── styles/
│   │   └── globals.css                  # CSS custom properties
│   │
│   ├── style.css                         # Main styles (Tailwind + custom utilities)
│   │
│   └── assets/
│       ├── icon.png                      # Extension icon
│       └── logo.png                      # Brand logo
│
└── build/                                # Build output (generated)
    └── chrome-mv3-prod/                  # Production build

5. Installation & Build

5.1 Prerequisites

• Node.js >= 18
• npm >= 9
• Chrome / Chromium browser
• MetaMask or Coinbase Wallet

5.2 Install & Run

# Clone repository
git clone https://github.com/domanprotocol/extension.git
cd wallo-extension

# Install dependencies
npm install

# Development mode (hot-reload)
npm run dev

# Production build
npm run build

# Package for Chrome Web Store (ZIP)
npm run package

5.3 Load Extension in Chrome

1. Run npm run build
2. Open Chrome -> chrome://extensions/
3. Enable Developer mode (toggle in top right)
4. Click Load unpacked
5. Select the build/chrome-mv3-prod/ folder
6. The extension icon appears in the toolbar

5.4 Manual Install from Release

1. Download latest doman-extension-v0.1.0.zip from Releases
2. Extract the ZIP file
3. Open chrome://extensions/
4. Enable Developer mode
5. Click Load unpacked -> select the extracted folder

5.5 Environment Variables

6. Manifest & Permissions

The extension uses Manifest V3 generated by Plasmo.

Permissions

Content Scripts Registration (by Plasmo)