Cypress测试中如何验证页面文本是否带有删除线效果

首先修正你原有测试代码的语法问题：示例中断言的价格字符串末尾错用了反引号，引号不匹配会直接导致代码运行报错，先把这处改成成对的单/双引号。

你之前用cy.get('#normalprice span s')选择器匹配失败，核心原因通常是两类：

• 页面的删除线效果不是通过<s>语义标签实现，而是给普通元素加了text-decoration: line-through的CSS样式，DOM里根本不存在s子元素，自然匹配不到
• 标签层级写反，比如实际DOM是<s>标签包裹<span>，而非<span>嵌套<s>，选择器层级写错会导致匹配失败

下面给两种可落地的校验方案，优先推荐通用的CSS校验方案，不会受DOM结构调整影响：

方案1：通用CSS样式校验（推荐，覆盖所有删除线实现方式） #

不管开发是用<s>、<del>这类语义标签实现删除线，还是直接给普通价格元素加CSS删除线样式，浏览器最终渲染时的计算样式都会包含line-through属性，直接校验这个属性的方案兼容性最好，不会因为前端改了DOM层级就导致用例失败：

// 校验旧价格带删除线
cy.get('#normalprice span')
  .should('have.text', '600.00€')
  .invoke('css', 'text-decoration-line')
  .should('include', 'line-through')

// 校验新价格无删除线
cy.get('#newprice') // 替换为页面对应新价格的选择器即可
  .should('have.text', '499.00€')
  .invoke('css', 'text-decoration-line')
  .should('not.include', 'line-through')

注意：不要用text-decoration复合属性做断言，不同浏览器对这个复合属性的返回值格式有差异，单独校验text-decoration-line兼容性最好。

方案2：语义标签校验（仅适用于明确用/标签实现删除线的场景） #

// 举个例子：如果实际结构是s标签外层包span，选择器就改成s span
cy.get('#normalprice s')
  .should('be.visible')
  .and('contain.text', '600.00€')

// 同时确认新价格没有被s标签包裹
cy.get('#newprice')
  .find('s')
  .should('not.exist')