嵌套框架赛普拉斯自动化定位输入字段的问题

Question

我尝试使用下面的代码来定位输入字段，但我不断收到未定义的错误。在我看来，这是一个遗留网站，框架集相互嵌套，这使得使用 Cypress 输入或键入用户名字段变得更加复杂。

import 'cypress-iframe'

describe('Suite Name', () => {

    Cypress.on('uncaught:exception', (err, runnable) => {
        // returning false here prevents Cypress from
        // failing the test
        return false
    })


    it.only('FrameSetExample', () => {
        cy.visit("https://epay.dallascityhall.com/bdisu/public/frameset_top_html.jsp")
        
        cy.get("html > frameset > frame:nth-child(2)").then(($ele) => {
            var ifele = $ele.contents().find("#logonuidfield")
            cy.wrap(ifele).type("sample username")
        })




    })

})

当我尝试使用以下方法“框架加载”时，它会打开网页并成功检测到框架，因此陷入了其他尝试使其正常工作的困境。

    it.only('FrameSetExample', () => {
        cy.visit("https://epay.dallascityhall.com/bdisu/public/frameset_top_html.jsp")
        cy.frameLoaded("html > frameset > frame:nth-child(2)")
        

        })

Answer 1

它不是

<iframe>

，因此使用

cypress-iframe

可能是错误的路径，但赛普拉斯为

<iframe>

处理提供的通用命令很有用。

这个答案How do you select elements in aframe (not iframe)...有一些有用的代码。

唯一的主要困难是获取第二个框架（应用程序框架）并忽略导航框架。

逐步构建查询链并在每一步查看 DOM，在某一时刻您会发现两个窗口 - 必须选择第二个窗口才能进入输入字段。

cy.document().find('frameset')
  .find('frame[name="billerdirect_application"]')
  .then($frame => $frame[0].contentWindow)
  .then($window => $window[1])                // there are two windows here, take #2
  .its('document')
  .find('#logonuidfield')
  .type('Willie Nelson')
  .should('have.value', 'Willie Nelson')