Question

我开始玩cypress，我需要选择一个这样的链接：

<table cellSpacing="0" cellPadding="0" width="100%" border="0" class="ToolBarBkg">
  <tbody>
    <tr>
      <td class="ContentLeftLinks" align="right" width="98%" height="40" nowrap>
        &nbsp;
        <a href="javascript:FireEvent('Agregar')" style="COLOR: black; font-weight: normal" tabindex="-1">
          <IMG src="/metassc/images/toolbar/AltaOn.gif" align="absmiddle" border=0> Alta
        </a>
        &nbsp;

        <a href="javascript:FireEvent('Eliminar')" style="COLOR: black; font-weight: normal" tabindex="-1">

          <IMG src="/metassc/images/toolbar/BajaOn.gif" align="absmiddle" border=0> Baja
        </a>

在this page之后，我已经尝试了以下方法：

cy.contains('a[href~=Agregar]')
cy.contains('a[href*="Agregar"]')
cy.contains('a:contains("^Agregar$") ')
cy.contains('a:contains("^Alta$") ')

但是它们似乎都不起作用。有想法吗？

Answer 1

cy.contains()也可以接受两个参数：

cy.contains('a', 'Alta')

这将获得第一个a元素，其中包含文本Alta

Answer 2

有一个受欢迎的图书馆> cypress-testing-library

这使得通过文本，标题，值，替代文本等获取选择器非常容易。

对于您的问题，您可以仅使用此库中的 getByText 方法： cy.getByText('Agregar').click()

Answer 3

这似乎可行，必须使用cy.get而不是包含

cy.get('a[href*="Agregar"]')
  .click()

Answer 4

Another way is, you could probably drill down till <a> tag via parent() and find() method in cypress;

cy.get('a:contains("Agregar")').parents('.ToolBarBkg').find('tbody').find('tr').find('td').find('a').contains("Agregar").click();

cypress：css选择器，可通过文本选择锚点

4 个答案: