@applitools/mcp 0.4.0
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/CHANGELOG.md +144 -0
- package/LICENSE +26 -0
- package/README.md +213 -0
- package/dist/docs/README.md +213 -0
- package/dist/index.js +24846 -0
- package/dist/index.js.map +1 -0
- package/docs/README.md +213 -0
- package/package.json +102 -0
package/docs/README.md
ADDED
|
@@ -0,0 +1,213 @@
|
|
|
1
|
+
# Applitools MCP Server
|
|
2
|
+
|
|
3
|
+
The Applitools MCP server helps you create, update, and analyze visual tests using Applitools Eyes with our [Playwright (JavaScript/TypeScript) Fixtures SDK](https://applitools.com/docs/eyes/playwright), with support for more frameworks coming soon.
|
|
4
|
+
|
|
5
|
+
It connects to AI assistants through the Model Context Protocol (MCP), allowing tools like Cline, Claude Code, and IDE assistants to help you set up tests, add visual checkpoints, and configure cross-browser testing.
|
|
6
|
+
|
|
7
|
+
To [learn more](https://applitools.com/docs/eyes/integrations/mcp-servers/applitools-mcp), please visit our MCP documentation.
|
|
8
|
+
|
|
9
|
+
## Purpose
|
|
10
|
+
This server is built for developers, testers, or QA working with AI-assisted workflows.
|
|
11
|
+
|
|
12
|
+
It enables your AI assistant to:
|
|
13
|
+
* Understand your project configuration
|
|
14
|
+
* Guide Eyes setup
|
|
15
|
+
* Add visual checkpoints and suggest best practices
|
|
16
|
+
* Review your visual test results
|
|
17
|
+
|
|
18
|
+
All without requiring manual, error-prone steps.
|
|
19
|
+
|
|
20
|
+
## Who is this for?
|
|
21
|
+
* New users to test automation
|
|
22
|
+
* No existing automation framework.
|
|
23
|
+
* Playwright JavaScript engineers new to Applitools Eyes
|
|
24
|
+
* Playwright is already used, but Eyes has not yet been installed or implemented.
|
|
25
|
+
* Existing Eyes Playwright Fixtures users
|
|
26
|
+
* Who want to use the MCP server to:
|
|
27
|
+
* Add Ultrafast Grid coverage (cross-browser and device testing)
|
|
28
|
+
* Expand visual checkpoints in existing tests
|
|
29
|
+
* Retrieve and analyze your visual test results
|
|
30
|
+
|
|
31
|
+
## Requirements & Limitations
|
|
32
|
+
* Node.js 18 or newer
|
|
33
|
+
* VS Code, Cursor, Claude Desktop, or any other MCP client assistant
|
|
34
|
+
* Supports Playwright JavaScript/TypeScript projects and our [Playwright Fixtures SDK](https://applitools.com/docs/eyes/playwright) only.
|
|
35
|
+
* It is recommended using the most recent versions of Playwright Node.js and our Playwright JavaScript Fixtures SDK
|
|
36
|
+
* Requires projects utilizing [Playwright Test](https://playwright.dev/docs/api/class-test)
|
|
37
|
+
* Requires access to your projects source code
|
|
38
|
+
|
|
39
|
+
## Installation
|
|
40
|
+
Recommended: VS Code Extension or Cursor MCP Install
|
|
41
|
+
|
|
42
|
+
The easiest way to start using Eyes MCP is through the Applitools VS Code extension or by installing the MCP server directly in Cursor.
|
|
43
|
+
|
|
44
|
+
* Runs the MCP server automatically
|
|
45
|
+
* Connects it to your AI assistant
|
|
46
|
+
* Provide context-aware code edits
|
|
47
|
+
* Surface visual test results inside your IDE or MCP client CLI of choice
|
|
48
|
+
|
|
49
|
+
<a href="https://marketplace.visualstudio.com/items?itemName=applitools-mcp">
|
|
50
|
+
<img src="https://img.shields.io/badge/Install-VS_Code-007ACC?logo=visualstudiocode&logoColor=white">
|
|
51
|
+
</a>
|
|
52
|
+
|
|
53
|
+
<a href="cursor://anysphere.cursor-deeplink/mcp/install?name=applitools-mcp&config=eyJjb21tYW5kIjoibnB4IC15IEBhcHBsaXRvb2xzL21jcEBsYXRlc3QifQ">
|
|
54
|
+
<img src="https://img.shields.io/badge/Install-Cursor-000000">
|
|
55
|
+
</a>
|
|
56
|
+
<br></br>
|
|
57
|
+
|
|
58
|
+
Alternatively, you can install the server manually by following the `Manual Setup` section below.
|
|
59
|
+
|
|
60
|
+
### What's Included
|
|
61
|
+
|
|
62
|
+
* Automatic MCP server management
|
|
63
|
+
* Seamless IDE + AI assistant integration
|
|
64
|
+
* Context-aware assistance based on open files
|
|
65
|
+
* Smart code edits and checkpoint suggestions
|
|
66
|
+
* Visual test results directly inside your IDE
|
|
67
|
+
|
|
68
|
+
## Manual Setup
|
|
69
|
+
|
|
70
|
+
If you prefer not to use the extension, you can install the MCP server manually by following the examples below.
|
|
71
|
+
|
|
72
|
+
Standard MCP configuration:
|
|
73
|
+
```
|
|
74
|
+
{
|
|
75
|
+
"mcpServers": {
|
|
76
|
+
"applitools-mcp": {
|
|
77
|
+
"type": "stdio",
|
|
78
|
+
"command": "npx",
|
|
79
|
+
"args": ["--yes", "@applitools/mcp@latest"]
|
|
80
|
+
}
|
|
81
|
+
}
|
|
82
|
+
}
|
|
83
|
+
```
|
|
84
|
+
|
|
85
|
+
<details>
|
|
86
|
+
<summary>VS Code</summary>
|
|
87
|
+
Please see the [VS Code MCP install guide](https://code.visualstudio.com/docs/copilot/chat/mcp-servers#_add-an-mcp-server) and use the standard config above.
|
|
88
|
+
|
|
89
|
+
Alternatively, install it via the VS Code CLI:
|
|
90
|
+
|
|
91
|
+
`code --add-mcp '{"name":"applitools-mcp","command":"npx","args":["@applitools/mcp@latest"]}'`
|
|
92
|
+
</details>
|
|
93
|
+
|
|
94
|
+
<details>
|
|
95
|
+
<summary>Copilot</summary>
|
|
96
|
+
|
|
97
|
+
Create or edit the configuration file ~/.copilot/mcp-config.json and add:
|
|
98
|
+
```
|
|
99
|
+
{
|
|
100
|
+
"mcpServers": {
|
|
101
|
+
"applitools-mcp": {
|
|
102
|
+
"type": "local",
|
|
103
|
+
"command": "npx",
|
|
104
|
+
"tools": [
|
|
105
|
+
"*"
|
|
106
|
+
],
|
|
107
|
+
"args": [
|
|
108
|
+
"@applitools/mcp@latest"
|
|
109
|
+
]
|
|
110
|
+
}
|
|
111
|
+
}
|
|
112
|
+
}
|
|
113
|
+
```
|
|
114
|
+
</details>
|
|
115
|
+
|
|
116
|
+
<details>
|
|
117
|
+
<summary>Cursor</summary>
|
|
118
|
+
In your user root directory, edit or add the above configuration to your `~/.cursor/mcp.json` file.
|
|
119
|
+
|
|
120
|
+
Alternatively, go to Cursor Settings -> MCP -> Add new MCP Server. Name it `applitools-mcp`, use `command` type with the command `npx -y @applitools/mcp@latest`.
|
|
121
|
+
</details>
|
|
122
|
+
|
|
123
|
+
<details>
|
|
124
|
+
<summary>Cline</summary>
|
|
125
|
+
Follow the instruction in the section [Configuring MCP Servers](https://docs.cline.bot/mcp/configuring-mcp-servers)
|
|
126
|
+
|
|
127
|
+
Add the following to your `cline_mcp_settings.json` file:
|
|
128
|
+
|
|
129
|
+
```
|
|
130
|
+
{
|
|
131
|
+
"mcpServers": {
|
|
132
|
+
"applitools-mcp": {
|
|
133
|
+
"command": "npx",
|
|
134
|
+
"args": ["--yes", "@applitools/mcp@latest"],
|
|
135
|
+
"disabled": false,
|
|
136
|
+
"type": "stdio",
|
|
137
|
+
"timeout": 60
|
|
138
|
+
}
|
|
139
|
+
}
|
|
140
|
+
}
|
|
141
|
+
```
|
|
142
|
+
</details>
|
|
143
|
+
|
|
144
|
+
<details>
|
|
145
|
+
<summary>Claude Code (CLI)</summary>
|
|
146
|
+
Use the Claude Code CLI to add the Playwright MCP server:
|
|
147
|
+
|
|
148
|
+
`claude mcp add applitools-mcp npx @applitools/mcp@latest`
|
|
149
|
+
</details>
|
|
150
|
+
|
|
151
|
+
<details>
|
|
152
|
+
<summary>Claude Desktop</summary>
|
|
153
|
+
|
|
154
|
+
Follow the MCP install [guide](https://modelcontextprotocol.io/docs/develop/connect-local-servers), and use the standard MCP configuration above.
|
|
155
|
+
</details>
|
|
156
|
+
|
|
157
|
+
## Available Tools
|
|
158
|
+
|
|
159
|
+
### eyes_verify_api_key
|
|
160
|
+
Checks your Applitools API key and optional Eyes server URL.
|
|
161
|
+
|
|
162
|
+
Searches common locations:
|
|
163
|
+
|
|
164
|
+
* APPLITOOLS_API_KEY environment variable and/or APPLITOOLS_SERVER_URL, if applicable
|
|
165
|
+
* .env
|
|
166
|
+
* applitools.config.*
|
|
167
|
+
* playwright.config.*
|
|
168
|
+
|
|
169
|
+
### eyes_setup_project
|
|
170
|
+
Guides the setup of Applitools Eyes in your Playwright project (Fixtures variant).
|
|
171
|
+
|
|
172
|
+
Includes:
|
|
173
|
+
* The Eyes reporter configuration
|
|
174
|
+
* Extends the Playwright HTML report to include Eyes visual test results. Users can approve or reject results in the report without having to visit the Eyes dashboard.
|
|
175
|
+
* Adding Eyes settings and dependency imports into your project files
|
|
176
|
+
* Recommended defaults
|
|
177
|
+
|
|
178
|
+
### eyes_add_checkpoints_to_test
|
|
179
|
+
Adds Eyes visual checkpoints to your existing Playwright test in line with best practices.
|
|
180
|
+
|
|
181
|
+
### eyes_setup_ufg
|
|
182
|
+
Configures the Ultrafast Grid (UFG) for cross-browser and cross-device testing. Guides you through UFG setup to run visual tests across multiple browsers, viewports, and devices simultaneously.
|
|
183
|
+
|
|
184
|
+
### eyes_fetch_visual_results
|
|
185
|
+
Retrieves structured visual test results, including:
|
|
186
|
+
* The Eyes batch name
|
|
187
|
+
* The visual tests that ran
|
|
188
|
+
* The visual test statuses (passed/failed/new/unresolved/etc.)
|
|
189
|
+
|
|
190
|
+
### eyes_get_batch_url
|
|
191
|
+
Extracts and converts Eyes test result URLs from console output. Parses test execution output to find session URLs and converts them to batch URLs for viewing all test results together in the Eyes dashboard.
|
|
192
|
+
|
|
193
|
+
## Getting started & Usage
|
|
194
|
+
Ask your AI assistant about Applitools:
|
|
195
|
+
|
|
196
|
+
* “Using the Applitools MCP server, perform the following tasks”
|
|
197
|
+
* This prompt prefix is optional and can guide your LLM and direct it to use the MCP server for better results.
|
|
198
|
+
* "Set up Applitools Eyes for my project"
|
|
199
|
+
* "Verify my Applitools API key"
|
|
200
|
+
* "Add Eyes visual checkpoints to my login.spec test"
|
|
201
|
+
* "Configure cross-browser testing with the Applitools UFG"
|
|
202
|
+
* "Show me the batch URL for my last test results"
|
|
203
|
+
* "Provide me a summary of my last visual test results"
|
|
204
|
+
|
|
205
|
+
## Helpful links
|
|
206
|
+
|
|
207
|
+
* [Applitools MCP Documentation](https://applitools.com/docs/eyes/integrations/mcp-servers/applitools-mcp)
|
|
208
|
+
* [Applitools Playwright Fixtures SDK](https://applitools.com/docs/eyes/playwright)
|
|
209
|
+
* [Contact Support](https://help.applitools.com/hc/en-us/requests/new)
|
|
210
|
+
|
|
211
|
+
---
|
|
212
|
+
|
|
213
|
+
Built with ❤️ by Applitools
|
package/package.json
ADDED
|
@@ -0,0 +1,102 @@
|
|
|
1
|
+
{
|
|
2
|
+
"name": "@applitools/mcp",
|
|
3
|
+
"mcpName": "io.github.Applitools/applitools",
|
|
4
|
+
"version": "0.4.0",
|
|
5
|
+
"description": "Applitools MCP server for AI coding assistants",
|
|
6
|
+
"main": "./dist/index.js",
|
|
7
|
+
"bin": "./dist/index.js",
|
|
8
|
+
"scripts": {
|
|
9
|
+
"type-check": "tsc --noEmit",
|
|
10
|
+
"build": "yarn type-check && rollup -c",
|
|
11
|
+
"clean": "rm -rf dist",
|
|
12
|
+
"build:bundle": "yarn clean && yarn build && BUILD_MODE=bundle yarn type-check && BUILD_MODE=bundle rollup -c",
|
|
13
|
+
"build:watch": "rollup -c --watch",
|
|
14
|
+
"prepublishOnly": "yarn build",
|
|
15
|
+
"test": "mocha test/**/*.spec.ts --parallel",
|
|
16
|
+
"test:watch": "mocha test/**/*.spec.ts --watch",
|
|
17
|
+
"lint": "eslint 'src/**/*.ts'",
|
|
18
|
+
"lint:fix": "eslint 'src/**/*.ts' --fix"
|
|
19
|
+
},
|
|
20
|
+
"keywords": [
|
|
21
|
+
"applitools",
|
|
22
|
+
"eyes",
|
|
23
|
+
"mcp",
|
|
24
|
+
"model-context-protocol",
|
|
25
|
+
"playwright",
|
|
26
|
+
"visual-testing",
|
|
27
|
+
"ai",
|
|
28
|
+
"coding-assistant",
|
|
29
|
+
"visual regression",
|
|
30
|
+
"model context protocol",
|
|
31
|
+
"ui testing",
|
|
32
|
+
"cross-browser testing",
|
|
33
|
+
"ultrafast grid",
|
|
34
|
+
"test automation"
|
|
35
|
+
],
|
|
36
|
+
"icon": "src/assets/logo.png",
|
|
37
|
+
"license": "SEE LICENSE IN LICENSE",
|
|
38
|
+
"author": {
|
|
39
|
+
"name": "Applitools Team",
|
|
40
|
+
"email": "team@applitools.com"
|
|
41
|
+
},
|
|
42
|
+
"repository": {
|
|
43
|
+
"type": "git",
|
|
44
|
+
"url": "https://github.com/applitools/eyes.sdk.javascript.git",
|
|
45
|
+
"directory": "js/packages/mcp"
|
|
46
|
+
},
|
|
47
|
+
"bugs": {
|
|
48
|
+
"url": "https://github.com/applitools/eyes.sdk.javascript/issues"
|
|
49
|
+
},
|
|
50
|
+
"homepage": "https://applitools.com",
|
|
51
|
+
"files": [
|
|
52
|
+
"dist",
|
|
53
|
+
"docs",
|
|
54
|
+
"README.md",
|
|
55
|
+
"LICENSE"
|
|
56
|
+
],
|
|
57
|
+
"engines": {
|
|
58
|
+
"node": ">=18.0.0"
|
|
59
|
+
},
|
|
60
|
+
"dependencies": {
|
|
61
|
+
"@applitools/core-base": "1.32.0",
|
|
62
|
+
"@applitools/logger": "2.2.8",
|
|
63
|
+
"@applitools/req": "1.9.0",
|
|
64
|
+
"@applitools/utils": "1.14.1",
|
|
65
|
+
"@modelcontextprotocol/sdk": "^1.0.0",
|
|
66
|
+
"cors": "^2.8.5",
|
|
67
|
+
"dotenv": "^16.3.1",
|
|
68
|
+
"express": "^5.2.1",
|
|
69
|
+
"zod": "^4.0.0"
|
|
70
|
+
},
|
|
71
|
+
"devDependencies": {
|
|
72
|
+
"@applitools/test-utils": "^1.5.17",
|
|
73
|
+
"@rollup/plugin-commonjs": "^25.0.7",
|
|
74
|
+
"@rollup/plugin-json": "^6.1.0",
|
|
75
|
+
"@rollup/plugin-node-resolve": "^15.2.3",
|
|
76
|
+
"@rollup/plugin-typescript": "^11.1.6",
|
|
77
|
+
"@types/cors": "^2.8.19",
|
|
78
|
+
"@types/express": "^5.0.6",
|
|
79
|
+
"@types/mocha": "^10.0.6",
|
|
80
|
+
"@types/node": "^20.10.0",
|
|
81
|
+
"@typescript-eslint/eslint-plugin": "^8.51.0",
|
|
82
|
+
"@typescript-eslint/parser": "^8.51.0",
|
|
83
|
+
"eslint": "^9.39.2",
|
|
84
|
+
"eslint-config-prettier": "^10.1.8",
|
|
85
|
+
"eslint-plugin-prettier": "^5.5.4",
|
|
86
|
+
"fast-glob": "^3.3.2",
|
|
87
|
+
"hono": "^4.0.0",
|
|
88
|
+
"mocha": "^10.2.0",
|
|
89
|
+
"prettier": "^3.7.4",
|
|
90
|
+
"rollup": "^4.9.6",
|
|
91
|
+
"rollup-plugin-copy": "^3.5.0",
|
|
92
|
+
"typescript": "~5.3.3"
|
|
93
|
+
},
|
|
94
|
+
"publishConfig": {
|
|
95
|
+
"access": "public"
|
|
96
|
+
},
|
|
97
|
+
"lavamoat": {
|
|
98
|
+
"allowScripts": {
|
|
99
|
+
"@applitools/core-base>@applitools/image>sharp": false
|
|
100
|
+
}
|
|
101
|
+
}
|
|
102
|
+
}
|