How do you send Slack messages to a channel when Playwright Tests Finish? - Playwright-Slack-Report

There are a few ways to tackle this problem I'll start with the easiest solution first in this post which is only for Typescript/Javascript projects.

Playwright-Slack-Report

Ryan Rosello has created playwright-slack-report which can be installed as an npm or yarn package into your project.

yarn add playwright-slack-report -D

npm install playwright-slack-report -D

Once installed you must update your playwright.config.ts to include the the SlackReporter.js and required data supplied to the reporter configuration. My reporter configuration is listed below. Notice I am using a conditional ternary operator (?|:) in order to only run the SlackNotification report if running in CI (CI == true). On the below example I am sending the notification to a slack channel named #slack-testing evert time the tests run in CI.

  reporter: process.env.CI
    ? [
        [
          "./node_modules/playwright-slack-report/dist/src/SlackReporter.js",
          {
            channels: ["slack-testing"], // provide one or more Slack channels
            sendResults: "always", // "always" , "on-failure", "off"
          },
        ],
        ["dot"],
        ["list"],
        ["html"],
      ]
    : [["dot"], ["list"], ["html"]],

The next step in the process is providing an environment variable `SLACK_BOT_USER_OAUTH_TOKEN=[your Slack bot user OAUTH token]` when running the playwright tests.

SLACK_BOT_USER_OAUTH_TOKEN=[your Slack bot user OAUTH token] npx playwright test

This is something that can be passed in to your run command (above) or if you use a package dotenv you are able to just set this in your .env file and not have to worry about it.

For me since I am only sending slack notification from CI my Github actions runs, I decided to add the OAUTH_TOKEN to a Github action secret, so I don't have to store this in my repo.

The last piece to the puzzle is ensuring you actually have an OAUTH token configured in slack. The steps on the readme below walk you through this process. It does take a few minutes, and you have to pay attention to the details but you got this!

Creating/Finding my slack bot oauth token? (click on the section to expand it).

If you've made it this far you should have slack notifications for your test runs

Some final thoughts about this integration:

• You can quickly start publishings nice looking results to slack with this package
• It's got a lot of built in configuration and customization (see the readme!)
• The Layout and Summary of the slack message are customizable!
• A con  is that it is run a part of playwright test-runner, so it's limited to typescript/javascript.

Stay tuned for a second post where I cover how to send Playwright test results via Github actions!

Thanks for reading! If you found this helpful, reach out and let me know on LinkedIn or consider buying me a cup of coffee. If you want more content delivered to you in your inbox subscribe below.