使用Cypress选中task__inner下两类元素完成点击的问题求解

问题根因 #

你的判断逻辑存在错误：

• 调用$ele.hasClass('task__options')是在判断.task__inner元素自身是否携带task__options类，但根据你的业务描述，task__options是.task__inner内部的子元素类，而非父元素自身的类，所以这个判断永远返回false，自然只会走else分支。
• 另外你在within回调里直接用cy.get()虽然默认也会限定在当前根元素下查找，但用find方法的逻辑会更清晰，也更符合层级查找的使用习惯。同时原代码没有用到步骤定义传入的task参数，无法匹配对应文本的选项。

修正方案 #

调整判断逻辑，改为检查当前.task__inner内部是否存在.task__options子元素，存在就点击该类对应文本的元素，否则点击.ap-option类对应文本的元素即可。

修正后代码 #

Then('I click the task option {string}', (task: string) => {
    cy.get('.task__inner').within(($ele) => {
        // 检查当前task__inner内部是否存在task__options子元素
        if ($ele.find('.task__options').length > 0) {
            cy.wrap($ele).find('.task__options').contains(task).click();
            // 不需要匹配文本直接点击的话，去掉.contains(task)即可
        } else {
            cy.wrap($ele).find('.ap-option').contains(task).click();
        }
    });
});

内容的提问来源于stack exchange，提问作者Jasper Slokker