javascript - 如何验证赛普拉斯中的错误消息？

Question

我是 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 ')

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

请在此处查看 屏幕截图 UI 和元素的屏幕截图

Answer 1

您可以通过产生元素并获取其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 ');
})

你应该在这里阅读更多关于它的信息。

Answer 2

您#shadow-root在图像中有一个，请查看.shadow() 示例。

其中之一应该工作

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 ');