Back to Details

browser-test

Compare original and translation side by side

🇺🇸

Original

English

🇨🇳

Translation

Chinese

Browser Testing

浏览器测试

Automated UI testing using Playwright via the ruflo browser MCP tools.

通过ruflo浏览器MCP工具，使用Playwright进行自动化UI测试。

When to use

使用场景

When you need to verify UI functionality, test user flows, or validate that frontend changes work correctly in a real browser.

当你需要验证UI功能、测试用户流程，或者确认前端变更在真实浏览器中能正常工作时。

Steps

步骤

Open page — call
```
mcp__claude-flow__browser_open
```
with the target URL

Interact — use

browser_click

,

browser_fill

,

browser_type

,

browser_select

for form inputs

Wait — call
```
mcp__claude-flow__browser_wait
```
for elements to appear or network idle
Validate — call
```
browser_get-text
```
/
```
browser_get-value
```
to check content
Screenshot — call
```
mcp__claude-flow__browser_screenshot
```
to capture visual state
Snapshot — call
```
mcp__claude-flow__browser_snapshot
```
for accessibility tree
Clean up — call
```
mcp__claude-flow__browser_close
```
when done

打开页面 —— 调用
```
mcp__claude-flow__browser_open
```
并传入目标URL
交互操作 —— 使用
```
browser_click
```
、
```
browser_fill
```
、
```
browser_type
```
、
```
browser_select
```
处理表单输入
等待操作 —— 调用
```
mcp__claude-flow__browser_wait
```
等待元素加载完成或网络空闲
验证内容 —— 调用
```
browser_get-text
```
/
```
browser_get-value
```
检查内容
截图 —— 调用
```
mcp__claude-flow__browser_screenshot
```
捕获视觉状态
快照 —— 调用
```
mcp__claude-flow__browser_snapshot
```
获取无障碍树
清理 —— 完成后调用
```
mcp__claude-flow__browser_close
```

Navigation

导航操作

```
browser_back
```
/
```
browser_forward
```
for history navigation
```
browser_reload
```
to refresh the page
```
browser_scroll
```
to scroll to elements or coordinates

使用
```
browser_back
```
/
```
browser_forward
```
进行历史导航
使用
```
browser_reload
```
刷新页面
使用
```
browser_scroll
```
滚动到指定元素或坐标

Tips

小贴士

Use
```
browser_wait
```
before assertions to handle async rendering
Take screenshots before and after interactions for visual regression
Use
```
browser_eval
```
for custom JavaScript assertions

在断言前使用
```
browser_wait
```
处理异步渲染
在交互前后截图以进行视觉回归测试
使用
```
browser_eval
```
进行自定义JavaScript断言