> ## Content Index
> Fetch the complete content index at: https://reactpractice.dev/llms.txt
> Use this file to discover other available public pages before exploring further.

# Build a button using test driven development
- URL: https://reactpractice.dev/exercise/build-a-button-using-test-driven-development/
- Published: 2023-02-15T07:17:11.000Z
- Updated: 2026-06-01T01:58:11.000Z
- Author: Corina Udrescu
- Tags: Testing, #corina-2, Component fundamentals, Exercises, #Import 2026-06-09 12:07

Try out test driven development by building a simple button component.

For this exercise, you're given a set of failing unit tests.  
Get the tests to pass by implementing the `Button` component!

You can clone [this repo](https://github.com/reactpractice-dev/tdd-button?ref=reactpractice.dev) to run the test locally.

Happy coding!

Note: The test uses `jest` and React Testing Library

What you'll learn

- rendering components in a test context using React Testing Library
- basic RTL methods - `getByRole`, `getByText`
- basic RTL assertions - `expect(...).toBeInTheDocument`, `expect(...).toHaveBeenCalled`
- troubleshooting tests with `screen.debug`
- mocking event handlers with jest mocks
- simulating user interactions using @testing-library/user-event v14
- async tests

💡

Ready to check your work?  
[Become a member](https://reactpractice.dev/become-a-member/) and get access to the [official solution](https://reactpractice.dev/solution/tutorial-build-a-button-using-test-driven-development/) and the comments section for feedback and discussion.