Writing
PromptBeginner5 minmarkdown
Agentic Bill Payments MCP Server
generic skill
1
使用 Chrome DevTools MCP 进行前端页面调试、布局优化、性能诊断及交互验证。
Sign in to like and favorite skills
generic skill
References to demo script and key prompts for validation
I want you to act as an English translator, spelling corrector and improver. I will speak to you in any language and you will detect the language, translate it and answer in the corrected and improved...
此 Skill 允许 AI 直接与实际运行的浏览器窗口交互,通过 DevTools 协议实现精准的 UI 修补和性能优化。
在开始任何修改前,先观察页面:
list_pages: 找到目标页面索引。capture_screenshot: 获取视觉反馈,确认当前样式。text_snapshot: 获取无障碍树和 UID,确定要操作的元素。click: 模拟点击。fill_form: 批量填充测试数据。evaluate_script: 执行 JS 检查当前组件状态(如 __vue_app__ 数据)。resize_page 切换移动端/桌面端。capture_screenshot 配合 evaluate_script 修改运行时 CSS,实时验证效果。list_console_messages: 定位 runtime errors。performance_start_trace: 开始性能采样。performance_analyze_insight: 分析特定性能瓶颈(如 DocumentLatency 或 LCPBreakdown)。evaluate_script 手动改动运行时 DOM/CSS 以验证猜想。capture_screenshot 并查看其快照,确保符合 设计系统规范。/articles/new 页面在 iPhone 12 尺寸下的布局,如果提交按钮被遮挡请修复 CSS。”