问题在标题中给出,即访问其父项被隐藏的元素.问题是,根据cypress.io文档 :
一个元素被认为是隐藏的,如果:
- 它的宽度或高度为0.
- 它的CSS属性(或祖先)是visibility:hidden.
- 它的CSS属性(或祖先)是display:none.
- 它的CSS属性是位置:固定,它是屏幕外或掩盖.
但是我正在使用的代码要求我单击其父级被隐藏的元素,而元素本身是可见的.
因此,每次我尝试单击该元素时,都会引发错误读取:
CypressError:超时重试:预期'<mdc-select-item #mdc-select-item-4.mdc-list-item>'为'可见'
此元素'<mdc-select-item #mdc-select-item-4.mdc-list-item>'不可见,因为其父元素'<mdc-select-menu.mdc-simple-menu.mdc-select__menu>'有CSS属性:'display:none'
我正在使用的元素是一个dropdown item写的pug.该元素是angular-mdc-web中定义的组件,它使用mdc-select下拉菜单mdc-select-item及其元素(项),这是我必须访问的.
类似结构的示例代码:
//pug
mdc-select(placeholder="installation type"
'[closeOnScroll]'="true")
mdc-select-item(value="false") ITEM1
mdc-select-item(value="true") ITEM2
Run Code Online (Sandbox Code Playgroud)
在上面,ITEM1是我必须访问的元素.我这样做cypress.io如下:
//cypress.io
// click on the dropdown menu to show the dropdown (items)
cy.get("mdc-select").contains("installation type").click();
// try to access ITEM1
cy.get('mdc-select-item').contains("ITEM1").should('be.visible').click();
Run Code Online (Sandbox Code Playgroud)
试过{force:true}强迫项目点击,但没有运气.尝试使用{enter}父按钮上的按键选择项目mdc-select,但再次没有运气,因为它抛出:
CypressError:cy.type()只能在textarea或:text上调用.您的主题是:<mdc-select-label class ="mdc-select__selected-text">选择... </ mdc-select-label>
也尝试使用该select命令,但它不可能,因为赛普拉斯引擎无法将元素识别为 …