This kata was created by maker of WeDoTDD.com: lists companies, teams, software crafters, and coaches who TDD
This kata is meant for anyone out there in the world who wants to try it.
Take your time to read this. Don't skim it.
Check out the Roadmap here
If there are problems or questions, feel free to reach out to Dave Schinkel by Joining the WeDoTDD.com Slack
This Kata is set up initially to stretch your skills by working with React Hooks, GraphQL, and Test Driven Development.
The following is already setup for you: mocha, chai, jest, supertest, React Testing Library, isolate-components
(Will be adding enzyme examples soon)
You don't have to use what's out of the box here. This kata is setup initially with a few nice things such as a GraphQL service to serve data to the client.
Well you forked it or created your own branch! So you're not stuck with GraphQL. It's easy enough to do what you want in here...then just do it! That's part of learning.
ExpressJS is already installed, so TDD a REST service or whatever you want!
Either way, you can still use the supertest library (already setup) to test drive the outside tests for the service!
Do not commit changes to main/master. Instead:
- If you do not have a github account, create one using your personal email
- Create a personal access token to enable you to use as a password for github command-line (pushes, forks, etc)
Forkthis repo instead of cloning it, then work on your own fork.
If you are a pair or mob working on this kata.
Do not commit changes to main/master. Instead:
- First DM Dave Schinkel in WeDoTDD Slack OR add an issue into this Repo asking for access
- then, provide github handles of everyone who will be working on the kata from your group so that Dave can add your github accounts as collaborators to this repo
- This will allow your group to create your own feature branch to work off of
- then, provide github handles of everyone who will be working on the kata from your group so that Dave can add your github accounts as collaborators to this repo
- Create a
new branchfor yourteam/group/mob/whateverand name it what you like. Then work off that branch together
TypeScript is not setup, this is a simple kata
- Install Homebrew
- run this cmd:
/bin/bash -c "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/HEAD/install.sh)"
- run this cmd:
- Install NodeJS:
brew install node - Install Yarn:
brew install yarn
- Install NodeJS first
- Install Yarn
npm install --global yarn
- Run
yarn(install node modules) - Next, be sure you can run the tests: test scripts are in
package.json, look there, try them
The following frameworks and libs are already setup for you and ready to go: mocha, chai, jest, supertest, React Testing Library, isolate-components
Looking at the config of these libs or frameworks will help you understand how to set these up for your own projects.
Out-of-box test cases demonstrate the Arrange / Act / Assert test partitioning pattern
- For React Component tests, you can use React Testing Library or a newer, better lib called isolate-react coupled with either jest or mocha
- For lower-level micro tests (below the components), you can use plain mocha or jest
- these tests do not rely on running the actual site (webpack)
️ in this repo, add your tests under the folder named with framework / lib you want to use.
Depending on what test libs, frameworks you chose that are already setup for you, you'd run one of the following:
tests using isolate-react + mocha + chai: yarn test-isolateComponents-mocha
tests using isolate-react + jest: coming soon
tests using React Testing Library + jest: yarn test-rtl-jest
tests using React Testing Library + mocha + chai: comming soon
- Initial server-side spec for "Hello World" is directly testing the service contract (it is not running the GraphQL service, doesn't need to)
- Example server-side tests provided are isolated & headless; to run tests, there is no need to run the real service or website
yarn test-server
You will need two separate terminal sessions running. One to run graphql and one to run the website.
- Run GraphQL Service:
yarn start-service- Don't forget about the
GraphiQL tool: go to http://localhost:4000/graphql
- Don't forget about the
- Run front-end:
yarn start, then go to http://localhost:8080- Note: uses webpack dev server
- GraphQL Service ☝ (step 1)️ must be running
If you don't like Coffee, tough luck! 😭
🌩 The sky is falling, and John 🙆♂️, a business stakeholder who is very close to obtaining his next career promotion, has asked you once again to rush 🚑 some new features out to the new "Coffee Roasters" website, a place where people can find the very best roasters on the planet.
🚨 He has stated with a strong voice, that "We are Agile" which means the world will end as we know it if these features aren't out in 2 days. John says Agile says you should be able to deliver things fast, and that fast is all that counts.
He told you he expects "this should be easy", but if you must, please work weekends, that you must "have a sense of urgency", and expect "do whatever it takes team player attitude" or you are fired! 😱 🙀 🖕. On top of that, he expects no bugs 🐞🪲 to be found.
🔴🟢🔵
You know however, that for many reasons, it's better to go well, never rush. And you realize that learning and applying TDD will help you along the way.
🔨 You are a Software Artisan who cares about producing high quality software; you are here to continually improve and practice Test Driven Development, Clean Code, SOLID, and the 4 Rules of Simple Design.
🔴🟢🔵
Implement the following features below using disciplined Test Driven Development
Option #1: Front-end should call the backend to get the data
-OR-
Option #2: implement the front-end without a real backend first (use test data and stubs to provide data to the front-end
While doing this kata, keep these in mind:
- Use the feature names below as good names for your overarching test describes
- Keep each test you write for a feature
super smallin behavioral scope - One feature should end up in
more than just one testwritten to implement that feature- If you're ending up with just one test and calling that "good", it means you're not taking small enough steps during your TDD workflow. It means you're not practicing baby steps: you're not evolving your design for that feature in a lean fashion. Write smaller tests to get there
- Write tests that drive behavior for both
happyandsadpaths
Remember: small tests; and each feature should result in several small tests
- ability to select a roaster somehow to see their detail page
- detail page should show some basic info on a couple of roasts (e.g. Dark Roast, Light Roast)
WeDoTDD.com - companies, teams, software crafters, and coaches who TDD
- Mocha
- Chai
- Jest
- isolate-react - a newer, leaner, simpler, faster React testing lib
- React Testing Library
- Enzyme
- GraphQL
- ExpressJS
- Koa: highly recommended over ExpressJS, written by TJ Holowaychuk, the guy who wrote ExpressJS. He wrote this to be an improvement over ExpressJS.