/testing-workshop

A workshop for learning how to test JavaScript applications

Primary LanguageJavaScriptMIT LicenseMIT

Testing Workshop

👋 hi there! My name is Kent C. Dodds! This is a workshop repo to teach you about testing JavaScript applications.

slides-badge chat-badge Build Status Dependencies MIT License All Contributors

PRs Welcome Donate Code of Conduct Watch on GitHub Star on GitHub Tweet

Thank You

Big thanks to the RealWorld project from GoThinkster. This project is a copy of the Node implementation and the React implementation of the RealWorld project.

Also thank you to all the contributors

Topics covered

  1. Unit Testing with Jest
  2. Integration Testing with Jest
  3. End to End (E2E) Testing with Cypress

We'll mention other forms of testing, but these are the types we'll focus on and learn in this workshop. We'll learn about the benefits (and tradeoffs) of TDD. We'll learn how to configure the tools and why, when, where, and what to test.

Project

System Requirements

  • git v2.10.2 or greater
  • NodeJS v6.9.5 or greater
  • yarn v0.20.3 or greater (or npm v4.2.0 or greater)
  • MongoDB v3.4.2 or greater

All of these must be available in your PATH. To verify things are set up properly, you can run this:

git --version
node --version
yarn --version
mongod --version

If you have trouble with any of these, learn more about the PATH environment variable and how to fix it here for windows or mac/linux.

Setup

After you've made sure to have the correct things (and versions) installed, you should be able to just run a few commands to get set up:

git clone https://github.com/kentcdodds/testing-workshop.git
cd testing-workshop
npm run setup --silent

This may take a few minutes. If you get any errors, please read the error output and see whether there's any instructions to fix things and try again. If you're still getting errors or need any help at all, then please file an issue.

Note: You might see this:

Cypress Network issue

I'm not sure how to prevent this from happening (suggestions appreciated!) but it happens every time you run the e2e tests. Just hit Allow (super annoying). Sorry about that 😞

Running the app

To get the app up and running (and really see if it worked), run:

npm start dev

This should start mongod, the api server, and the client server all at the same time. Your browser should open up automatically to http://localhost:8080 (if it doesn't, just open that yourself) and you should be able to start messing around with the app.

Here's what you should be looking at:

Conduit Screenshot

If this fails at any point for you, please first see Troubleshooting and if you still can't get it working, make an issue.

To stop all the servers, hit Ctrl + C.

Protip: we're using nps in this project. If you want to type less, then you can install nps globally: yarn global add nps (or npm i -g nps) and then you can run nps instead of npm start

Troubleshooting

npm dev command not working

If it doesn't work for you, you can start each of these individually yourself:

npm start dev.mongo
npm start dev.api
npm start dev.client

verify.js saying something's wrong with mongo

The mongod binary needs to be available in your path for you to run mongod from the command line (which is what this project's scripts does for you). Learn how to do this on windows or on mac.

Note: you'll need to open a new terminal/command prompt window after you've done this.

Structure

This project has a bit of a unique setup. Normally you'll have just a single package.json at the root of your repository, but to simplify setup I've included both the api and client projects in a single repository. The root of the project has a package.json as does api, and client. Most of our time working on tooling and running tests will be in one of these sub-directories (with the exception of the E2E tests).

LICENSE

The original projects are licensed as noted in their respective package.json files. The rest of this project is MIT licensed.

Contributors

Thanks goes to these wonderful people (emoji key):


Thinkster

💻

Kent C. Dodds

💻 📖 🚇 ⚠️

Callum Mellor-Reed

🐛 💻

Eric McCormick

🐛 💻

Paul Falgout

💻 📖

This project follows the all-contributors specification. Contributions of any kind welcome!