如何验证赛普拉斯中的错误消息？答案

【问题标题】：How to validate a error message in cypress?如何验证赛普拉斯中的错误消息？
【发布时间】：2020-12-08 22:58:35
【问题描述】：

我是 cypress 的新手，并且一直在尝试验证单击按钮后出现在 UI 上的错误消息

我尝试了以下 3 个，但都没有成功

cy.get('pvd-system-message').should('have.text', 'SSN 123456789 not found ')

cy.contains('SSN 123456789 not found').should('be.visible')  

cy.contains('pvd-system-message', 'SSN 123456789 not found ')

任何帮助将不胜感激，谢谢！

请在此处查看屏幕截图 Screenshot of UI and elements

【问题讨论】：

标签： javascript typescript cypress cypress-cucumber-preprocessor

【解决方案1】：

图片中有#shadow-root，看看.shadow() examples。

其中一个应该可以工作

cy.get('pvd-system-message')
  .shadow()
  .find('p.message__bind')
  .contains('SSN 123456789 not found ');

cy.get('pvd-system-message')
  .shadow()
  .find('p.message__bind')
  .should('have.text', 'SSN 123456789 not found ');

cy.get('pvd-system-message')
  .shadow()
  .contains('p.message__bind', 'SSN 123456789 not found ');

【讨论】：

【解决方案2】：

您可以通过 yielding 元素并获取其 textContent 值来断言 UI 中的错误消息，如下所示：

cy.get('.message__bind').then($el => {
   const elText = $el.text(); // gets the text content

   // asserts element contains the right text
   cy.wrap(elText).should('have.text', 'SSN 123456789 not found ');
})

您应该阅读更多关于它的信息here。

【讨论】：

@RichardMatsen 是的，你完全正确！我已经更新了我的答案。我可能会补充一点，在进行断言之前我们应该.trim() 消息。你的想法是什么？
确实我注意到了尾随空格。这对.contains() 来说不是问题，但是。
感谢您回复@ManuelAbascal - 我尝试了您的解决方案，但它给了我“AssertionError：重试超时：应找到元素：.message__bind，但从未找到它。”理查德的解决方案对我有用： cy.get('pvd-system-message') .shadow() .find('p.message__bind') .contains('SSN 123456789 not found ');谢谢@RichardMatsen
@Praveen 不用担心！出于好奇，即使我的编辑不起作用？
您的代码基本上是完成.contains() 的漫长道路——除非有错字或其他错误——elText（未使用）和$text（未定义）。