Windows下Cline配置playwright-mcp-server实现智能化测试

导语:

这篇文章里进一步以Cline接入playwright-mcp为例,讲解过程中遇到的坑,以及MCP配置。

playwright-mcp安装

在VS Code中安装Cline的步骤就不在这里赘述了,可以参考我之前的文章。
Cline + DeepSeek-V3 代码助手再进化

现在网上提供的教程中,多数是通过MCP社区,例如pulsemcp,或者是直接在GitHub上参考开源项目的说明文档。这两天魔搭也上线最大MCP中文社区,给出了很多国内厂商提供的MCP配置。

以playwright为例 ,以下是三个网站的内容截图。

pulsemcp
图片
图片
在这里插入图片描述

GitHub
在这里插入图片描述
在这里插入图片描述

魔搭社区
在这里插入图片描述

接下来该说说坑在哪里了。

大部分的文章里直接就拿着这几个网站给的示例,进行配置了,甚至还有些会告诉你可以直接把配置复制到任务里,让Cline自己装。
在这里插入图片描述

但实际上如果是Cline下直接使用,你可能就要上了大当了!
实际上你按照这个步骤操作,看到的肯定是这个结果。
在这里插入图片描述

我都不知道他们是怎么配置成功的,还是说不知道从哪里抄来,根本不做验证。
在网上再次搜索解决方案,以下是这个错误的原因。
在这里插入图片描述

这个配置是给Claude Desktop用的,如果是Windows下Cline必须要进行调整。
在这里插入图片描述

还有一种是使用node进行执行,这种方式需要提前安装node_modules。

npm install -g @executeautomation/playwright-mcp-server

然后手工配置命令和参数。

{
  "mcpServers": {
    "@executeautomation-playwright-mcp-server": {
      "disabled": false,
      "timeout": 60,
      "command": "C:\\Program Files\\nodejs\\node.exe",
      "args": [
        "C:\\Users\\"用户名"\\AppData\\Roaming\\npm\\node_modules\\@executeautomation\\playwright-mcp-server\\dist\\index.js",
        "-y",
        "@smithery/cli@latest",
        "run",
        "@executeautomation/playwright-mcp-server",
        "--config",
        "\"{}\""
      ],
      "transportType": "stdio",
      "autoApprove": [
        "playwright_navigate",
        "playwright_evaluate",
        "playwright_fill",
        "playwright_click",
        "playwright_get_visible_text",
        "playwright_save_as_pdf",
        "playwright_press_key",
        "playwright_drag",
        "playwright_go_forward",
        "playwright_go_back",
        "playwright_get_visible_html",
        "start_codegen_session",
        "end_codegen_session"
      ]
    }
  }
}

这里也说下配置文件里得主要参数:

mcpServers(必需): 定义所有MCP服务器的集合。
server_name(自定义): 服务标识(如filesystem、fetch等)。
transportType(必需): 服务类型,支持:
stdio:本地进程通信(如Python/Node.js脚本)。
sse:远程Server-Sent Events API(需URL)。
command(必需): 启动命令(如python script.py)。
args(必需):命令所需参数。

Cline中的对应配置:

disabled:是否启用。
timeout:超时配置,单位秒。
autoApprove:是否自动执行。
配置完成后,如果连接正常,会显示绿色原点。同时可以查看mcp提供的详细服务,也可以在可视化界面中直接配置“自动批准”,修改后会自动同步配置。
在这里插入图片描述

Cline内部也提供了市场,可以直接安装,部分直接安装失败的就需要手工处理了。
在这里插入图片描述

配置完成后,可以直接在交换界面测试了,比如“打开百度网页”。
在这里插入图片描述

可以看到,大模型使用了Chromium打开了网页。
在这里插入图片描述

### 在 VSCode 中集成和使用百度云 DeepSeek 进行代码搜索 #### 安装必要的扩展 为了能够在 Visual Studio Code (VSCode) 中高效地使用百度云 DeepSeek 进行代码搜索,需先安装特定的插件。通常情况下,这涉及到安装支持 AI 辅助开发功能的相关工具包或插件[^1]。 #### 配置环境变量与连接设置 完成上述扩展程序的安装之后,下一步就是配置环境以便能够顺利访问百度云上的资源和服务。对于想要接入像 DeepSeek 这样的服务来说,可能需要下载并按照官方说明来设定 API 密钥或其他形式的身份验证凭证。如果存在专门针对 VSCode 的指南,则应遵循该指南中的指示操作[^2]。 #### 使用 PageAssist 工具辅助开发 考虑到有用户分享了一个名为 `pageassist` 的工具链接,这个工具或许可以作为增强型编辑器的一部分,在编写测试脚本时提供帮助。虽然这不是直接关联到 DeepSeek 的部分,但在某些场景下它可能会间接促进更高效的编码流程。不过需要注意的是,这类外部资源的安全性和合法性应当得到充分评估后再决定是否采用。 #### 编写及运行基于 Playwright 的自动化测试案例 一旦完成了前期准备工作,就可以着手创建具体的测试项目了。这里将以 Python 为例展示一段简单的 Playwright 测试框架下的用例: ```python from playwright.sync_api import sync_playwright def run_test(): with sync_playwright() as p: browser = p.chromium.launch(headless=False) page = browser.new_page() page.goto('http://example.com') print(page.title()) browser.close() if __name__ == '__main__': run_test() ``` 这段代码展示了如何启动浏览器实例、导航至指定网页以及获取页面标题等基本交互动作。当然实际应用中还需要根据具体业务逻辑调整相应参数和方法调用。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值