Unit tests and an integration test side by side
Prices are kept in paise (whole numbers) so there are no floating-point surprises. The unit tests pin down the formatter; the integration test proves the cart, its state and the formatter work together.
Tests are small programs that use your app and check the result; good React tests check behaviour a user can see, not how the component is built inside, so they catch real bugs and survive refactors.
Change the code and press Run (Ctrl+Enter). Predict what will happen first, then break it on purpose and read what changes. Your edits are saved and match the lesson page.
Ready for more? This phase has 5 hands-on exercises with automatic checks.
Practice questions
Write the code in the editor, run it, then open the model answer to compare.
Rewrite this implementation-detail test as a behaviour test: expect(container.querySelector(".badge").dataset.count).toBe("3") for a component that shows 3 new messages.
Write a unit test (with the live helper) for function initials(name) that returns "AK" for "Asha Kumar".
Explain it without notes
What is the difference between a unit, an integration and an end-to-end test? Give a React example of each.
What is the testing trophy and why does it put integration tests in the middle?
What does "test behaviour, not implementation details" mean, and why does it matter?
What should you not test in a React app?
Preview
Console
Nothing logged yet.Expected console output
✓ formatPrice shows rupees with two decimals
✓ formatPrice handles zero
✓ removing an item updates the total