track-my-play

track-my-play is a live monitoring tool for Playwright test execution. It provides a real-time dashboard to track the status of your Playwright tests.

Features

• Real-time test status updates
• Visual representation of test progress
• Easy integration with Playwright

How it works?

Central point is the local running Express server that listens to messages broadcasted from the test events in your test automation project. Another client living inside the dashboard UI is also connected to the same server. The server just propagates the updates to all the clients including the UI one, that dynamically renders the updates as current tests running, completed tests execution time etc.

Installation and setup

1. Install the dependancy in your test automation project:

   npm install track-my-play

2. Create an npm script in your package.json to use track-my-play's cli command listen-for-playwright

   // package.json
     "scripts": {
       "live-server-start": "listen-for-playwright",
     }
     //rest of the file

3. Setup the Playwright reporter alongside your existing reporters

   // playwright.config.ts
     export default defineConfig({
       reporter: [
           ['allure-playwright'],
           ['track-my-play', { socketUrl: 'http://localhost:3000' }],
       ],
       //rest of the config

4. Start the server with the script you previosly defined. This will start a local server on port 3000, will serve the html dashboard, and will open it in the browser automatically.

   npm run live-server-start

5. Now, once you run tests, assuming test are running on local machine as well, test progress updates will be send to the server and the dashboard would present real test execution data: name of the test running, its status (pending, passed, failed) and the total execution time in ms. Progress bar on the top will show the percentage of completed tests of the total number of tests contained in that particular execution.

If the tests are running on a remote machine, simply forward publically the port 3000 where the server is running and change the reporter configuration

    // playwright.config.ts
      export default defineConfig({
        reporter: [
            ['allure-playwright'],
            ['track-my-play', { socketUrl: 'http://forwarded-3000.port.io.something' }],
        ]
        //rest of the config

License

This project is licensed under the MIT License. See the LICENSE file for details.

Acknowledgements

• Playwright
• Express
• Socket.IO
• Open

Contact

For any inquiries, please contact [email protected].