kentcdodds / testing-workshop

A workshop for learning how to test JavaScript applications
http://git.io/testing-workshop
1.36k stars 708 forks source link

Testing Workshop: Ideas for format/content/resources/etc.? #1

Closed kentcdodds closed 7 years ago

kentcdodds commented 7 years ago

I definitely plan on using Jest for writing Unit tests. I plan on having a section to discuss my five minute talk "What we can learn about testing from the wheel". I'm thinking about doing some Integration/E2E testing with Cypress.io but I'm not certain there...

kentcdodds commented 7 years ago

So here an initial outline.

Background

Why do we test?

Slides briefly discussing the history of testing in general and in JavaScript. Perhaps a few stories and examples of when an automated testing saved the day or could have saved the day. (Any interesting stories would be helpful!)

How do we test?

What do we test?

Here we'll talk about a few things:

Hands on

The hands on portion will be based on an application. I'm not sure what application to use, but I'd prefer it not be an app I have to write from scratch myself. I'll probably fork it (attributing the original author) and modify it (so it'll need to be open source). Looking for a SPA that has a React frontend and an Express backend. I want something that would be intrinsically interesting to the target audience. Perhaps a game or something that uses the GitHub API. It'll need routes, authentication, some amount of CRUD. I'd also prefer that it's already set up with Babel (and maybe even Flow! Because then I could talk about all the tests you don't have to write when you have a type checker!)

Unit testing

Basic JavaScript utilities

This is the easiest starting point. We'll probably start on the backend for this.

Key takeaways:

Advanced

We'll build on the tests that we have on the backend, but start using mocking.

Key takeaways:

TDD

Here we'll add a new feature to the backend API and develop it using TDD

Key takeaways:

Frontend Testing

Here we'll take some of the more complicated UI components and test the functionality that would be challenging to cover in the E2E tests.

Key takeaways:

Integration testing

Here we'll test a full route for the API. Perhaps authentication or something that uses several modules or downstream APIs to accomplish a task. We'll talk about snapshot testing (probably with an API response).

Key takeaways:

End to End testing

Here's where we'll bring in Cypress.io and talk about the tool itself. We'll set it up and write at least one test for a full flow (the most important flow) of the application.

Key takeaways:

Conclusion

We'll conclude with an overview of the three types of testing we covered. I'll talk about where you should run your tests (perhaps if we have time I'll add a section about setting up CI with the project). I'll give a reminder that there are more kinds of testing you should be doing. And mention again that you should always weigh the costs with the benefits of the time and effort you spend on writing, running, and maintaining your tests.

Feedback welcome!

kentcdodds commented 7 years ago

I think I've found the perfect application for the workshop: Conduit Node backend and Conduit React frontend. It's pretty perfect I think.

kentcdodds commented 7 years ago

Here are some handy cypress tips from @bahmutov :clap: