赛普拉斯点击省略号但不打开弹出窗口

Question

问题 - 单击 table 上的省略号会打开一个小弹出窗口，Cypress 单击该元素但不会打开弹出窗口。任何帮助将不胜感激。

应用：VueKendo网格

柏树运行


    <td 
     data-v-cdc7d78e="">
     <div data-v-cdc7d78e="" 
          class="d-flex flex-row-reverse">
          <svg data-v-cdc7d78e="" 
               xmlns="http://www.w3.org/2000/svg" data-icon="ellipsis-vertical" 
               data-prefix="fas" 
               aria-hidden="true" 
               focusable="false" 
               role="img" 
               viewBox="0 0 128 512" 
               class="svg-inline--fa fa-ellipsis-vertical snapshot-menu-button" 
               id="snapshot-menu-button-101">
               <path fill="currentColor" 
                     d="M128 64c0-35.39-28.62-64-64-64S0 28.61 0 64s28.62 64 64 64S128 99.39 128 64zM128 256c0-35.39-28.62-64-64-64S0 220.6 0 256s28.62 64 64 64S128 291.4 128 256zM128 448c0-35.39-28.62-64-64-64s-64 28.61-64 64s28.62 64 64 64S128 483.4 128 448z">
               </path>
          </svg>
          <!---->
        </div>
    </td>

Popover - 单击省略号后

    <div
      id="snapshot-menu"
      role="tooltip"
      tabindex="-1" 
      data-v-cdc7d78e class="popover b-popover-left dropdown-popover"
      x-placement="left"
      style="position: absolute; will-change: transform; top: 0px; transform:translate3d(!009px, 371px,0px);"
    <div>

我尝试过的东西

cy.get('#snapshot-menu-button-4').invoke('attr', 'focusable', 'true').click({force: true})

cy.get('[aria-rowindex="70"]').trigger('focus').then(() => {
    cy.get('#snapshot-menu-button-4').click({force: true});
})

cy.get('[aria-rowindex="70"]').click().then(() => {
    cy.get('#snapshot-menu-button-4').click({force: true});
});

cy.get('[aria-rowindex="70"]').trigger('mouseover').then(() => {
    cy.get('#snapshot-menu-button-4').click({force: true});
})

Answer 1

ID #snapshot-menu-button-4 位于可能没有点击处理程序的 <svg> 上。

尝试任一父元素

cy.get('#snapshot-menu-button-4')
  .parent()
  .click()

// or

cy.get('#snapshot-menu-button-4')
  .parents('td')
  .click()

Answer 2

Kendo Vue Grid 有一个允许自定义模板的单元格属性。根据 Vue 模板的构建方式，您可能需要进一步调查该问题。如果使用 bootstrap，问题可能是 the popover element. By default, the popover is triggered by a click event. However, if you set the triggers attribute, you override the default functionality. So you will need to add 'click' to the triggers attribute

赛普拉斯点击省略号但不打开弹出窗口

Cypress clicks on ellipsis but does not open popover

ui-automation

kendo-grid

cypress