连接应用与 MCP
在本地开发版本中启用 window->startDevTools(),保持主线程运行事件循环。使用 SDK tools/devtools_mcp/server.py 启动 stdio MCP 服务,依赖见同目录 requirements.txt。客户端配置中的绝对路径换成自己的 SDK 路径。调用 kui_targets 查看目标,再用 kui_connect 的 target 选择当前应用。
{
"mcpServers": {
"kui-devtools": {
"command": "python",
"args": [
"G:/path/to/kui-sdk/tools/devtools_mcp/server.py"
]
}
}
}把验收条件交给 Agent
要求右栏宽度为 250px、栏间距为 20px,名称输入框改成 Forge Design,点击保存后反馈包含 Saved: Forge Design。检查范围包含计算样式、实际几何尺寸、输入事件、Lua 状态更新与截图。下图来自真实 MCP stdio 会话,不是聊天动画。
读取元素与位置
用 kui_dom(selector="#workspace") 确认目标;kui_get_style 读取计算样式,kui_box_model 返回宽高与 content、padding、border、margin 坐标。点击坐标从目标元素的 border 四边形中心计算,修改布局后重新读取,不复用过期坐标。
[
{
"tool": "kui_dom",
"arguments": {
"selector": "#workspace"
}
},
{
"tool": "kui_get_style",
"arguments": {
"selector": "#workspace"
}
},
{
"tool": "kui_box_model",
"arguments": {
"selector": "#workspace-name"
}
}
]实时验证样式方案
kui_set_style 向文档注入一条规则,不覆盖整个样式表;kui_set_style_property 修改单个元素的内联属性。修改后再次读取计算样式,并检查侧栏实际宽度。MCP 不会自动把这次变化保存到工程文件,源码修改需要 Agent 单独完成。
{
"tool": "kui_set_style",
"arguments": {
"selector": "#workspace",
"css_text": "grid-template-columns: 1fr 250px; gap: 20px"
}
}输入、点击、断言和截图
用 kui_click 聚焦输入框,kui_key 发送 Ctrl+A 的 keyDown 与 keyUp,kui_type 输入名称,再按保存按钮的当前坐标点击。用 kui_outer_html 读取 #status,并由测试端断言文字包含 Saved: Forge Design。最后用 kui_screenshot 保存窗口。工具返回成功只表示命令已执行,测试必须检查应用状态和画面。
[
{
"tool": "kui_key",
"arguments": {
"key": "a",
"modifiers": 2
}
},
{
"tool": "kui_key",
"arguments": {
"key": "a",
"event_type": "keyUp",
"modifiers": 2
}
},
{
"tool": "kui_type",
"arguments": {
"text": "Forge Design"
}
},
{
"tool": "kui_outer_html",
"arguments": {
"selector": "#status"
}
},
{
"tool": "kui_screenshot",
"arguments": {
"output_path": "G:/my-project/artifacts/preferences.png"
}
}
]继续检查脚本和性能
Lua 断点可通过 kui_debugger_enable、kui_script_sources、kui_breakpoint_set 设置,暂停后用 kui_call_stack、kui_scope、kui_debugger_eval 查看状态,再用 kui_step 或 kui_resume 继续。kui_perf_record_start/stop/get 记录与读取帧数据,kui_perf_hot_nodes 查询节点归因。指标和可用采样能力以当前后端返回值为准。
文档有误或遗漏?
反馈此页问题 →