fix: end-to-end test complete todo app

Author: bahmutov

.gitignore

@@ -1,3 +1,5 @@
 node_modules/
 .DS_Store
 npm-debug.log
+apps/todo-app-bundle.umd.js
+apps/todo-app-bundle.umd.js.map

README.md

@@ -71,7 +71,8 @@ Start Cypress using `$(npm bin)/cypress open` and execute the spec. You have ful
 * [src/index.js](src/index.js) the main file implementing `mount`
 * [components](components) different Hyper components for testing
 * [actions](actions) pure actions functions used from components and tests
-* [cypress/integration](cypress/integration) example spec files showing  various test situations
+* [apps](apps) one or more complete bundled applications
+* [cypress/integration](cypress/integration) example spec files showing various test situations
 
 See video of tests running on CI on the project's [Cypress Dashboard][cypress dashboard url]
 
@@ -81,9 +82,11 @@ See video of tests running on CI on the project's [Cypress Dashboard][cypress da
 - [components without and with actions](cypress/integration/hello-world-component-spec.js)
 - [single TodoItem component](cypress/integration/todo-item-spec.js)
 - [entire TodoList component](cypress/integration/todo-list-spec.js)
+- [TodoMVC application E2E test](cypress/integration/todo-app-e2e.js) for [apps/todo.html](apps/todo.html)
 
 ## Package scripts
 
+* `npm run build` bundles complete applications if you want to run tests against full applications
 * `npm run cy:open` starts Cypress GUI, which is great for TDD mode
 * `npm run cy:run` runs Cypress headlessly, testing all specs. Same command [runs on CI](.travis.yml) with additional `--record` argument to record the run and send to the [Cypress Dashboard][cypress dashboard url]
 

cypress/integration/todo-app-e2e.js

@@ -0,0 +1,44 @@
+/* eslint-env mocha */
+describe('Todo App E2E', () => {
+  beforeEach(() => {
+    // note this is end-to-end test for entire applicsation
+    // instead of loading individusl components
+    // we are just visiting a page - we assume the
+    // application has been bundled, loaded and initialized
+    cy.visit('apps/todo.html')
+  })
+
+  it('loads Todo app', () => {
+    cy.contains('h1', 'Todo')
+  })
+
+  it('shows 2 todos', () => {
+    cy.get('.todo').should('have.length', 2)
+  })
+
+  it('toggles second todo several times', () => {
+    cy
+      .get('.todo')
+      .eq(1)
+      .click()
+      .click()
+      .click()
+      .find('.toggle')
+      .should('be.checked')
+  })
+
+  it('completes first todo', () => {
+    cy
+      .get('.todo')
+      .first()
+      .click()
+      .find('.toggle')
+      .should('be.checked')
+    // second item is still not checked
+    cy
+      .get('.todo')
+      .eq(1)
+      .find('.toggle')
+      .should('not.be.checked')
+  })
+})