Reporting Configuration | Bondar Academy
Course: Playwright UI Testing with TypeScript
Module: Advanced Tricks and Techniques
Instructor: Artem Bondar
Lesson Summary
In this lesson, we discussed how to configure different reporters in PlayWrite . PlayWrite offers several built-in reporters and allows the integration of third-party reporters. Here’s a summary of the key points covered: Built-in Reporters HTML Reporter : Configured in PlayWriteConfig.ts by specifying reporter: 'HTML' . List Reporter : Change the reporter name in the configuration file to List to see results in the console. JSON Reporter : Set the reporter to JSON . To save the report, wrap it in an array and specify an output file, e.g., jsonReport.json . Using Multiple Reporters You can configure multiple reporters by creating an array in the configuration file. For example, to use both JSON and JUnit reporters: reporter: ['json', 'junit'] This allows for generating both report formats in the specified output folder. Installing Third-Party Reporters To install a third-party reporter like Allure : Install Allure on your system using appropriate commands for your OS. Install the Allure PlayWrite package via npm . Add Allure to your list of reporters in the configuration file. Finally, generate the HTML report using the command specified in the Allure documentation, resulting in an index.html file that can be viewed in a browser. In summary, PlayWrite provides flexibility in reporting by allowing the use of built-in and third-party reporters, which can be configured to run simultaneously.
Video Transcript
In this lesson, we will talk about how to configure different reporters. So PlayWrite has several built-in reporters that you can choose in the PlayWrite configuration settings, as well as you can install third-party reporters and integrate with the PlayWrite. So in this lesson, I will show you how to do that. Let's get into it. So during the class, we looked several times in the HTML reporter, and we have a reporter configuration in the PlayWriteConfig.ts right here. So reporter and the name of the reporter, HTML. But PlayWrite has also different kind of built-in reporters, as well as you can install a third-party reporter. So how to do that? For example, in order to run the different reporter, let's say a built-in list reporter, you just change the name of the reporter inside of the configuration file, run the test, and we run the page object Chrome project from the package.json. It will run two of the tests. And you can see right now two tests are printed in the console. This is a very simple list reporter. Or you can change your reporter to, let's say, JSON reporter. You just type the name of the reporter, JSON. This is a built-in reporter. Run this project right now, and a JSON reporter will be generated. Okay. And you can see it's printed out to the console. Yeah. But this report is hard to read like that. Usually JSON reporter is used to parse this information to some other downstream system. And in order to save this reporter to the file, we need to wrap this into the array. So we need to create a two array brackets, one and one. So array and this reporter is inside of that. And then pass the second argument for this reporter as output file. And we can provide the place where we want to save this file. For example, under the test results folder, we want to save it as jsonReport.json, something like that. And when we run this test one more time. Okay, test is passed in under test results folder. Now we have JSON report folder that you can use later for any downstream system to parse this data from the JSON file. Also, you can use additional reporters, not just a single reporter. You can use two reporters. And to create the array of the reporters, you do like that. For example, we want to run JSON reporter in JUnit reporter. It's another popular reporter. So let's save it into the same folder, JUnit report. And the format will be XML. And I run this test right now. And right now, two reporters should be generated, JUnit and JSON report under the same folder. Test passed, open test results. And now we have two files, JSON report and JUnit report. And again, JUnit report is just a form of the reporter to integrate with other systems. For example, most of the CICD servers can read JUnit report and publish the result of this report on their user interface. So JSON and JUnit reporter are very useful for different systems to integrate. And also you can install additional third party reporters. And let me show you how to do that. So one of the popular reporters on the market is Allure reporter. So how to install that? So this is Allure playwright package on the NPM. But before installation of that, you need to install the Allure itself to your system. And there are different options for that. So if you are on Linux system, you need to install these three commands. If you are a Mac user, the most convenient way would be to use a brew, install Allure, and it will be installed on your system. And if you are on Windows, the Scoop package manager is the most convenient way. If you want to do a manual installation through the Maven central or other options, you can find this on Allure documentation. So once you've completed this step, then you go here and we need to install this package. So we copy this line. Going back to application and we need to install this package to our project first. And I add a force flag to ignore the warnings and dependencies. All right, it's complete. We can look into package.json and we can see that Allure is installed and looks like playwright also was updated with this installation. All right, the next step, we just need to add this Allure reporter into the list of our reporters. So simple. So going back and adding a new reporter here. All right, that's it. And now we can run the test and this should generate a report for us. Okay, and we see that Allure results folder was generated, but there are some understandable JSON files. So based on these JSON files, now we need to generate HTML reporter. So how we do this? Going back to documentation one more time. So first we need to run this command to generate the report. So pasting it right here. And I need to provide the correct path to the place where the report was saved. And it's saved in the folder, Allure results folder. Run this and a new folder was generated, which is Allure report. And this folder has index.html. And if you open this file in the browser, you will see your reporter. So open in the browser. And here we go. This is Allure reported successfully generated. So there are a couple of tests. They are right here displayed with some of the results. So as you can see, pretty easy to use. All right, so let's quickly summarize what we did in this lesson. PlayWrite has several built-in reporters that you can choose from HTML reporter, JSON reporter, JUnit reporter, and few others. Additionally, you can install a third-party reporter and add it to the framework. You can configure as many reporters as you want to run them in parallel, creating the array with the list of the reporters inside of the configuration file. All right, that's it, guys, and see you in the next lesson.