Playwright实战：Playwright 时钟（Clock）功能详解

在自动化测试领域，准确模拟时间依赖行为对于验证应用程序的正确性至关重要。利用Playwright的Clock功能，可以在测试中操纵和控制时间，从而实现对渲染时间、超时、计划任务等功能的精确验证，而无需受到实时执行带来的延迟和可变性的影响。

Clock API提供的方法：

• setFixedTime：为Date.now()和new Date()设置固定时间。

• install

  ：初始化时钟，并允许你在后续操作中暂停、快进、运行特定时长或恢复时间。

  • pauseAt：在特定时间暂停时间。
  • fastForward：快进时间。
  • runFor：运行特定时长的时间。
  • resume：恢复时间。

• setSystemTime：设置当前系统时间（仅推荐用于高级用例）。

推荐使用方法：

通常建议使用setFixedTime将时间设置为特定值。如果这不适用于你的用例，可以使用install方法，它允许你在后续操作中暂停、快进、逐帧运行时间等。setSystemTime方法则仅推荐在高级用例中使用。

page.clock覆盖的原生全局类和函数：

page.clock会覆盖与时间相关的原生全局类和函数，使它们可以手动控制，包括：

• Date
• setTimeout/clearTimeout
• setInterval/clearInterval
• requestAnimationFrame/cancelAnimationFrame
• requestIdleCallback/cancelIdleCallback
• performance
• Event.timeStamp

代码示例：

1. 测试预定义时间

有时你只需要伪造Date.now的值，同时保持计时器的正常运行。这样，时间就会自然流逝，但Date.now始终返回一个固定值。

# 初始化时钟并设置固定时间，然后访问页面
page.clock.install(time=datetime.datetime(2024, 2, 2, 8, 0, 0))
page.goto("http://localhost:3333")
 
# 执行一些操作并验证页面状态
# ...

2. 测试非活动时间监控

非活动时间监控是Web应用程序中的常见功能，它会在用户停止活动一段时间后自动登出用户。测试此功能可能很棘手，因为你需要等待很长时间才能看到效果。但借助Clock功能，你可以加速时间并快速测试此功能。

# 安装时钟并访问页面
page.clock.install()
page.goto("http://localhost:3333")
 
# 与页面进行交互（例如点击按钮）
page.get_by_role("button").click()
 
# 快进时间5分钟，模拟用户未进行任何操作的情况
page.clock.fast_forward("05:00")
 
# 验证用户是否已被自动登出
expect(page.get_by_text("You have been logged out due to inactivity.")).to_be_visible()

3. 手动逐帧运行时间

在极少数情况下，你可能希望手动逐帧运行时间，并在过程中触发所有计时器和动画帧，以实现对时间流逝的精细控制。

# 初始化时钟并设置特定时间，然后访问页面
page.clock.install(time=datetime.datetime(2024, 2, 2, 8, 0, 0, tzinfo=datetime.timezone.pst))
page.goto("http://localhost:3333")
 
# 暂停时间流动，停止计时器，现在你可以手动控制页面时间
page.clock.pause_at(datetime.datetime(2024, 2, 2, 10, 0, 0))
 
# 手动逐帧运行时间，并验证页面状态
page.clock.run_for(2000)  # 时间更新2秒
expect(page.get_by_test_id("current-time")).to_have_text("2/2/2024, 10:00:02 AM")

通过Playwright的Clock功能，你可以更高效地测试与时间相关的应用程序功能，而无需等待实际时间的流逝。