This is a small React app I've made, to serve as a sandbox to test various functionalities of Cypress.
Specifically, the app contains:
- Two API calls to the Hacker News API; one to get a list of the current top stories, and then another to get details on the first story retrieved from the previous API call.
- An event sandbox, containing an
<input />
with some event listeners added. When the input detects certain events (onFocus
,onBlur
andonKeyUp
), it adds a log to messages in the section next to it.
These functionalities make it possible to test the following in Cypress:
- Assertions
- Browser events
- External links
- Fixtures
- Commands
- Plugins
- Clone the repo locally
- Run
npm i
to install the dependencies
- Run
npm start
to start the app atlocalhost:3000
. - In a separate Terminal instance, run
npm run cy:open
to open Cypress' UI.- Alternatively,
npm run cy:run
will run all Cypress tests in one go, with recordings and screenshots
- Alternatively,
Note: I recommend using iTerm or Hyper to run separate Terminal instances in split-screen.