playwright-slack-report 1.1.21 → 1.1.23

package/README.md

@@ -42,7 +42,35 @@ Modify your `playwright.config.ts` file to include the following:
     ["dot"], // other reporters
   ],
 ```
+# Option A - send your results via a Slack webhook
 
+Enable incoming webhooks in your Slack workspace by following the steps as per Slack's documentation:
+
+https://api.slack.com/messaging/webhooks
+
+
+
+Once you have enabled incoming webhooks, you will need to copy the webhook URL and specify it in the config:
+
+```typescript
+  reporter: [
+    [
+      "./node_modules/playwright-slack-report/dist/src/SlackReporter.js",
+      {
+        slackWebHookUrl: "https://hooks.slack.com/services/T00000000/B00000000/XXXXXXXXXXXXXXXXXXXXXXXX",
+        sendResults: "always", // "always" , "on-failure", "off"
+      },
+    ],
+    ["dot"], // other reporters
+  ],
+```
+### Note I:
+You will most likely need to have Slack administrator rights to perform the steps above.
+
+### Note II:
+Sending failure details in a thread is not supported when using webhooks.  You will need to use Option B below.
+
+# Option B
 Run your tests by providing your `SLACK_BOT_USER_OAUTH_TOKEN` as an environment variable or specifying `slackOAuthToken` option in the config:
 
 `SLACK_BOT_USER_OAUTH_TOKEN=[your Slack bot user OAUTH token] npx playwright test`

package/dist/src/LayoutGenerator.js

@@ -2,8 +2,6 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.generateFailures = exports.generateBlocks = void 0;
 const generateBlocks = async (summaryResults, maxNumberOfFailures) => {
-    const maxNumberOfFailureLength = 650;
-    const fails = [];
     const meta = [];
     const header = {
         type: 'section',
@@ -19,32 +17,7 @@ const generateBlocks = async (summaryResults, maxNumberOfFailures) => {
             text: `✅ *${summaryResults.passed}* | ❌ *${summaryResults.failed}* | ⏩ *${summaryResults.skipped}*`,
         },
     };
-    for (let i = 0; i < summaryResults.failures.length; i += 1) {
-        const { failureReason, test } = summaryResults.failures[i];
-        const formattedFailure = failureReason
-            .substring(0, maxNumberOfFailureLength)
-            .split('\n')
-            .map((l) => `>${l}`)
-            .join('\n');
-        fails.push({
-            type: 'section',
-            text: {
-                type: 'mrkdwn',
-                text: `*${test}*
-        \n${formattedFailure}`,
-            },
-        });
-        if (i > maxNumberOfFailures) {
-            fails.push({
-                type: 'section',
-                text: {
-                    type: 'mrkdwn',
-                    text: `*There are too many failures to display - ${fails.length} out of ${summaryResults.failures.length} failures shown*`,
-                },
-            });
-            break;
-        }
-    }
+    const fails = await generateFailures(summaryResults, maxNumberOfFailures);
     if (summaryResults.meta) {
         for (let i = 0; i < summaryResults.meta.length; i += 1) {
             const { key, value } = summaryResults.meta[i];
@@ -61,9 +34,6 @@ const generateBlocks = async (summaryResults, maxNumberOfFailures) => {
         header,
         summary,
         ...meta,
-        {
-            type: 'divider',
-        },
         ...fails,
     ];
 };
@@ -71,7 +41,8 @@ exports.generateBlocks = generateBlocks;
 const generateFailures = async (summaryResults, maxNumberOfFailures) => {
     const maxNumberOfFailureLength = 650;
     const fails = [];
-    for (let i = 0; i < summaryResults.failures.length; i += 1) {
+    const numberOfFailuresToShow = Math.min(summaryResults.failures.length, maxNumberOfFailures);
+    for (let i = 0; i < numberOfFailuresToShow; i += 1) {
         const { failureReason, test } = summaryResults.failures[i];
         const formattedFailure = failureReason
             .substring(0, maxNumberOfFailureLength)
@@ -86,16 +57,15 @@ const generateFailures = async (summaryResults, maxNumberOfFailures) => {
         \n${formattedFailure}`,
             },
         });
-        if (i > maxNumberOfFailures) {
-            fails.push({
-                type: 'section',
-                text: {
-                    type: 'mrkdwn',
-                    text: `*There are too many failures to display - ${fails.length} out of ${summaryResults.failures.length} failures shown*`,
-                },
-            });
-            break;
-        }
+    }
+    if (summaryResults.failures.length > maxNumberOfFailures) {
+        fails.push({
+            type: 'section',
+            text: {
+                type: 'mrkdwn',
+                text: `*⚠️ There are too many failures to display - ${fails.length} out of ${summaryResults.failures.length} failures shown*`,
+            },
+        });
     }
     return [
         {

package/dist/src/SlackReporter.d.ts

@@ -10,6 +10,7 @@ declare class SlackReporter implements Reporter {
     private slackChannels;
     private slackLogLevel;
     private slackOAuthToken;
+    private slackWebHookUrl;
     private disableUnfurl;
     private proxy;
     private browsers;

package/dist/src/SlackReporter.js

@@ -2,8 +2,10 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 const web_api_1 = require("@slack/web-api");
 const https_proxy_agent_1 = require("https-proxy-agent");
+const webhook_1 = require("@slack/webhook");
 const ResultsParser_1 = require("./ResultsParser");
 const SlackClient_1 = require("./SlackClient");
+const SlackWebhookClient_1 = require("./SlackWebhookClient");
 class SlackReporter {
     customLayout;
     customLayoutAsync;
@@ -15,6 +17,7 @@ class SlackReporter {
     slackChannels = [];
     slackLogLevel;
     slackOAuthToken;
+    slackWebHookUrl;
     disableUnfurl;
     proxy;
     browsers = [];
@@ -29,7 +32,12 @@ class SlackReporter {
         }
         else {
             // eslint-disable-next-line max-len
-            this.browsers = fullConfig.projects.map((obj) => ({ projectName: obj.name, browser: obj.use.browserName ? obj.use.browserName : obj.use.defaultBrowserType }));
+            this.browsers = fullConfig.projects.map((obj) => ({
+                projectName: obj.name,
+                browser: obj.use.browserName
+                    ? obj.use.browserName
+                    : obj.use.defaultBrowserType,
+            }));
         }
         if (slackReporterConfig) {
             this.meta = slackReporterConfig.meta || [];
@@ -37,8 +45,10 @@ class SlackReporter {
             this.customLayout = slackReporterConfig.layout;
             this.customLayoutAsync = slackReporterConfig.layoutAsync;
             this.slackChannels = slackReporterConfig.channels;
-            this.maxNumberOfFailuresToShow = slackReporterConfig.maxNumberOfFailuresToShow || 10;
+            this.maxNumberOfFailuresToShow
+                = slackReporterConfig.maxNumberOfFailuresToShow || 10;
             this.slackOAuthToken = slackReporterConfig.slackOAuthToken || undefined;
+            this.slackWebHookUrl = slackReporterConfig.slackWebHookUrl || undefined;
             this.disableUnfurl = slackReporterConfig.disableUnfurl || false;
             this.showInThread = slackReporterConfig.showInThread || false;
             this.slackLogLevel = slackReporterConfig.slackLogLevel || web_api_1.LogLevel.DEBUG;
@@ -66,40 +76,67 @@ class SlackReporter {
             return;
         }
         const agent = this.proxy ? new https_proxy_agent_1.HttpsProxyAgent(this.proxy) : undefined;
-        const slackClient = new SlackClient_1.default(new web_api_1.WebClient(this.slackOAuthToken || process.env.SLACK_BOT_USER_OAUTH_TOKEN, {
-            logLevel: this.slackLogLevel || web_api_1.LogLevel.DEBUG,
-            agent,
-        }));
-        const result = await slackClient.sendMessage({
-            options: {
-                channelIds: this.slackChannels,
+        if (this.slackWebHookUrl) {
+            const webhook = new webhook_1.IncomingWebhook(this.slackWebHookUrl, { agent });
+            const slackWebhookClient = new SlackWebhookClient_1.default(webhook);
+            const webhookResult = await slackWebhookClient.sendMessage({
                 customLayout: this.customLayout,
                 customLayoutAsync: this.customLayoutAsync,
                 maxNumberOfFailures: this.maxNumberOfFailuresToShow,
                 disableUnfurl: this.disableUnfurl,
                 summaryResults: resultSummary,
-                showInThread: this.showInThread,
-            },
-        });
-        // eslint-disable-next-line no-console
-        console.log(JSON.stringify(result, null, 2));
-        if (this.showInThread && resultSummary.failures.length > 0) {
-            await slackClient.attachDetailsToThread({
-                channelIds: this.slackChannels,
-                ts: result[0].ts,
-                summaryResults: resultSummary,
-                maxNumberOfFailures: this.maxNumberOfFailuresToShow,
             });
+            // eslint-disable-next-line no-console
+            console.log(JSON.stringify(webhookResult, null, 2));
+        }
+        else {
+            const slackClient = new SlackClient_1.default(new web_api_1.WebClient(this.slackOAuthToken || process.env.SLACK_BOT_USER_OAUTH_TOKEN, {
+                logLevel: this.slackLogLevel || web_api_1.LogLevel.DEBUG,
+                agent,
+            }));
+            const result = await slackClient.sendMessage({
+                options: {
+                    channelIds: this.slackChannels,
+                    customLayout: this.customLayout,
+                    customLayoutAsync: this.customLayoutAsync,
+                    maxNumberOfFailures: this.maxNumberOfFailuresToShow,
+                    disableUnfurl: this.disableUnfurl,
+                    summaryResults: resultSummary,
+                    showInThread: this.showInThread,
+                },
+            });
+            // eslint-disable-next-line no-console
+            console.log(JSON.stringify(result, null, 2));
+            if (this.showInThread && resultSummary.failures.length > 0) {
+                for (let i = 0; i < result.length; i += 1) {
+                    // eslint-disable-next-line no-await-in-loop
+                    await slackClient.attachDetailsToThread({
+                        channelIds: [result[i].channel],
+                        ts: result[i].ts,
+                        summaryResults: resultSummary,
+                        maxNumberOfFailures: this.maxNumberOfFailuresToShow,
+                    });
+                }
+            }
         }
     }
     preChecks() {
         if (this.sendResults === 'off') {
             return { okToProceed: false, message: '❌ Slack reporter is disabled' };
         }
-        if (!this.slackOAuthToken && !process.env.SLACK_BOT_USER_OAUTH_TOKEN) {
+        if (!this.slackWebHookUrl
+            && !this.slackOAuthToken
+            && !process.env.SLACK_BOT_USER_OAUTH_TOKEN) {
+            return {
+                okToProceed: false,
+                message: '❌ Neither slack webhook url, slackOAuthToken nor process.env.SLACK_BOT_USER_OAUTH_TOKEN were found',
+            };
+        }
+        if (this.slackWebHookUrl
+            && (process.env.SLACK_BOT_USER_OAUTH_TOKEN || this.slackOAuthToken)) {
             return {
                 okToProceed: false,
-                message: '❌ Neither slackOAuthToken nor process.env.SLACK_BOT_USER_OAUTH_TOKEN were found',
+                message: '❌ You can only enable a single option, either provide a slack webhook url, slackOAuthToken or process.env.SLACK_BOT_USER_OAUTH_TOKEN were found',
             };
         }
         if (!this.sendResults

package/dist/src/SlackWebhookClient.d.ts

@@ -0,0 +1,15 @@
+import { IncomingWebhook } from '@slack/webhook';
+import { SummaryResults } from '.';
+export default class SlackWebhookClient {
+    private webhook;
+    constructor(webhook: IncomingWebhook);
+    sendMessage({ customLayout, customLayoutAsync, maxNumberOfFailures, summaryResults, disableUnfurl, }: {
+        customLayout: Function | undefined;
+        customLayoutAsync: Function | undefined;
+        maxNumberOfFailures: number;
+        summaryResults: SummaryResults;
+        disableUnfurl: boolean;
+    }): Promise<{
+        outcome: string;
+    }>;
+}

package/dist/src/SlackWebhookClient.js

@@ -0,0 +1,42 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const LayoutGenerator_1 = require("./LayoutGenerator");
+class SlackWebhookClient {
+    webhook;
+    constructor(webhook) {
+        this.webhook = webhook;
+    }
+    async sendMessage({ customLayout, customLayoutAsync, maxNumberOfFailures, summaryResults, disableUnfurl, }) {
+        let blocks;
+        if (customLayout) {
+            blocks = customLayout(summaryResults);
+        }
+        else if (customLayoutAsync) {
+            blocks = await customLayoutAsync(summaryResults);
+        }
+        else {
+            blocks = await (0, LayoutGenerator_1.generateBlocks)(summaryResults, maxNumberOfFailures);
+        }
+        let result;
+        try {
+            result = await this.webhook.send({
+                blocks,
+                unfurl_links: !disableUnfurl,
+            });
+        }
+        catch (error) {
+            return {
+                outcome: `error: ${JSON.stringify(error, null, 2)}`,
+            };
+        }
+        if (result && result.text === 'ok') {
+            return {
+                outcome: result.text,
+            };
+        }
+        return {
+            outcome: '😵 Failed to send webhook message, ensure your webhook url is valid',
+        };
+    }
+}
+exports.default = SlackWebhookClient;

package/dist/src/custom_block/my_block.js

@@ -25,7 +25,7 @@ const generateCustomLayout = (summaryResults) => {
                 type: 'section',
                 text: {
                     type: 'mrkdwn',
-                    text: '*There are too many failures to display, view the full results in BuildKite*',
+                    text: '*⚠️ There are too many failures to display, view the full results in BuildKite*',
                 },
             });
             break;

package/package.json

@@ -1,6 +1,7 @@
 {
   "dependencies": {
     "@slack/web-api": "^6.8.1",
+    "@slack/webhook": "^6.1.0",
     "https-proxy-agent": "^7.0.1"
   },
   "devDependencies": {
@@ -18,7 +19,7 @@
     "eslint-plugin-prettier": "^4.2.1",
     "nyc": "^15.1.0",
     "prettier": "^2.7.1",
-    "ts-mockito": "^2.6.1",
+    "ts-sinon": "^2.0.2",
     "typescript": "^4.7.4"
   },
   "scripts": {
@@ -28,7 +29,7 @@
     "lint": "npx eslint . --ext .ts"
   },
   "name": "playwright-slack-report",
-  "version": "1.1.21",
+  "version": "1.1.23",
   "main": "index.js",
   "types": "dist/index.d.ts",
   "repository": "git@github.com:ryanrosello-og/playwright-slack-report.git",