无法从自动完成赛普拉斯中选择

Question

自动完成字段

it('Test to grab the autocomplete values', ()=> {
cy.visit('https://jqueryui.com/autocomplete/');
cy.get('#tags').type('c')
cy.get('#ui-id-2').first().click()
})
})

显示它被点击了，但没有被选中

Answer 1

我可以看到有一个iframe，处理iframe你必须使用代码:

cy.get('iframe.demoframe').its('0.contentDocument').its('body')

所以你的代码应该是这样的:

cy.visit('https://jqueryui.com/autocomplete/')
cy.get('iframe.demo-frame')
.its('0.contentDocument')
.its('body')
.find('#tags')
.type('c')
cy.get('iframe.demo-frame')
.its('0.contentDocument')
.its('body')
.find('li')
.first()
.click()

现在如果你想进一步压缩你的脚本，你可以使用Cypress自定义命令。转到cypress/support/command.js，写入:

Cypress.Commands.add('getIframe', (iframe) => {
return cy
.get(iframe)
.its('0.contentDocument.body')
.should('be.visible')
.then(cy.wrap)
})

你的测试将是:

cy.visit('https://jqueryui.com/autocomplete/')
cy.getIframe('iframe.demo-frame').find('#tags').type('c')
cy.getIframe('iframe.demo-frame').find('li').first().click()

Answer 2

您的代码基本上没问题，但您需要在iframe

内执行。

cy.visit('https://jqueryui.com/autocomplete/')
cy.get('iframe.demo-frame')
.its('0.contentDocument.body')
.within(() => {
cy.get('#tags').type('c')
cy.get('#ui-id-2').first().click()
cy.get('#tags').should('have.value', 'ActionScript')
})