WEBVTT 00:01.960 --> 00:09.320 As you can probably tell, manually testing the entire application after each change is very, very 00:09.320 --> 00:14.520 time consuming, and after building some features, it gets a bit annoying, right? 00:14.560 --> 00:20.400 So we want to make sure that whatever feature we have built so far is still working, even if we're 00:20.400 --> 00:25.840 adding additional features to the application so that we don't have to test everything from scratch. 00:26.080 --> 00:29.880 And to automate this process, we should write some tests. 00:29.880 --> 00:37.160 So the test exists for exactly that reason, to replace the need for manual testing, and to just have 00:37.160 --> 00:43.520 some automated tests that can be executed by the agent to tell if the application is still working or 00:43.520 --> 00:43.880 not. 00:44.200 --> 00:47.040 Now, there are various types of tests that we can write. 00:47.040 --> 00:51.000 We can also go ahead and consult with the agent or with ChatGPT. 00:51.000 --> 00:56.240 So we can say directly here, like what kind of test does it make sense to write for this app? 00:56.520 --> 01:00.280 Definitely what you want to have is a pyramid of tests. 01:00.680 --> 01:02.240 It's called the testing pyramid. 01:02.280 --> 01:08.750 Right at the bottom we typically have unit tests and unit tests are testing just a small part of the 01:08.750 --> 01:12.270 application, typically only a specific file or a specific function. 01:12.670 --> 01:17.070 And we have lots of these unit tests because they're very fast to execute. 01:17.270 --> 01:24.270 We can have after that integration or component test which tests how different components in our application 01:24.310 --> 01:28.030 work together, either stand alone or in combination with other components. 01:28.190 --> 01:31.310 And also we can have end to end tests. 01:31.590 --> 01:37.390 And these are pretty much tests that will open a browser window and test if the application itself is 01:37.390 --> 01:37.790 working. 01:37.790 --> 01:39.470 Click on buttons and things like that. 01:40.030 --> 01:44.710 Generally end to end tests, we should only have a few of them for very important features. 01:44.950 --> 01:49.390 We're going to hear a response in terms of like kind of tests we want to use here. 01:49.590 --> 01:54.590 So if you're unsure ideally an application should have tests on all levels. 01:54.590 --> 02:01.350 But in this case I'm just going to ask the agent for the functionality that has been implemented so 02:01.350 --> 02:10.410 far to write end to end tests using playwright, which is a very popular framework for writing and running 02:10.450 --> 02:14.850 end to end tests is a bit of a setup, but we're going to try to follow along. 02:15.250 --> 02:20.410 Typically, during the installation process, we might be asked to run a few commands. 02:21.010 --> 02:29.090 Also, writing this test is not always easy because the I may write some tests and then very likely 02:29.090 --> 02:30.250 they will also fail. 02:30.250 --> 02:33.490 So the AI needs to figure out how to install them, and so on. 02:33.930 --> 02:36.690 So we're going to try to figure out that as well. 02:38.170 --> 02:40.450 I'm going to let the agent do its thing. 02:40.490 --> 02:45.450 Start initializing the playwright test creating the files and so on. 02:45.450 --> 02:48.050 And we're going to see how this works out. 02:49.170 --> 02:54.050 So typically what we're going to see during this test is that a server has been started. 02:54.050 --> 02:58.130 So if you go to this address you should see here an HTML report. 02:58.610 --> 03:02.090 So this is the HTML report with the different tests that have been executed. 03:02.130 --> 03:04.850 And we see here that one of them is failing. 03:04.890 --> 03:06.410 So this is not good. 03:06.850 --> 03:10.010 In this situation we can see that it's a bit more complicated for the agent to continue. 03:10.050 --> 03:12.130 I'm going to click here skip and continue. 03:12.130 --> 03:12.200 You. 03:13.240 --> 03:18.160 And while this is still generating here, you always need to pay attention to this is still generating. 03:18.160 --> 03:19.880 It means it's still doing something. 03:20.320 --> 03:26.400 If it's getting stuck on a command, we typically need to do something, but we're going to let it generate. 03:26.520 --> 03:29.400 As long as it's generating, we're not going to do anything else. 03:30.520 --> 03:32.200 So again, the tests have been executed. 03:32.200 --> 03:33.760 Something is not working properly. 03:34.200 --> 03:36.880 We're going to give the agent another chance to fix it. 03:36.880 --> 03:39.120 So let's see exactly what's going on here. 03:39.600 --> 03:42.760 May need a bit of manual intervention a bit of manual help. 03:43.560 --> 03:48.800 So now what we want to see here is finally that all these tests are passing. 03:49.120 --> 03:51.440 We're going to see here the HTML report. 03:51.440 --> 03:56.360 If we want to run this particular command here we can see the report that was previously on the screen. 03:56.640 --> 03:58.760 Generally speaking we're not really interested in that. 03:58.960 --> 04:01.480 We just want to make sure that these tests are running. 04:01.760 --> 04:07.280 If we want to manually run them, all we need to do is tell the agent, run the end to end test. 04:07.840 --> 04:09.800 We don't need to remember a specific command. 04:10.000 --> 04:14.520 We can just use natural language to run the tests we're going to see here. 04:14.520 --> 04:18.420 All tests are passing, which means also the application is still working. 04:19.060 --> 04:23.340 So all we need to do is also take a look at application itself and go back to home. 04:23.340 --> 04:24.620 We have here the buttons. 04:24.780 --> 04:28.340 So for whatever functionality we have implemented so far, there should be a test. 04:28.740 --> 04:35.220 Of course, if we discover a bug, we need to go to the agent and say fix the bug, but also write a 04:35.220 --> 04:35.660 test. 04:36.100 --> 04:41.540 And ideally in the order of first write a test that fails because of the bug, and then fix the bug 04:41.540 --> 04:44.740 and ensure that the test is also now working. 04:45.820 --> 04:53.060 Apart from this, we also want to revisit the git ignore files and want to make sure that all this additional 04:53.060 --> 04:58.460 folders that have been added, like test results or playwright report that they are considered because 04:58.460 --> 04:59.740 we don't want to commit them. 05:00.300 --> 05:02.060 So we're just going to say here, revisit the. 05:02.100 --> 05:04.020 Gitignore file and commit the changes. 05:04.460 --> 05:08.460 So want to make sure that there's nothing that we have forgotten about. 05:09.620 --> 05:13.780 I'm going to stage the files and commit the changes. 05:15.140 --> 05:18.580 And we should also accept here all the changes that have been made by cursor.