webappmcp CLAUDE.md

webappmcp CLAUDE.md is an instructions file for coding agents from cgaspard/webappmcp. It costs 2,786 tokens per session, scanned A, original, MIT.

Development instructions and architecture notes for a web-app MCP server. MCP, or Model Context Protocol, lets AI assistants use tools provided by other programs.

In plain words
What is it for?
Use them when developing, testing, or extending a server that inspects web pages, simulates user actions, and reads application state in React, Vue, Angular, or plain JavaScript apps.
Why use it?
They give contributors a shared explanation of how the server, Express middleware, WebSocket connections, and browser-side code fit together.

Instructions file

Install

Getting it into your agent

One page per mod, every tool's command on it. A separate URL per tool would split the same page into five that compete with each other.

agentmods
npx agentmods add instructions/cgaspard/webappmcp/claude-md
Clone the repo
git clone --depth 1 https://github.com/cgaspard/webappmcp

Wrote this? Show the measurements

A badge with what this costs and how it scanned, read live from this page, so it follows the numbers instead of freezing them. Markdown for a README, HTML for a documentation site or a project page.

agentmods badge for webappmcp CLAUDE.md

README.md
[![agentmods](https://agentmods.dev/badge/instructions/cgaspard/webappmcp/claude-md.svg)](https://agentmods.dev/instructions/cgaspard/webappmcp/claude-md)
Your own site
<a href="https://agentmods.dev/instructions/cgaspard/webappmcp/claude-md"><img src="https://agentmods.dev/badge/instructions/cgaspard/webappmcp/claude-md.svg" alt="Measured on agentmods" height="20"></a>
Per session 2,786 This file is loaded in full into every session.
When invoked 2,786 The same file — it is already loaded in full.
Security scan A 0 findings. Scan, not verified.
Origin original No closer match found in the catalogue.
Token cost

What it costs to keep this loaded

Counted locally with the o200k_base tokenizer, which is exact for GPT models; Claude uses its own tokenizer and its counts differ. Treat this as one consistent yardstick across the catalogue rather than a bill. Prices are per million input tokens.

ModelPer sessionOnce invoked
Fable 5 $0.02786 $0.02786
Opus 5 $0.01393 $0.01393
Sonnet 5 $0.00557 $0.00557
Haiku 4.5 $0.00279 $0.00279

Measured 4d ago against content hash 0a7f59b09d05, method: parsed. Prices are Anthropic first-party input rates as of 2026-08-30, from the pricing page.

Security

Grade A, and why

webappmcp CLAUDE.md scanned grade A with 0 findings against 26 rules in 11 categories — prompt injection, anti-refusal, data exfiltration, privilege escalation, supply chain, agent snooping, system-prompt leakage, SSRF and excessive agency — measured 4d ago.

A static scan of the body, not an audit. Every finding is printed with the line that produced it so you can judge whether it matters here. A mod is markdown that instructs an agent; that is exactly why what it instructs is worth reading.

Nothing flagged

None of the 26 patterns this scan looks for appear in this file: no shell pipes, no recursive deletes, no credential paths, no hidden text, no instruction-override or anti-refusal phrasing, no agent-config snooping. That is not a guarantee, it is the absence of the things that are checkable.

CLAUDE.md · 359 lines

How it starts

The opening of the file, as written. The whole thing — 359 lines — stays where its author put it; the contents beside it link to each section on GitHub.

WebApp MCP Server - Development Guide

Project Overview

This project creates an MCP (Model Context Protocol) server that enables AI assistants to interact with web applications through a comprehensive set of tools. The server acts as a bridge between AI models and web applications, providing DOM inspection, user interaction simulation, and application state management capabilities.

Core Architecture

1. MCP Server Component

  • Node.js-based MCP server that exposes tools for web application interaction
  • Communicates with both backend Express middleware and frontend client
  • Manages WebSocket connections for real-time DOM access

2. Express Middleware

  • Installable as npm package dependency
  • Integrates with existing Express applications
  • Handles MCP server requests and routes them to appropriate handlers
  • Manages WebSocket server for client connections

3. Frontend Client Library

  • Framework-agnostic JavaScript library
  • Supports React, Vue, Angular, and vanilla JS applications
  • Establishes WebSocket connection to backend
  • Executes DOM operations requested by MCP server
  • Captures and transmits application state

Key Features

DOM Inspection Tools

  • Query elements using CSS selectors
  • Get element properties, attributes, and computed styles
  • Traverse DOM tree (parents, children, siblings)
  • Get text content and HTML structure
  • Monitor DOM mutations

User Interaction Simulation

  • Click elements
  • Type text into input fields
  • Submit forms
  • Hover over elements
  • Scroll page or elements
  • Drag and drop operations

Application State Access

  • Read JavaScript object properties
  • Access component state (framework-specific)
  • Monitor console logs
  • Intercept network requests
  • Access local storage and session storage

Visual Capture

  • Take full page screenshots
  • Capture specific element screenshots
  • Record user interaction sequences
  • Get element bounding boxes and positions

Implementation Details

Package Structure

webappmcp/
├── packages/
│   ├── server/          # MCP server implementation
│   ├── middleware/      # Express middleware
│   └── client/          # Frontend client library
├── examples/            # Example applications
└── docs/               # Documentation

Read the full file on GitHub · 359 lines

Changes

What this file has done since we first saw it

Hashed on every crawl. A supply-chain change to an agent config is a question of when, not whether, so the history is kept rather than the latest state alone.

  1. 4d ago First seen · 359 lines · 2,786 tokens per session scan A 0a7f59b09d05

Subscribe to this mod's changes

webappmcp CLAUDE.md is an instructions file published in the GitHub repository cgaspard/webappmcp (0 stars, last pushed 6mo ago), licensed MIT. It adds 2,786 tokens to every session, about $0.0139 per session on Opus 5. A static security scan graded it A with 0 findings. No closer match exists in the catalogue, so it is treated as the original; first seen 2026-08-31.

Related

Other instructions, from other repositories

vscode buildNext.instructions.md

Working notes and architecture documentation for the new esbuild-based build system in build/next. Use when making changes to the new build pipeline (transpile/bundle commands, NLS plugin, source-map handling, resource copying, or self-hosting watch tasks).

microsoft/vscode · 6,785 tokens

spec-kit AGENTS.md

AGENTS.md instructions for github/spec-kit, covering agents.md, about spec kit and specify, quickstart — add a new integration in 5 steps, integration architecture and integrationmanifest — file tracking.

github/spec-kit · 7,104 tokens

codex AGENTS.md

AGENTS.md instructions for openai/codex, covering rust/codex-rs, the codex-core crate, code review rules, crate api surface and model visible context.

openai/codex · 5,182 tokens

vscode oss-third-party-notices.instructions.md

Instructions for microsoft/vscode, covering vs code oss third-party-notices pipeline, architecture, pipeline flow in ci, applying the notice (cutover) and fallback chain (never fail the build).

microsoft/vscode · 5,001 tokens

langchain AGENTS.md

AGENTS.md instructions for langchain-ai/langchain, covering global development guidelines for the langchain monorepo, corridor security analysis, project architecture and context, monorepo structure and development tools & commands.

langchain-ai/langchain · 4,469 tokens

deepseek-harness AGENTS.md

AGENTS.md instructions for deepseek-ai/deepseek-harness, covering agents.md, pre-stable apis and released session data, repository layout, commands and host sandbox failures.

deepseek-ai/deepseek-harness · 3,733 tokens