javascript - Cypress - find() 和 within() 方法之间的区别

标签 javascript cypress cypress-testing-library

使用这两种方法有什么区别:


cy.get('.wtv').find('.sub-wtv');

cy.get('.wtv').within(() => {cy.get('.sub-wtv');});

来自文档
https://docs.cypress.io/api/commands/find.html
https://docs.cypress.io/api/commands/within.html

它们都允许我们使用“子 DOM”,我们可以在其中做任何我们想做的事情,比如搜索特定元素并声明它。

最佳答案

.find() 用于单个元素的搜索,但仅将您的操作限制在该元素上

.within() 让您可以更改搜索子元素的范围并直接使用 cy.get('subelementSelector') 调用它们,也可以使用他们。不利的一面是,您不能从父元素范围之外调用元素。

第三种方式是then . cy.get('elementSelector').then(element=>{//some code}) - 这允许您将元素传递给函数以供使用。您可以使用 cy.get(element).find('subelementSelector') 搜索子元素。您也可以对位于父元素范围之外的元素使用常用命令。这有更长的语法,但范围更大。

编辑: 澄清 .find() - 允许单个使用元素 .within(passedFunction()=>{}) - 将passedFunction的DOM元素的范围更改为子元素 .then(element=>{}) - 不改变范围,但创建变量的 JQ 变量,可在 then 函数中使用 cy.get('parentSelector childSelector') - 是获得与 .find()

相同结果的 css 方式

关于javascript - Cypress - find() 和 within() 方法之间的区别,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/64917726/

相关文章:

cypress - 从命令行运行时,如何告诉 Cypress 隐藏 Chrome?

javascript - Cypress : `cy.contains` 和 `cy. findByText` 有什么区别

javascript - 如何使用 Cypress 和 @testing-library/cypress 测试复选框切换,

javascript - 是否可以在同一个盒子上安装多个 framework7?

javascript - 使用小时和分钟显示问候语(早上/下午/晚上)

javascript - Javascript 和 moment.js 中的用户输入日期比较

angular - Cypress 安装因代理设置而失败

javascript - Cypress - 如何在 iframe 中的元素之间切换

javascript - Jest : how to mock console when it is used by a third-party-library?