From the course: Build with AI: Beyond Pair Programming with AI

Writing tests with AI

- [Instructor] Let's start by doing this backwards. I already have a React component built out, and now I need to build tests to make sure my React component is working properly. This is something that happens to me all the time because I tend to forget to write tests as I'm building things. And for whatever reason, my brain does not want to do test-driven development, so I often ignore it. Now, in the past, this was a huge pain because writing tests can be really frustrating, but once you have code, it's easy to get an AI coding tool to write the tests for you. And all you have to do is make sure those tests actually make sense to your code. So here's how that's done using ChatGPT. I'll start by grabbing the entire component, all its code. Then I'll go into ChatGPT and say, "Help me write tests for this React component." And I'll just paste in the code. In return, ChatGPT writes out a full set of tests for me, and this code can now be used in my project. But before I try to implement this code in the project, I need to make sure that this test actually makes sense to what I'm doing. So I'll go back into the chat and ask, "What conditions are you testing for? Explain." Now we'll get a natural language response that explains exactly what is going on in the tests. This step is important because while this example is fairly easy to understand, I have two fields, a latitude and a longitude field, and the correct or incorrect parameters are very straightforward, in many cases, when you're building tests, it's far less obvious what is going on. And it's important to make sure that the tests that are written actually tests what you are trying to do in a meaningful way. And getting the system to explain the test like this gives you an immediate sense of what is going on in the test without having to read all the code. We're testing for form rendering, then for validation of empty fields, then for validation of non-numeric inputs, then out of range inputs, then input scenarios, and so on. And if you see this and you go, "There's something missing," then you can go back to the system and say, "Add this test in." Or if something is wrong, you can say, "That's not what I want to test for, test for this instead." Or you can even put in specific test scenarios and say, "I also want to test for this input and get this output." And this gives you the ability to guide the system to build the exact test you want. Now, once you have a test that you like and you want to implement it into your code, you can then ask the system how to do that. "How do I implement this into my project?" The chat kicks in. It will now give you a step-by-step instruction on what to do next. First, install the testing dependencies. Then create the new test file. Then set up the Jest configuration. Then run the tests. Then do some continuous integration if you want to. And then verify the output. And again, if you're not happy with these instructions, just ask again and it'll give you different instructions because the system will give you a different response every time because it is a probabilistic, non-deterministic machine.

Contents