Jest
Jest sets NODE_ENV=test
by default
The data entering a component via props is the data, whose stability we want to test during unit tests. For instance, if we have a <Table />
component, we are chiefly concerned with the data coming in and how it impacts <Table />
. In this case, it would be: How long is the array of data that comes in (which ultimately translates to amount of rows)? What is the 'title' prop that we are expecting (which renders the title on the Table), etc. Given that the data is what we are interested in, begin to think of ways that data can fail on us. What happens if we get no data? Well, then I guess we expect the amount of <Row />
components to be 0. This would mean a passing test, meaning that paticular piece of logic is guarded, and will remain robust unless the test breaks.
Keep in mind we are forming our tests around: what is expected given this circumstance? In tests, an error case and happy-path are both equivalent in terms of value. They are simply scenarios that may happen, and we want to just clarify it for the record that "this is what should happen, given this circumstance."
- ex. in
const wrapper = shallow(<FeedbackSummary />);
, imagine we are the parent, andFeedbackSummary
is the child we are testing. In other words,FeedbackSummary
is the input, andwrapper
is the output. In jest, we are basically saying "hey FeedbackSummary, I'm going to give you some props and render you. The output will be called wrapper, and I will take my magnifying glass (aka enzyme library) and take a close look to ensure that the everything looks like it should"
Transformation
Jest runs our code as plain Javscript. That means that any part of our code that isn't plain js (e.g. jsx, TypeScript types) needs to be transformed into plain js.
- A transformer is just a synchronous function that transforms source files into plain js. see transform configuration option
Implementations
ts-jest: a Jest transformer with source map support allowing us to use Jest to test TypeScript code
Children
Backlinks