@wp-playground/mcp 3.1.5
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/.eslintrc.json +24 -0
- package/README.md +96 -0
- package/e2e/mcp-tools.spec.ts +679 -0
- package/package.json +46 -0
- package/playwright.config.ts +35 -0
- package/project.json +64 -0
- package/src/bridge-client.ts +196 -0
- package/src/bridge-server.spec.ts +228 -0
- package/src/bridge-server.ts +485 -0
- package/src/client.ts +3 -0
- package/src/index.ts +28 -0
- package/src/mcp-server.ts +34 -0
- package/src/tools/register-mcp-server-tools.ts +347 -0
- package/src/tools/tool-definitions.ts +527 -0
- package/src/tools/tool-executors.ts +205 -0
- package/tsconfig.json +15 -0
- package/tsconfig.lib.json +10 -0
- package/vite.config.ts +49 -0
package/.eslintrc.json
ADDED
|
@@ -0,0 +1,24 @@
|
|
|
1
|
+
{
|
|
2
|
+
"extends": ["../../../.eslintrc.json"],
|
|
3
|
+
"ignorePatterns": ["!**/*"],
|
|
4
|
+
"overrides": [
|
|
5
|
+
{
|
|
6
|
+
"files": ["*.ts", "*.tsx", "*.js", "*.jsx"],
|
|
7
|
+
"rules": {
|
|
8
|
+
"no-console": 0
|
|
9
|
+
}
|
|
10
|
+
},
|
|
11
|
+
{
|
|
12
|
+
"files": ["*.ts", "*.tsx"],
|
|
13
|
+
"rules": {}
|
|
14
|
+
},
|
|
15
|
+
{
|
|
16
|
+
"files": ["*.js", "*.jsx"],
|
|
17
|
+
"rules": {}
|
|
18
|
+
},
|
|
19
|
+
{
|
|
20
|
+
"files": ["*.spec.ts"],
|
|
21
|
+
"rules": {}
|
|
22
|
+
}
|
|
23
|
+
]
|
|
24
|
+
}
|
package/README.md
ADDED
|
@@ -0,0 +1,96 @@
|
|
|
1
|
+
# @wp-playground/mcp
|
|
2
|
+
|
|
3
|
+
MCP server that connects AI providers to a WordPress Playground running in the browser.
|
|
4
|
+
|
|
5
|
+
## Usage
|
|
6
|
+
|
|
7
|
+
### 1. Configure your MCP client
|
|
8
|
+
|
|
9
|
+
Pick the configuration for your AI tool:
|
|
10
|
+
|
|
11
|
+
#### Claude Code / Claude Desktop
|
|
12
|
+
|
|
13
|
+
Add to your Claude Code `.mcp.json` or Claude Desktop `claude_desktop_config.json`:
|
|
14
|
+
|
|
15
|
+
```json
|
|
16
|
+
{
|
|
17
|
+
"mcpServers": {
|
|
18
|
+
"wordpress-playground": {
|
|
19
|
+
"type": "stdio",
|
|
20
|
+
"command": "npx",
|
|
21
|
+
"args": ["@wp-playground/mcp"]
|
|
22
|
+
}
|
|
23
|
+
}
|
|
24
|
+
}
|
|
25
|
+
```
|
|
26
|
+
|
|
27
|
+
#### Gemini CLI
|
|
28
|
+
|
|
29
|
+
Add to `~/.gemini/settings.json` (or `.gemini/settings.json` in your project):
|
|
30
|
+
|
|
31
|
+
```json
|
|
32
|
+
{
|
|
33
|
+
"mcpServers": {
|
|
34
|
+
"wordpress-playground": {
|
|
35
|
+
"command": "npx",
|
|
36
|
+
"args": ["@wp-playground/mcp"]
|
|
37
|
+
}
|
|
38
|
+
}
|
|
39
|
+
}
|
|
40
|
+
```
|
|
41
|
+
|
|
42
|
+
### 2. Open the Playground website
|
|
43
|
+
|
|
44
|
+
Navigate to https://playground.wordpress.net/?mcp=yes in your browser. The MCP bridge connects automatically.
|
|
45
|
+
|
|
46
|
+
## Development
|
|
47
|
+
|
|
48
|
+
When working on the MCP server or the Playground codebase, run from source instead:
|
|
49
|
+
|
|
50
|
+
### 1. Start the Playground dev server
|
|
51
|
+
|
|
52
|
+
```bash
|
|
53
|
+
npm run dev
|
|
54
|
+
```
|
|
55
|
+
|
|
56
|
+
### 2. Configure your MCP client
|
|
57
|
+
|
|
58
|
+
> **Note:** Your default `node` must be Node 22+. If it isn't, replace `node` in the command below with the full path to Node 22+ (e.g. `/Users/ME/.nvm/versions/node/v22.22.0/bin/node`).
|
|
59
|
+
|
|
60
|
+
Add to your MCP client config (e.g. Claude Code `.mcp.json` or Claude Desktop `claude_desktop_config.json`):
|
|
61
|
+
|
|
62
|
+
```json
|
|
63
|
+
{
|
|
64
|
+
"mcpServers": {
|
|
65
|
+
"wordpress-playground": {
|
|
66
|
+
"type": "stdio",
|
|
67
|
+
"command": "node",
|
|
68
|
+
"args": ["--experimental-strip-types", "--experimental-transform-types", "--import", "ABS_PATH_TO_PLAYGROUND/packages/meta/src/node-es-module-loader/register.mts", "ABS_PATH_TO_PLAYGROUND/packages/playground/mcp/src/index.ts"]
|
|
69
|
+
}
|
|
70
|
+
}
|
|
71
|
+
}
|
|
72
|
+
```
|
|
73
|
+
|
|
74
|
+
Replace `ABS_PATH_TO_PLAYGROUND` with the absolute path to your local checkout of this repository.
|
|
75
|
+
|
|
76
|
+
### 3. Open the Playground website
|
|
77
|
+
|
|
78
|
+
Navigate to http://127.0.0.1:5400/website-server/?mcp=yes in your browser. The MCP bridge connects automatically.
|
|
79
|
+
|
|
80
|
+
## How it works
|
|
81
|
+
|
|
82
|
+
```
|
|
83
|
+
AI Client (stdio) → MCP Server (Node.js) → WebSocket (port 7999) → Browser (Playground website)
|
|
84
|
+
```
|
|
85
|
+
|
|
86
|
+
The MCP server communicates with AI clients via stdio and with the browser via WebSocket. A bridge client (`bridge-client.ts`) integrated into the Playground website via Redux middleware auto-connects to the WebSocket server and proxies commands to the PlaygroundClient API.
|
|
87
|
+
|
|
88
|
+
## Available tools
|
|
89
|
+
|
|
90
|
+
**Site management**: `playground_list_sites`, `playground_open_site`, `playground_rename_site`, `playground_save_site`
|
|
91
|
+
|
|
92
|
+
**Code execution**: `playground_execute_php`, `playground_request`
|
|
93
|
+
|
|
94
|
+
**Navigation & info**: `playground_navigate`, `playground_get_current_url`, `playground_get_site_info`
|
|
95
|
+
|
|
96
|
+
**Filesystem**: `playground_read_file`, `playground_write_file`, `playground_list_files`, `playground_mkdir`, `playground_delete_file`, `playground_delete_directory`, `playground_file_exists`
|