diff --git a/README.md b/README.md index a49d92054bcd..236c244d467b 100644 --- a/README.md +++ b/README.md @@ -27,6 +27,9 @@ describe('HelloState component', () => { ## Examples -* [cypress/integration/hello-world-spec.js](cypress/integration/hello-world-spec.js) - testing the simplest React component from [src/hello-world.jsx](src/hello-world.jsx) -* [cypress/integration/hello-x-spec.js](cypress/integration/hello-x-spec.js) - testing React component with props and state [src/hello-x.jsx](src/hello-x.jsx) -* [bahmutov/calculator](https://github.com/bahmutov/calculator) tests multiple components +All components are in [src](src) folder. All tests are in [cypress/integration](cypress/integration) folder. + +* [hello-world-spec.js](cypress/integration/hello-world-spec.js) - testing the simplest React component from [hello-world.jsx](src/hello-world.jsx) +* [hello-x-spec.js](cypress/integration/hello-x-spec.js) - testing React component with props and state [hello-x.jsx](src/hello-x.jsx) +* [counter-spec.js](cypress/integration/counter-spec.js) clicks on the component and confirms the result +* separate repo [bahmutov/calculator](https://github.com/bahmutov/calculator) tests multiple components \ No newline at end of file diff --git a/cypress/integration/counter-spec.js b/cypress/integration/counter-spec.js new file mode 100644 index 000000000000..e396b0233c9c --- /dev/null +++ b/cypress/integration/counter-spec.js @@ -0,0 +1,15 @@ +import { Counter } from '../../src/counter.jsx' +import React from 'react' +import { mount } from '../../lib' + +/* eslint-env mocha */ +describe('Counter', () => { + it('counts clicks', () => { + mount() + cy.contains('count: 0') + .click() + .contains('count: 1') + .click() + .contains('count: 2') + }) +}) diff --git a/src/counter.jsx b/src/counter.jsx new file mode 100644 index 000000000000..504e94287655 --- /dev/null +++ b/src/counter.jsx @@ -0,0 +1,20 @@ +import React from 'react' + +export class Counter extends React.Component { + constructor (props) { + super(props) + this.state = { + count: 0 + } + } + + click () { + this.setState({ + count: this.state.count + 1 + }) + } + + render () { + return

count: {this.state.count}

+ } +} \ No newline at end of file