Microsoft Teams reporter for Playwright

This reporter for Playwright allows you to send the test results to a Microsoft Teams channel and mention users on failure.

Here you can see an example card for successful test results:

Here you can see an example card for failed test results:

Prerequisites

To use this reporter, you must have a Microsoft Teams webhook URL. You can create a webhook URL using the Microsoft Teams Power Automate connector or the Microsoft Teams incoming webhook functionality.

As the incoming webhook functionality will stop working on October 1, 2024 (extended to December 2025), it is recommended to use the Power Automate connector functionality.

Important: You need to copy the webhook URL from the configuration, as you will need it to configure the reporter.

Info: The Retirement of Office 365 connectors within Microsoft Teams article provides more information on the retirement of the incoming webhook functionality.

Microsoft Teams Power Automate webhook

To create a Power Automate webhook for Microsoft Teams, you can follow these steps:

• Start with the following Post to a channel when a webhook request is received template
• Click continue to use the template
• Click on the Post your own adaptive card as the Flow bot to a channel action
• Configure the action with the following settings:
  • Team: Select the team where you want to post the message
  • Channel: Select the channel where you want to post the message

• Click on the Save button
• Click on When a Teams webhook request is received and copy the HTTP URL

Warning

When using the PowerAutomate template, a template footer will automatically be included like: <name> used a Workflow template to send this card. Get template. You can remove this footer by creating a copy of the flow, and use the new one instead. You can find more information about this procedure in the following blog post: How to remove " used a Workflow template to send this card. Get template".

Microsoft Teams incoming webhook (retiring October 1, 2024)

To use this reporter, you need to create an incoming webhook for your Microsoft Teams channel. You can find more information on how to do this in the Microsoft documentation.

Important: You need to copy the webhook URL from the configuration, as you will need it to configure the reporter.

Installation

Install from npm:

npm install playwright-msteams-reporter

Usage

You can configure the reporter by adding it to the playwright.config.js file:

import { defineConfig } from '@playwright/test';
import type { MsTeamsReporterOptions } from "playwright-msteams-reporter";

export default defineConfig({
  reporter: [
    ['list'],
    [
      'playwright-msteams-reporter',
      <MsTeamsReporterOptions>{
        webhookUrl: "<webhookUrl>",
        webhookType: "powerautomate", // or "msteams"
      }
    ]
  ],
});

More information on how to use reporters can be found in the Playwright documentation.

Configuration

The reporter supports the following configuration options:

Option	Description	Type	Required	Default
webhookUrl	The Microsoft Teams webhook URL	boolean	true	undefined
webhookType	The type of the webhook (msteams or powerautomate)	string	false	powerautomate
title	The notification title	string	false	Playwright Test Results
linkToResultsUrl	Link to the test results	string | () => string	false	undefined
linkToResultsText	Text for the link to the test results	string	false	View test results
linkUrlOnFailure	Link to page where you can view, trigger, etc. the failed tests	string | () => string	false	undefined
linkTextOnFailure	Text for the failed tests link action	string	false	undefined
notifyOnSuccess	Notify on success	boolean	false	true
mentionOnFailure	Mention users on failure (comma separated list)	string	false	undefined
mentionOnFailureText	Text to mention users on failure	string	false	{mentions} please validate the test results.
enableEmoji	Show an emoji based on the test status	boolean	false	false
quiet	Do not show any output in the console	boolean	false	false
debug	Show debug information	boolean	false	false
shouldRun	Conditional reporting	Suite => boolean	false	true

Mention users

With the mentionOnFailure option, you can mention users in the Microsoft Teams channel when a test fails. You can provide an array of users to mention.

Mention users with the Power Automate connector

You can mention users by providing their email addresses when using the Power Automate connector. The reporter will replace the {mentions} placeholder in the mentionOnFailureText with the mentioned users.

{
  mentionOnFailure: "mail1@elio.dev,mail2@elio.dev",
  mentionOnFailureText: "{mentions} check those failed tests!"
}

Mention users with the Microsoft Teams Incoming Webhook

The format can be either the full name and email ("Full name <email>") or just the email address (email). The reporter will replace the {mentions} placeholder in the mentionOnFailureText with the mentioned users.

{
  mentionOnFailure: "Elio Struyf <mail@elio.dev>,mail@elio.dev",
  mentionOnFailureText: "{mentions} check those failed tests!"
}

Link to the results

With the linkToResultsUrl option, you can provide a link to the test results. For example, you can view the test results on your CI/CD platform.

Conditional reporting (shouldRun)

Example (report only from jenkins runs - project name set as 'dev__jenkins'):

  shouldRun: (suite) => {
    if (suite.suites[0].project()?.name.includes('_jenkins')) return true

    return false
  }

Github

{
  // The link to your GitHub Actions workflow run
  linkToResultsUrl: `${process.env.GITHUB_SERVER_URL}/${process.env.GITHUB_REPOSITORY}/actions/runs/${process.env.GITHUB_RUN_ID}`,
}

Azure Devops

{
  // The link to your Azure DevOps pipeline run (add &view=artifacts&type=publishedArtifacts to access linked artifacts directly)
  linkToResultsUrl: `${process.env.AZURE_SERVER_URL}/${process.env.AZURE_PROJECT}/_build/results?buildId=${process.env.AZURE_RUN_ID}`,
}

Make sure to provide the environment variables in your Azure DevOps pipeline:

- script: npx playwright test
  displayName: "Run Playwright tests"
  name: "playwright"
  env:
    CI: "true"
    AZURE_SERVER_URL: $(System.CollectionUri)
    AZURE_PROJECT: $(System.TeamProject)
    AZURE_RUN_ID: $(Build.BuildId)

Combine the reporter with the Playwright Azure Reporter

You can combine the Microsoft Teams reporter with the Playwright Azure Reporter to link to create a link to the test plan results on Azure DevOps. The following example shows how you can combine both reporters:

import { defineConfig } from "@playwright/test";
import type { AzureReporterOptions } from "@alex_neo/playwright-azure-reporter";
import type { MsTeamsReporterOptions } from "playwright-msteams-reporter";

export default defineConfig({
  reporter: [
    ["list"],
    // First define the Azure reporter
    [
      "@alex_neo/playwright-azure-reporter",
      <AzureReporterOptions>{
        ...
      },
    ],
    // Then define the Microsoft Teams reporter
    [
      'playwright-msteams-reporter',
      <MsTeamsReporterOptions>{
        webhookUrl: "<webhookUrl>",
        // Instead of providing the URL directly, you need to provide a function that returns the URL.
        // The AZURE_PW_TEST_RUN_ID variable is only available once the Azure reporter has run.
        linkToResultsUrl: () => `${process.env.AZURE_SERVER_URL}/${process.env.AZURE_PROJECT}/_testManagement/runs?runId=${process.env.AZURE_PW_TEST_RUN_ID}&_a=runCharts`,
        linkToResultsText: "View test plan results",
      }
    ]
  ]
});

Make sure to provide the environment variables in your Azure DevOps pipeline:

- script: npx playwright test
  displayName: "Run Playwright tests"
  name: "playwright"
  env:
    CI: "true"
    AZURE_SERVER_URL: $(System.CollectionUri)
    AZURE_PROJECT: $(System.TeamProject)
    AZURE_RUN_ID: $(Build.BuildId)