Skip to content
This repository was archived by the owner on Feb 28, 2023. It is now read-only.

Commit e1c1f1f

Browse files
committed
add example with readfile retries
1 parent 69b1ea6 commit e1c1f1f

File tree

4 files changed

+131
-102
lines changed

4 files changed

+131
-102
lines changed
Lines changed: 116 additions & 96 deletions
Original file line numberDiff line numberDiff line change
@@ -1,115 +1,135 @@
11
/// <reference types="cypress" />
2-
beforeEach(function resetData() {
3-
cy.request('POST', '/reset', {
4-
todos: []
2+
describe('retry-ability', () => {
3+
beforeEach(function resetData() {
4+
cy.request('POST', '/reset', {
5+
todos: []
6+
})
57
})
6-
})
78

8-
beforeEach(function visitSite() {
9-
cy.visit('/')
10-
})
9+
beforeEach(function visitSite() {
10+
cy.visit('/')
11+
})
1112

12-
it('shows UL', function() {
13-
cy.get('.new-todo')
14-
.type('todo A{enter}')
15-
.type('todo B{enter}')
16-
.type('todo C{enter}')
17-
.type('todo D{enter}')
18-
cy.contains('ul', 'todo A')
19-
// confirm that the above element
20-
// 1. is visible
21-
.should('be.visible')
22-
// 2. has class "todo-list"
23-
.and('have.class', 'todo-list')
24-
// 3. css property "list-style-type" is equal "none"
25-
.and('have.css', 'list-style-type', 'none')
26-
})
13+
it('shows UL', function() {
14+
cy.get('.new-todo')
15+
.type('todo A{enter}')
16+
.type('todo B{enter}')
17+
.type('todo C{enter}')
18+
.type('todo D{enter}')
19+
cy.contains('ul', 'todo A')
20+
// confirm that the above element
21+
// 1. is visible
22+
.should('be.visible')
23+
// 2. has class "todo-list"
24+
.and('have.class', 'todo-list')
25+
// 3. css property "list-style-type" is equal "none"
26+
.and('have.css', 'list-style-type', 'none')
27+
})
2728

28-
it('shows UL - TDD', function() {
29-
cy.get('.new-todo')
30-
.type('todo A{enter}')
31-
.type('todo B{enter}')
32-
.type('todo C{enter}')
33-
.type('todo D{enter}')
34-
cy.contains('ul', 'todo A').should($ul => {
35-
// use TDD assertions
36-
// $ul is visible
37-
// $ul has class "todo-list"
38-
// $ul css has "list-style-type" = "none"
39-
assert.isTrue($ul.is(':visible'), 'ul is visible')
40-
assert.include($ul[0].className, 'todo-list')
41-
assert.isTrue($ul.hasClass('todo-list'))
42-
assert.equal($ul.css('list-style-type'), 'none')
29+
it('shows UL - TDD', function() {
30+
cy.get('.new-todo')
31+
.type('todo A{enter}')
32+
.type('todo B{enter}')
33+
.type('todo C{enter}')
34+
.type('todo D{enter}')
35+
cy.contains('ul', 'todo A').should($ul => {
36+
// use TDD assertions
37+
// $ul is visible
38+
// $ul has class "todo-list"
39+
// $ul css has "list-style-type" = "none"
40+
assert.isTrue($ul.is(':visible'), 'ul is visible')
41+
assert.include($ul[0].className, 'todo-list')
42+
assert.isTrue($ul.hasClass('todo-list'))
43+
assert.equal($ul.css('list-style-type'), 'none')
44+
})
4345
})
44-
})
4546

46-
it('every item starts with todo', function() {
47-
cy.get('.new-todo')
48-
.type('todo A{enter}')
49-
.type('todo B{enter}')
50-
.type('todo C{enter}')
51-
.type('todo D{enter}')
52-
cy.get('.todo label').should($labels => {
53-
// confirm that there are 4 labels
54-
// and that each one starts with "todo-"
55-
expect($labels).to.have.length(4)
47+
it('every item starts with todo', function() {
48+
cy.get('.new-todo')
49+
.type('todo A{enter}')
50+
.type('todo B{enter}')
51+
.type('todo C{enter}')
52+
.type('todo D{enter}')
53+
cy.get('.todo label').should($labels => {
54+
// confirm that there are 4 labels
55+
// and that each one starts with "todo-"
56+
expect($labels).to.have.length(4)
5657

57-
$labels.each((k, el) => {
58-
expect(el.textContent).to.match(/^todo /)
58+
$labels.each((k, el) => {
59+
expect(el.textContent).to.match(/^todo /)
60+
})
5961
})
6062
})
61-
})
6263

63-
it('has 2 items', () => {
64-
cy.get('.new-todo') // command
65-
.type('todo A{enter}') // command
66-
.type('todo B{enter}') // command
67-
cy.get('.todo-list li') // command
68-
.should('have.length', 2) // assertion
69-
})
64+
it('has 2 items', () => {
65+
cy.get('.new-todo') // command
66+
.type('todo A{enter}') // command
67+
.type('todo B{enter}') // command
68+
cy.get('.todo-list li') // command
69+
.should('have.length', 2) // assertion
70+
})
7071

71-
it('has the right label', () => {
72-
cy.get('.new-todo').type('todo A{enter}')
73-
cy.get('.todo-list li') // command
74-
.find('label') // command
75-
.should('contain', 'todo A') // assertion
76-
})
72+
it('has the right label', () => {
73+
cy.get('.new-todo').type('todo A{enter}')
74+
cy.get('.todo-list li') // command
75+
.find('label') // command
76+
.should('contain', 'todo A') // assertion
77+
})
7778

78-
// flaky test - can pass or not depending on the app's speed
79-
// to make the test flaky add the timeout
80-
// in todomvc/app.js "addTodo({ commit, state })" method
81-
it('has two labels', () => {
82-
cy.get('.new-todo').type('todo A{enter}')
83-
cy.get('.todo-list li') // command
84-
.find('label') // command
85-
.should('contain', 'todo A') // assertion
79+
// flaky test - can pass or not depending on the app's speed
80+
// to make the test flaky add the timeout
81+
// in todomvc/app.js "addTodo({ commit, state })" method
82+
it('has two labels', () => {
83+
cy.get('.new-todo').type('todo A{enter}')
84+
cy.get('.todo-list li') // command
85+
.find('label') // command
86+
.should('contain', 'todo A') // assertion
8687

87-
cy.get('.new-todo').type('todo B{enter}')
88-
cy.get('.todo-list li') // command
89-
.find('label') // command
90-
.should('contain', 'todo B') // assertion
91-
})
88+
cy.get('.new-todo').type('todo B{enter}')
89+
cy.get('.todo-list li') // command
90+
.find('label') // command
91+
.should('contain', 'todo B') // assertion
92+
})
9293

93-
it('solution 1: merges queries', () => {
94-
cy.get('.new-todo').type('todo A{enter}')
95-
cy.get('.todo-list li label') // command
96-
.should('contain', 'todo A') // assertion
94+
it('solution 1: merges queries', () => {
95+
cy.get('.new-todo').type('todo A{enter}')
96+
cy.get('.todo-list li label') // command
97+
.should('contain', 'todo A') // assertion
9798

98-
cy.get('.new-todo').type('todo B{enter}')
99-
cy.get('.todo-list li label') // command
100-
.should('contain', 'todo B') // assertion
101-
})
99+
cy.get('.new-todo').type('todo B{enter}')
100+
cy.get('.todo-list li label') // command
101+
.should('contain', 'todo B') // assertion
102+
})
103+
104+
it('solution 2: alternate commands and assertions', () => {
105+
cy.get('.new-todo').type('todo A{enter}')
106+
cy.get('.todo-list li') // command
107+
.should('have.length', 1) // assertion
108+
.find('label') // command
109+
.should('contain', 'todo A') // assertion
102110

103-
it('solution 2: alternate commands and assertions', () => {
104-
cy.get('.new-todo').type('todo A{enter}')
105-
cy.get('.todo-list li') // command
106-
.should('have.length', 1) // assertion
107-
.find('label') // command
108-
.should('contain', 'todo A') // assertion
111+
cy.get('.new-todo').type('todo B{enter}')
112+
cy.get('.todo-list li') // command
113+
.should('have.length', 2) // assertion
114+
.find('label') // command
115+
.should('contain', 'todo B') // assertion
116+
})
109117

110-
cy.get('.new-todo').type('todo B{enter}')
111-
cy.get('.todo-list li') // command
112-
.should('have.length', 2) // assertion
113-
.find('label') // command
114-
.should('contain', 'todo B') // assertion
118+
it('retries reading the JSON file', () => {
119+
// note cy.readFile retries reading the file until the should(cb) passes
120+
// https://on.cypress.io/readilfe
121+
cy.get('.new-todo')
122+
.type('todo A{enter}')
123+
.type('todo B{enter}')
124+
.type('todo C{enter}')
125+
.type('todo D{enter}')
126+
cy.readFile('./todomvc/data.json').should(data => {
127+
expect(data).to.have.property('todos')
128+
expect(data.todos).to.have.length(4, '4 saved items')
129+
expect(data.todos[0], 'first item').to.include({
130+
title: 'todo A',
131+
completed: false
132+
})
133+
})
134+
})
115135
})

cypress/integration/11-retry-ability/spec.js

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -83,3 +83,12 @@ it('solution 2: alternate commands and assertions', () => {
8383
cy.get('.new-todo').type('todo B{enter}')
8484
// ?
8585
})
86+
87+
it('retries reading the JSON file', () => {
88+
// add N items via UI
89+
// then read the file ./todomvc/data.json
90+
// and assert it has the N items and the first item
91+
// is the one entered first
92+
// note cy.readFile retries reading the file until the should(cb) passes
93+
// https://on.cypress.io/readilfe
94+
})

package-lock.json

Lines changed: 5 additions & 5 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

todomvc/app.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -88,7 +88,7 @@
8888
axios.post('/todos', todo).then(() => {
8989
commit('ADD_TODO', todo)
9090
})
91-
}, 0)
91+
}, 0) // TODO: read the delay from the page search parameter like ?delay=2000
9292
},
9393
addEntireTodo({ commit }, todoFields) {
9494
const todo = {

0 commit comments

Comments
 (0)