Many applications have features that can be used with slight variations. Instead of maintaining multiple tests with nearly identical code, we can take advantage of the JavaScript runtime and use normal data structures and plain old JavaScript to test and make assertions for multiple interactions in a single test.

we have a new fixture:

// cypress/fixtures/mixed_todos.json

[
{ "id": 1, "name": "One", "isComplete": false },
{ "id": 2, "name": "Two", "isComplete": true },
{ "id": 3, "name": "Three", "isComplete": true },
{ "id": 4, "name": "Four", "isComplete": false }
]

In the app, when we click different visibility filter, the list will change accordingly.

To test this behavior in clean code, we can use '.wrap().each()' to test it

    it('should Footer todos', function () {
cy.seedAndVisit('fixture:mixed_todos'); const filters = [
{ link: 'Active', expectedLength: 2 },
{ link: 'Completed', expectedLength: 2 },
{ link: 'All', expectedLength: 4 }
]; cy.wrap(filters)
.each(filter => {
// contains(): find the element contains the text
cy.contains(filter.link).click();
cy.get('.todo-list li').should('have.length', filter.expectedLength);
})
});

[Cypress] Test Variations of a Feature in Cypress with a data-driven Test的更多相关文章

  1. [Cypress] Create Aliases for DOM Elements in Cypress Tests

    We’ll often need to access the same DOM elements multiple times in one test. Your first instinct mig ...

  2. [Cypress] Test React’s Controlled Input with Cypress Selector Playground

    React based applications often use controlled inputs, meaning the input event leads to the applicati ...

  3. [Cypress] Interact with Hidden Elements in a Cypress Test

    We often only show UI elements as a result of some user interaction. Cypress detects visibility and ...

  4. [Cypress] Wait for XHR Responses in a Cypress Test

    When testing interactions that require asynchronous calls, we’ll need to wait on responses to make s ...

  5. [Cypress] Use the Most Robust Selector for Cypress Tests

    Which selectors your choose for your tests matter, a lot. In this lesson, we'll see the recommended ...

  6. Cypress系列(0)- 如何学习 Cypress

    如果想从头学起Cypress,可以看下面的系列文章哦 https://www.cnblogs.com/poloyy/category/1768839.html 前言 Cypress 未来很有可能会火的 ...

  7. Cypress系列(13)- 详细介绍 Cypress Test Runner

    如果想从头学起Cypress,可以看下面的系列文章哦 https://www.cnblogs.com/poloyy/category/1768839.html 前言 Test Runner 也叫运行器 ...

  8. 【cypress】2. 安装Cypress(windows系统),以及cypress open报错解决。

    安装cypress. 一.操作系统 先确认下你的系统,是否在cypress支持范围之内: macOS 10.9 以上 (仅64-bit) Linux Ubuntu 12.04及以上版本,Fedora ...

  9. [Cypress] install, configure, and script Cypress for JavaScript web applications -- part4

    Load Data from Test Fixtures in Cypress When creating integration tests with Cypress, we’ll often wa ...

随机推荐

  1. JavaScript--控制类名(className 属性)

    className 属性设置或返回元素的class 属性. 语法: object.className = classname 作用: 1.获取元素的class 属性 2. 为网页内的某个元素指定一个c ...

  2. 【java并发容器】并发容器之CopyOnWriteArrayList

    原文链接: http://ifeve.com/java-copy-on-write/ Copy-On-Write简称COW,是一种用于程序设计中的优化策略.其基本思路是,从一开始大家都在共享同一个内容 ...

  3. 【MySQL】二进制分发安装

    操作系统:Red Hat Enterprise Linux Server release 6.5 Mysql安装包:mysql-5.6.34-linux-glibc2.5-x86_64.tar.gz ...

  4. JS高级——歌曲管理

    1.将歌曲管理的CURD方法放到原型中 2.在构造函数中,我们只有一个属性是songList,因为音乐库不是共有的,如果将songList放入原型中,任何一个人的一次修改songList,都将把son ...

  5. (转)Hibernate关联映射——对象的三种关系

    http://blog.csdn.net/yerenyuan_pku/article/details/70148618 Hibernate关联映射——对象的三种关系 Hibernate框架基于ORM设 ...

  6. (转)Hibernate的配置详解

    http://blog.csdn.net/yerenyuan_pku/article/details/65041077 在<Hibernate快速入门>一文中,我有讲到Hibernate的 ...

  7. Java 之jdbc连接mysql数据库

    package jdbc; import java.io.InputStream; import java.sql.Connection; import java.sql.DriverManager; ...

  8. SpringMVC知识点总结一(非注解方式的处理器与映射器配置方法)

    一.SpringMVC处理请求原理图(参见以前博客) 1.  用户发送请求至前端控制器DispatcherServlet 2.  DispatcherServlet收到请求调用HandlerMappi ...

  9. 文本框、评论框原生js

    <!DOCTYPE html> <html lang="en"> <head>     <meta charset="UTF-8 ...

  10. enote笔记语言(4)(ver0.3)——“5w1h2k”分析法

    章节:“5w1h2k”分析法   what:我想知道某个“关键词(keyword)”(即,词汇.词语,或称单词,可以是概念|专业术语|.......)的定义. why:我想知道事物发生的原因.“why ...