blur
使聚焦的元素失去焦点。
在 .blur() 之后继续链式调用依赖于目标元素的命令是不安全的。
caution
当前元素必须处于聚焦状态。如果要在失去焦点前确保元素已聚焦，可以尝试先使用 .focus() 再调用 .blur()。
cy.get('button').as('btn').focus()
cy.get('@btn').blur()
语法
.blur()
.blur(options)
用法
正确用法
cy.get('[type="email"]').blur() // 使邮箱输入框失去焦点
cy.get('[tabindex="1"]').blur() // 使具有 tabindex 的元素失去焦点
错误用法
cy.blur('input') // 错误，不能从 'cy' 开始链式调用
cy.window().blur() // 错误，'window' 不返回 DOM 元素
参数
options (Object)
传入选项对象以改变 .blur 的默认行为。
| 选项 | 默认值 | 描述 |
|---|---|---|
log | true | 在命令日志中显示该命令 |
force | false | 强制执行操作，禁用检查元素是否聚焦 |
timeout | defaultCommandTimeout | 等待 .blur() 解析的超时时间，超过则超时 |
生成结果
.blur()返回与传入时相同的目标元素。- 在
.blur()之后继续链式调用依赖于目标元素的命令是不安全的。
示例
无参数
使评论输入框失去焦点
cy.get('[name="comment"]').type('Nice Product!')
cy.get('[name="comment"]').blur()
选项
使第一个输入框失去焦点
在选项中设置 force 为 true 可以禁用检查输入框是否可聚焦或当前是否聚焦。
cy.get('input:first').blur({ force: true })
注意事项
可操作性
blur 不是一个操作命令
.blur() 的实现与其他操作命令不同，不遵循相同的等待可操作性规则。
.blur() 是一个有用的快捷命令。通常用户无法直接"使元素失去焦点"，而是需要通过其他操作（如点击或切换到另一个元素）来实现。这种间接操作在测试中效率较低。
因此，直接使用 .blur() 测试失去焦点的行为通常更加高效。
超时
.blur() 可能因浏览器未接收到任何 blur 事件而超时
如果遇到此错误，可能需要确保主浏览器窗口当前处于聚焦状态。这意味着在命令运行时，不要将焦点放在调试器或其他窗口上。
Cypress 内部会处理这种情况，并在必要时模拟浏览器行为填充 blur 事件。但不幸的是，当窗口不处于焦点时，浏览器的行为仍会有所不同——例如可能会限制异步事件。最佳做法是在运行测试时保持 Cypress 窗口处于焦点状态。
规则
要求
.blur()需要链式调用返回 DOM 元素的命令。.blur()要求元素当前处于聚焦状态。.blur()要求元素能够接收焦点。
断言
.blur()会自动等待链式断言通过。
超时设置
.blur()可能会因等待添加的断言通过而超时。
命令日志
在输入后使文本域失去焦点。
cy.get('[name="comment"]').focus()
cy.get('[name="comment"]').type('Nice Product!')
cy.get('[name="comment"]').blur()
以上命令将在命令日志中显示为：
在命令日志中点击 blur 命令时，控制台会输出以下内容：
