From 2da24da3924d4717ff585d5ea22304de3f384b6c Mon Sep 17 00:00:00 2001
From: zyh <zyh320888@vip.qq.com>
Date: Thu, 23 Apr 2026 08:18:46 +0000
Subject: [PATCH] =?UTF-8?q?sync:=20d8d-prototype=20=E7=BB=9F=E4=B8=80=20Pl?=
 =?UTF-8?q?aywright=20CLI=20=E5=91=BD=E4=BB=A4=E9=A3=8E=E6=A0=BC?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- step-07-validate.md: Playwright MCP 调用改为 CLI 命令
- workflow.md: 门禁验证改为 CLI 风格
---
 .../d8d-prototype/steps/step-07-validate.md   | 47 ++++++++-----------
 .claude/skills/d8d-prototype/workflow.md      |  4 +-
 2 files changed, 22 insertions(+), 29 deletions(-)

diff --git a/.claude/skills/d8d-prototype/steps/step-07-validate.md b/.claude/skills/d8d-prototype/steps/step-07-validate.md
index 2b1e25c..a0e0853 100644
--- a/.claude/skills/d8d-prototype/steps/step-07-validate.md
+++ b/.claude/skills/d8d-prototype/steps/step-07-validate.md
@@ -4,7 +4,7 @@
 
 ## STEP GOAL
 
-使用 Playwright MCP 和图片 MCP 对所有已生成的页面进行自动化验证，输出验证报告。
+使用 Playwright CLI 和图片 MCP 对所有已生成的页面进行自动化验证，输出验证报告。
 
 ## ⚠️ 强制验证（不可跳过）
 
@@ -47,31 +47,25 @@ curl -s -o /dev/null -w "%{http_code}" http://localhost:8080/
 cd prototype/ && nohup node server.js &>/dev/null &
 ```
 
-### 7.3 使用 Playwright MCP 验证原型页面
+### 7.3 使用 Playwright CLI 验证原型页面
 
-```javascript
-// 1. 启动浏览器，导航到入口
-mcp__playwright__browser_navigate
-url: http://localhost:8080/index.html
+```bash
+# 1. 导航到入口
+playwright-cli -s={S} goto http://localhost:8080/index.html
 
-// 2. 截图保存入口页面
-mcp__playwright__browser_take_screenshot
-filename: prototype/screenshots/01-index.png
-fullPage: true
+# 2. 截图保存入口页面
+playwright-cli -s={S} screenshot filename=prototype/screenshots/01-index.png fullPage=true
 
-// 3. 点击原型系统入口，验证平铺展示
-mcp__playwright__browser_click
-ref: [原型系统卡片]
+# 3. 点击原型系统入口，验证平铺展示
+playwright-cli -s={S} click "text=原型系统"
 
-mcp__playwright__browser_take_screenshot
-filename: prototype/screenshots/02-prototype-grid.png
-fullPage: true
+playwright-cli -s={S} screenshot filename=prototype/screenshots/02-prototype-grid.png fullPage=true
 
-// 4. 遍历每个独立页面
-// 对状态文件中每个已勾选的页面：
-//   - 导航到页面 URL
-//   - 获取快照
-//   - 截图保存
+# 4. 遍历每个独立页面
+# 对状态文件中每个已勾选的页面：
+#   - 导航到页面 URL
+#   - 获取快照
+#   - 截图保存
 ```
 
 ### 7.4 文档内容深度验证 ⭐（强制步骤）
@@ -80,7 +74,7 @@ fullPage: true
 
 #### 7.4.1 遍历所有文档链接
 
-使用 Playwright `browser_run_code` 批量验证：
+使用 Playwright `eval` 批量验证：
 
 ```javascript
 async (page) => {
@@ -112,10 +106,9 @@ async (page) => {
 
 对每个文档页面检查控制台是否有 404 或加载失败错误：
 
-```javascript
-mcp__playwright__browser_console_messages
-level: error
-// 检查是否有 "Failed to load resource" 或 "404" 错误
+```bash
+playwright-cli -s={S} console level=error
+# 检查是否有 "Failed to load resource" 或 "404" 错误
 ```
 
 #### 7.4.3 修复发现的问题
@@ -249,7 +242,7 @@ Read _d8d/design-tool-adapter/adapters/pencil.md  — 了解具体命令
 - 测试页面: {total} 个
 - 测试文档: {doc_count} 个
 - 截图数量: {count} 张
-- 验证方式: Playwright MCP + Image MCP
+- 验证方式: Playwright CLI + Image MCP
 
 ## 链接验证结果
 | 页面 | 链接状态 | 跳转正确 | 备注 |
diff --git a/.claude/skills/d8d-prototype/workflow.md b/.claude/skills/d8d-prototype/workflow.md
index e87e104..3122a91 100644
--- a/.claude/skills/d8d-prototype/workflow.md
+++ b/.claude/skills/d8d-prototype/workflow.md
@@ -81,8 +81,8 @@ page_counts:
 3. ✅ 状态文件 `completed_steps` 包含 `evidence` 字段
 
 ### 验证步骤门禁（Step 7 专属）
-1. ✅ 使用 `mcp__playwright__browser_take_screenshot` 对平铺入口截图
-2. ✅ 使用 `mcp__zai-mcp-server__analyze_image` 分析截图，验证：
+1. ✅ 使用 `playwright-cli -s={S} screenshot` 对平铺入口截图
+2. ✅ 使用图片 MCP 分析截图，验证：
    - 桌面端页面：布局列数正确，内容按桌面端比例缩放
    - 移动端页面：手机框架包裹，375×812 尺寸
    - 文字可读、UI 元素清晰
-- 
2.49.1