Test Hooks | Bondar Academy
Course: Playwright UI Testing with TypeScript
Module: Getting Started with Playwright
Instructor: Artem Bondar
Lesson Summary
In this lesson, we explore test hooks such as BeforeAll , BeforeEach , AfterAll , and AfterEach . These hooks are essential for organizing code, reducing duplication, and improving the structure of test cases. Key Concepts BeforeEach Hook: Executes code before each test, helping to eliminate repetitive code. BeforeAll Hook: Runs once before all tests in a suite, useful for setting up general preconditions. AfterEach Hook: Executes code after each test, but should be used cautiously to avoid test flakiness. AfterAll Hook: Runs after all tests, often used for cleanup tasks. Usage Example To navigate to a specific page, you might initially write repetitive code in multiple tests. By using the BeforeEach hook, you can centralize this navigation code: beforeEach(() => { // Navigation code here }); Best Practices Avoid using AfterEach and AfterAll unless necessary; prefer BeforeEach for setup tasks. Group tests using describe to apply different BeforeEach hooks to specific test suites. Use test.describe.skip or test.describe.only to manage test execution effectively. In summary, Playwright provides four hooks to optimize your testing strategy, allowing for better organization and execution of tests.
Video Transcript
In this lesson, we will talk about test hooks such as BeforeAll, BeforeEach and AfterAll and AfterEach. Test hooks are very useful when you need to organize your code and, for example, remove duplications, putting some of the repetitive code into the BeforeEach hook and so on. So in this lesson, I will show you how to use them. Let's get into it. So let's imagine the situation that we need to automate the flow to navigate to the date picker page. So how to do that? We would normally just create a new test. Let me copy the previous one. We navigate to our application, then to the forms. And instead of the form layouts, we would select DatePickerPage. And let me change the name. Navigate to DatePickerPage. And if I run this test, it works successfully. So we successfully navigated to the DatePickerPage. But there is a certain issue, right? We have a duplication of the code. So two lines of code in two of the tests are the same. They are kind of repeating situation. So for the repetitive situations like that, you can use hooks. And one of the hooks that can be used is called BeforeEach. So we type test BeforeEach. And code that we will put into this hook will be executed for every test. So async. All right, now it looks correct. So I'm copying two lines of code from this test. And I need to remove two lines of code from this test. So with this change, we effectively optimized the code and removed duplication. Also, there are a few other hooks available for you. For example, if you want to execute some code that you would want to run before all tests, there is also a hook available called BeforeAll. So the same way, you just provide the body of the function. And inside of this BeforeAll hook, you put a certain code that you want to run before all tests, like a general precondition before the execution of your test suite. This is used not really often, maybe sometimes to see the database. And there are a few After hooks also available for you. It is test AfterAll and AfterEach. The behavior is pretty much the same. If there is any code that you want to run after every single test, you create AfterEach hook and put your code over there. Or big general AfterAll hook that, for example, you want to delete a test data from the database after your test run, you can put such code into AfterAll hook. But try to avoid using AfterEach and AfterAll hooks in your test. This is considered not a good practice and sometimes can result in flakiness of the test. If some of the code from AfterEach or AfterAll hook you can relocate into the BeforeEach, like a control state before running of the test, for example, cleaning the data or creating the data, better to put this code over there. This will improve stability of your test and performance. And of course, you can use a different BeforeEach hook for different test suites using TestDescribe. As I showed in the previous lesson, for example, if I show TestDescribe and I put BeforeEach right here with two of these tests. And let's assume here we need to navigate not to the forms page, we need to navigate to some different page of our application. Let's say to charts page, right? Charts page, just an assumption. And let's say we create a suite number two that would navigate to the forms page. This will be a forms page. And what we can do, we can keep a higher level BeforeEach that will be executed for every single test in this test file as just navigate to the local host. And then as a part of the test suites, we can remove this local host from here and local host from here. Okay, it's complaining because we have the same names of the test. Let me give some dummy names so it would not complain. And now look what's gonna happen right now. So we created a structure when we have main BeforeEach hook that will be executed before every single test. Let me remove this for the clarity. So we created main BeforeEach hook that will be executed for every single test. And we created two test describes, test suite. In each of this test describe have own BeforeEach hook. And this BeforeEach hook will be executed for these two tests. And this Before hook will be executed only for these two tests. This one will be executed for every test that we put over here. This is how it works. So you can group your test, combine your test and use this hooks however you want to optimize the code flow and execution. And in the previous lesson, I showed you how you can skip your test or run certain tests. This trigger also apply to the describe block as well. So for example, if you want to skip this test suite. You can apply test describe skip. Or if you want to run only this test suite, you can put test describe only. This will work as well. So if you mark it like that, then all this section, including two tests and BeforeEach will be executed. And this one will not. That's it guys. And quickly summarize what we did in this lesson. So Playwright has four hooks that you can use. BeforeEach, AfterEach, BeforeAll and AfterAll. BeforeEach hook will be executed for every test in the test suite or test scenario. BeforeAll will be executed just once per entire test file where you declared it. AfterAll and AfterEach will work the same way, either executed after each scenario or after all scenarios. When you group your test by the test suites using describe, you can skip them independently or run them independently. And each scope for the BeforeEach hook inside of the describe will work only for that particular describe or the test suite. Alright, that's it guys. And see you in the next lesson.