Skip to content
This repository was archived by the owner on Jan 5, 2026. It is now read-only.

Commit fbfab05

Browse files
serverless-momserverless-mom
authored
Merge branch 'main' into topPagesPolish
2 parents aacfc97 + c4c2901 commit fbfab05

7 files changed

Lines changed: 285 additions & 4 deletions

File tree

‎site/assets/docs/images/alerting/slack-custom-degraded.png‎

176 KB
Loading

‎site/assets/docs/images/alerting/slack-custom-failed.png‎

248 KB
Loading

‎site/assets/docs/images/alerting/slack-custom-recovered-degraded.png‎

172 KB
Loading

‎site/assets/docs/images/alerting/slack-custom-recovered.png‎

172 KB
Loading

‎site/content/docs/integrations/slack.md‎

Lines changed: 202 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -33,3 +33,205 @@ We provide a lot of information in the initial Slack message including links to
3333
From the recovered Slack message, you can see the timestamp as well as a link to the check itself.
3434

3535
![A slack message showing a recovered alert](/docs/images/alerting/slack-recovered-check.png)
36+
37+
38+
## Custom Slack Webhook Integration
39+
40+
For users who need more control over the Slack alert format and content, you can use a **Webhook Alert Channel** in Checkly to send fully customized messages to Slack.
41+
42+
This approach is ideal when the native Slack integration does not meet your formatting or dynamic content needs. You will be using a Webhook alert channel with a Slack Incoming WebHook URL and a custom payload template. This setup allows you to control Slack message formatting using Slack's [Block Kit](https://api.slack.com/block-kit).
43+
44+
### Steps
45+
46+
1. **Create a Slack Webhook**
47+
- [Create an Incoming WebHook integration](https://my.slack.com/services/new/incoming-webhook/) in Slack by selecting a default channel for your alerts. You’ll see a WebHook URL generated by Slack. Copy it.
48+
- Choose the bot name and icon for your alerts.
49+
50+
2. **Create a Webhook Alert Channel in Checkly**
51+
- Go to [Alert Settings > Add More Channels > Webhook](https://app.checklyhq.com/alerts/settings/channels/new/webhook)
52+
- Fill in the following:
53+
- **Name**: e.g. `Custom Slack Alerts`
54+
- **Method**: `POST`
55+
- **URL**: Paste the Slack Webhook URL
56+
- **Notification events**: Enable recovery, degraded, and failure. SSL expiry optional, but not supported in this template.
57+
- **Body**: See template below
58+
59+
3. **Customize the Template**
60+
61+
The following template uses conditional logic (`{{#if}}`) to change the message depending on the alert type:
62+
63+
``` {title="Body"}
64+
{
65+
"attachments": [
66+
{
67+
{{#if (eq ALERT_TYPE "ALERT_FAILURE")}}
68+
"color": "#a30200",
69+
{{/if}}
70+
{{#if (eq ALERT_TYPE "ALERT_RECOVERY")}}
71+
"color": "#2eb886",
72+
{{/if}}
73+
{{#if (eq ALERT_TYPE "ALERT_DEGRADED_RECOVERY")}}
74+
"color": "#2eb886",
75+
{{/if}}
76+
{{#if (eq ALERT_TYPE "ALERT_DEGRADED")}}
77+
"color": "#daa038",
78+
{{/if}}
79+
"blocks": [
80+
{
81+
"type": "header",
82+
"text": {
83+
"type": "plain_text",
84+
"text": "Check Result Details",
85+
"emoji": true
86+
}
87+
},
88+
{
89+
"type": "section",
90+
"fields": [
91+
{
92+
"type": "mrkdwn",
93+
"text": "*Check:*\n<https://app.checklyhq.com/checks/{{CHECK_ID}}|{{CHECK_NAME}}>"
94+
},
95+
{{#if GROUP_NAME}}
96+
{
97+
"type": "mrkdwn",
98+
"text": "*Group:*\n{{GROUP_NAME}}"
99+
},
100+
{{/if}}
101+
{
102+
"type": "mrkdwn",
103+
"text": "*Type:*\n{{CHECK_TYPE}}"
104+
},
105+
{
106+
"type": "mrkdwn",
107+
"text": "*Started at:*\n{{STARTED_AT}}"
108+
},
109+
{
110+
"type": "mrkdwn",
111+
"text": "*Run Location:*\n`{{RUN_LOCATION}}`"
112+
},
113+
{
114+
"type": "mrkdwn",
115+
"text": "*Response Time:*\n{{RESPONSE_TIME}}ms"
116+
}
117+
{{#if API_CHECK_RESPONSE_STATUS_CODE}},
118+
{
119+
"type": "mrkdwn",
120+
"text": "*Status Code:*\n{{API_CHECK_RESPONSE_STATUS_CODE}} {{API_CHECK_RESPONSE_STATUS_TEXT}}"
121+
}
122+
{{/if}}
123+
]
124+
},
125+
{{#if CHECK_ERROR_MESSAGE}}
126+
{
127+
"type": "section",
128+
"text": {
129+
"type": "mrkdwn",
130+
"text": "*❌ Error Message:*\n```{{CHECK_ERROR_MESSAGE}}```"
131+
}
132+
},
133+
{{/if}}
134+
135+
{{#if (eq ALERT_TYPE "ALERT_RECOVERY")}}
136+
{
137+
"type": "section",
138+
"text": {
139+
"type": "mrkdwn",
140+
"text": "✅ *This check has recovered and is now passing successfully.*"
141+
}
142+
},
143+
{{/if}}
144+
145+
{{#if (eq ALERT_TYPE "ALERT_DEGRADED_RECOVERY")}}
146+
{
147+
"type": "section",
148+
"text": {
149+
"type": "mrkdwn",
150+
"text": "🟡 *This check has recovered from a degraded state.*"
151+
}
152+
},
153+
{{/if}}
154+
155+
{{#if (eq ALERT_TYPE "ALERT_DEGRADED")}}
156+
{
157+
"type": "section",
158+
"text": {
159+
"type": "mrkdwn",
160+
"text": "⚠️ *This check is running but performance is degraded.*"
161+
}
162+
},
163+
{{/if}}
164+
165+
{
166+
"type": "section",
167+
"text": {
168+
"type": "mrkdwn",
169+
"text": "🔎 *View full result:*\n<{{RESULT_LINK}}|Click here to view details in Checkly>"
170+
}
171+
},
172+
{
173+
"type": "actions",
174+
"elements": [
175+
{
176+
"type": "button",
177+
"text": {
178+
"type": "plain_text",
179+
"text": "Runbook",
180+
"emoji": true
181+
},
182+
{{#if (eq CHECK_NAME "Check A")}}
183+
"url": "https://example.com/check-a",
184+
{{else if (eq CHECK_NAME "Check B")}}
185+
"url": "https://example.com/check-b",
186+
{{else}}
187+
"url": "https://example.com/default",
188+
{{/if}}
189+
"action_id": "open_link_button"
190+
},
191+
{
192+
"type": "button",
193+
"text": {
194+
"type": "plain_text",
195+
"text": "OTel Provider",
196+
"emoji": true
197+
},
198+
"url": "https://example.com",
199+
"action_id": "open_link_button_needs_to_be_unique"
200+
}
201+
]
202+
},
203+
{
204+
"type": "context",
205+
"elements": [
206+
{
207+
"type": "plain_text",
208+
"text": "Tags: {{TAGS}} | UUID: {{CHECK_RESULT_ID}}",
209+
"emoji": false
210+
}
211+
]
212+
}
213+
]
214+
}
215+
]
216+
}
217+
```
218+
219+
>[!NOTE]
220+
> Be sure to update or remove the placeholder button links to Runbooks, OTel provider and anything else that is not needed for your use case.
221+
222+
>[!NOTE]
223+
> Be sure each check mapped in the runbook logic has a corresponding URL. If a match isn’t found, fallback to a default documentation page.
224+
225+
### Testing the Webhook Limitations
226+
* You cannot use the Test Webhook button in Checkly for this template, as Slack requires valid payload structure and the test payload lacks real check data.
227+
* To test, trigger a real alert by adjusting a check so it fails, degrades, and recovers.
228+
229+
### Examples of Alert Transitions
230+
231+
![A customized slack message showing a failed alert](/docs/images/alerting/slack-custom-failed.png)
232+
233+
![A customized slack message showing a degraded alert](/docs/images/alerting/slack-custom-degraded.png)
234+
235+
![A customized slack message showing a recovered alert](/docs/images/alerting/slack-custom-recovered.png)
236+
237+
![A customized slack message showing a recovered alert from degraded state](/docs/images/alerting/slack-custom-recovered-degraded.png)

‎site/content/docs/playwright-checks/_index.md‎

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -61,7 +61,7 @@ The alpha version gets updated daily with new improvements. You can follow updat
6161
If you're using TypeScript, install the dev dependencies [`ts-node`](https://www.npmjs.com/package/ts-node) and [`typescript`](https://www.npmjs.com/package/typescript).
6262

6363
```bash {title="Terminal"}
64-
npm i --save-dev ts-node typescript
64+
npm i --save-dev jiti typescript
6565
```
6666

6767
### 3. Test and create a monitor with all your tests
@@ -105,8 +105,8 @@ Here's a fully working example. Adjust the `pwProjects` and `pwTags` to ones tha
105105
},
106106
{
107107
/* Create a check that runs the critical tagged tests every 10 mins */
108-
name: 'Critical-tagged',
109-
pwTags: 'critical', // Reference an existing tag in your tests
108+
name: 'checkly-tagged',
109+
pwTags: 'checkly', // Reference an existing tag in your tests
110110
frequency: Frequency.EVERY_10M, // set your ideal frequency
111111
locations: ['eu-west-1'],
112112
},
@@ -141,4 +141,4 @@ Now, you can test and deploy the individual monitors above, that reference exist
141141
> You are about to deploy your project "playwright-check-suites" to account "Checkly E2E Prod". Do you want to continue? … yes
142142
```
143143

144-
Now, you can head over to [Checkly's home dashboard](https://app.checklyhq.com/) and see your new checks running and associate an alert channel for them.
144+
Now, you can head over to [Checkly's home dashboard](https://app.checklyhq.com/) and see your new checks running and associate an alert channel for them.

‎site/content/docs/playwright-checks/add-to-group.md‎

Lines changed: 79 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,79 @@
1+
---
2+
title: Adding Playwright Check Suites to groups
3+
displayTitle: Adding a Playwright Check Suite to a group
4+
navTitle: Add to a group
5+
weight: 20
6+
slug: /groups-usage
7+
menu:
8+
resources:
9+
parent: "Playwright Check Suites (Alpha)"
10+
weight: 20
11+
---
12+
13+
{{< markdownpartial "/_shared/playwright-native-alpha.md" >}}
14+
15+
You can define a new group, or associate a Playwright Check Suite to an existing group.
16+
17+
## Steps
18+
19+
### 1. Create a group for your checks
20+
21+
To define a new group, create a group file, for example `website-group.check.ts`.
22+
23+
```typescript {title="website-group.check.ts"}
24+
25+
import { CheckGroup } from 'checkly/constructs'
26+
27+
export const myGroup = new CheckGroup('production-group', {
28+
name: 'Production group',
29+
activated: true,
30+
muted: false,
31+
locations: ['us-east-1', 'eu-west-1'],
32+
tags: ['mac', 'group'],
33+
environmentVariables: [],
34+
apiCheckDefaults: {},
35+
concurrency: 100,
36+
runParallel: true,
37+
retryStrategy: RetryStrategyBuilder.linearStrategy({ baseBackoffSeconds: 30, maxRetries: 2, sameRegion: false }),
38+
})
39+
```
40+
41+
Learn more about [using groups](https://www.checklyhq.com/docs/cli/constructs-reference/#checkgroup) to unify checks in Checkly.
42+
43+
## 2. Associate the group to the check
44+
45+
When specifying your Playwright Check Suite, you can reference the new or existing group, using its name:
46+
47+
```typescript {title="checkly.config.ts"}
48+
import { defineConfig } from 'checkly'
49+
50+
const config = defineConfig({
51+
logicalId: 'checkly-website',
52+
projectName: 'checkly-website',
53+
checks: {
54+
playwrightConfigPath: './playwright.config.ts',
55+
playwrightChecks: [
56+
{
57+
name: 'checkly-website',
58+
frequency: 10,
59+
locations: ['us-east-1',],
60+
groupName: 'Production group', // use the name of the group you created
61+
},
62+
],
63+
},
64+
cli: {
65+
runLocation: 'us-east-1',
66+
},
67+
})
68+
69+
export default config
70+
```
71+
72+
## 3. Deploy to apply the changes
73+
74+
```bash {title="Terminal"}
75+
npx checkly deploy --preview #confirm what will be deployed
76+
npx checkly deploy # deploy
77+
```
78+
79+
You can now see your Playwright Check Suite in your group.

0 commit comments

Comments
 (0)