Cypress如何校验页面不存在指定格式当日日期 可否使用date-fns

原生JS实现（无需第三方依赖） #

你原有代码存在两处问题：

• 直接传入new Date()生成的Date对象给cy.contains()是无效的，该命令只接收字符串、正则类型的匹配目标，Date对象默认转字符串会输出带时区、时间的完整长文本，和你要匹配的「June 21」格式完全不匹配
• 断言写法有误，Cypress中校验不可见的标准链式写法是not.be.visible，你写的not.visible缺少中间的be链式调用

可以直接用浏览器原生的toLocaleDateString方法生成目标格式的日期字符串，无需手动维护月份映射数组，示例代码如下：

// 生成「月份全称+空格+当月日期」格式的当日日期，例如 June 21
const todayStr = new Date().toLocaleDateString('en-US', {
  month: 'long',
  day: 'numeric'
})

// 校验页面中匹配该日期的元素不可见
cy.contains(todayStr).should('not.be.visible')

补充说明：如果你要校验的是该日期对应的元素完全不存在于DOM树，而非存在但被样式隐藏，请把断言替换为.should('not.exist')，根据实际业务场景选择即可。

date-fns工具库使用说明 #

完全可以用date-fns这类日期处理库，只要你在项目中提前安装对应依赖即可，相比原生API，date-fns的格式串写法更直观，多语言、自定义格式的拓展性更强。

• 先安装依赖：

npm install date-fns --save-dev
# 如果你用yarn可执行 yarn add date-fns --dev

• 测试代码写法：

// 引入date-fns的format方法
import { format } from 'date-fns'

// 用格式串MMMM d直接生成目标格式日期，MMMM代表月份全称，d代表无前导零的日期
const todayStr = format(new Date(), 'MMMM d')

cy.contains(todayStr).should('not.be.visible')

如果你的被测页面是中文环境，显示格式为「六月 21」，只需要对应调整格式化的locale配置即可：原生API替换toLocaleDateString的第一个参数为zh-CN，date-fns引入中文locale包传入format方法第三个参数就行。

内容的提问来源于stack exchange，提问作者alex97cristian1551