plum-e2e 2.1.0 → 2.2.0

package/frontend/src/lib/stores/runner.js

@@ -48,7 +48,7 @@ export const runsVersion = writable(0);
 // Map of taskName → true for every cron job currently executing
 export const activeCronJobs = writable({});
 
-export function triggerRun(id, testRunId) {
+export function triggerRun(id, testRunId, notify = {}) {
 	const s = get(socket);
 	if (!s) return;
 
@@ -72,7 +72,9 @@ export function triggerRun(id, testRunId) {
 		workers,
 		browser,
 		runners: selectedRunners,
-		testRunId: testRunId ?? null
+		testRunId: testRunId ?? null,
+		notifyDiscord: notify.notifyDiscord ?? false,
+		notifySlack: notify.notifySlack ?? false
 	});
 }
 

package/frontend/src/routes/scheduled-tests/+page.svelte

@@ -25,6 +25,7 @@
 		toggleCronJob
 	} from '$lib/api/schedules';
 	import { fetchRunners } from '$lib/api/runners';
+	import { fetchIntegrations } from '$lib/api/settings';
 	import { activeCronJobs } from '$lib/stores/runner';
 	import { BROWSERS, TOAST_TIMEOUT_MS } from '$lib/constants';
 	import { stagger } from '$lib/utils/format';
@@ -50,6 +51,7 @@
 
 	let cronJobs = [];
 	let availableRunners = [];
+	let integrations = { discordWebhookUrl: '', slackWebhookUrl: '', notifyPublicUrl: '' };
 	let toast = null;
 
 	let modalOpen = false;
@@ -64,7 +66,9 @@
 		tags: '',
 		workers: 1,
 		browser: 'chromium',
-		runnerIds: ['built-in']
+		runnerIds: ['built-in'],
+		notifyDiscord: false,
+		notifySlack: false
 	};
 	let selectedSchedule = '';
 	let useCustomCron = false;
@@ -137,7 +141,9 @@
 			tags: '',
 			workers: 1,
 			browser: 'chromium',
-			runnerIds: ['built-in']
+			runnerIds: ['built-in'],
+			notifyDiscord: false,
+			notifySlack: false
 		};
 		selectedSchedule = '';
 		useCustomCron = false;
@@ -157,7 +163,9 @@
 			tags: job.tags,
 			workers: job.workers ?? 1,
 			browser: job.browser ?? 'chromium',
-			runnerIds: prunedIds.length > 0 ? prunedIds : ['built-in']
+			runnerIds: prunedIds.length > 0 ? prunedIds : ['built-in'],
+			notifyDiscord: job.notifyDiscord ?? false,
+			notifySlack: job.notifySlack ?? false
 		};
 		const isPreset = scheduleOptions.some((o) => o.value === job.cronExpression);
 		useCustomCron = !isPreset;
@@ -231,10 +239,15 @@
 	}
 
 	onMount(async () => {
-		cronJobs = await fetchCronJobs();
-		try {
-			availableRunners = await fetchRunners();
-		} catch {}
+		[cronJobs, availableRunners, integrations] = await Promise.all([
+			fetchCronJobs(),
+			fetchRunners().catch(() => []),
+			fetchIntegrations().catch(() => ({
+				discordWebhookUrl: '',
+				slackWebhookUrl: '',
+				notifyPublicUrl: ''
+			}))
+		]);
 	});
 </script>
 
@@ -373,6 +386,26 @@
 			</div>
 		</div>
 
+		{#if integrations.discordWebhookUrl || integrations.slackWebhookUrl}
+			<div class="field">
+				<div class="field-label"><span>Notifications</span></div>
+				<div class="notify-checks">
+					{#if integrations.discordWebhookUrl}
+						<label class="notify-check-option">
+							<input type="checkbox" bind:checked={form.notifyDiscord} />
+							<span>Discord</span>
+						</label>
+					{/if}
+					{#if integrations.slackWebhookUrl}
+						<label class="notify-check-option">
+							<input type="checkbox" bind:checked={form.notifySlack} />
+							<span>Slack</span>
+						</label>
+					{/if}
+				</div>
+			</div>
+		{/if}
+
 		{#if formError}
 			<p class="form-error">{formError}</p>
 		{/if}
@@ -859,4 +892,29 @@
 		text-overflow: ellipsis;
 		max-width: 180px;
 	}
+
+	/* Notification checkboxes in modal */
+	.notify-checks {
+		display: flex;
+		flex-direction: row;
+		gap: 1rem;
+		padding: 0.375rem 0;
+	}
+
+	.notify-check-option {
+		display: flex;
+		align-items: center;
+		gap: 0.5rem;
+		font-size: 0.8125rem;
+		color: var(--text);
+		cursor: pointer;
+	}
+
+	.notify-check-option input[type='checkbox'] {
+		accent-color: var(--accent);
+		width: 13px;
+		height: 13px;
+		flex-shrink: 0;
+		cursor: pointer;
+	}
 </style>

package/frontend/src/routes/settings/+page.svelte

@@ -19,7 +19,14 @@
 	import { onMount } from 'svelte';
 	import { fly } from 'svelte/transition';
 	import { goto } from '$app/navigation';
-	import { fetchProject, saveProject, exportBackup, importBackup } from '$lib/api/settings';
+	import {
+		fetchProject,
+		saveProject,
+		exportBackup,
+		importBackup,
+		fetchIntegrations,
+		saveIntegrations
+	} from '$lib/api/settings';
 	import {
 		fetchRunners,
 		createRunner,
@@ -43,7 +50,7 @@
 	import Toast from '$lib/components/ui/Toast.svelte';
 	import ConfirmModal from '$lib/components/ui/ConfirmModal.svelte';
 
-	/** @type {'project' | 'runners' | 'repository' | 'account' | 'users' | 'backup'} */
+	/** @type {'project' | 'runners' | 'repository' | 'integrations' | 'account' | 'users' | 'backup'} */
 	let section =
 		(typeof sessionStorage !== 'undefined' && sessionStorage.getItem('plum:settings:section')) ||
 		'project';
@@ -84,6 +91,9 @@
 	let exporting = false;
 	let fileInput;
 
+	let integrations = { discordWebhookUrl: '', slackWebhookUrl: '', notifyPublicUrl: '' };
+	let integrationsSaving = false;
+
 	let runners = [];
 	let runnerForm = { name: '', url: '', token: '', browser: 'chromium' };
 	let runnerFormError = '';
@@ -121,6 +131,9 @@
 				testSuitePrefix: prefixes.testSuitePrefix
 			};
 		} catch {}
+		try {
+			integrations = await fetchIntegrations();
+		} catch {}
 		if ($auth.user) {
 			profileForm = { name: $auth.user.name, email: $auth.user.email };
 		}
@@ -394,10 +407,23 @@
 		goto('/login');
 	}
 
+	async function handleSaveIntegrations() {
+		integrationsSaving = true;
+		try {
+			integrations = await saveIntegrations(integrations);
+			showToast('success', 'Integration settings saved.');
+		} catch {
+			showToast('error', 'Failed to save integration settings.');
+		} finally {
+			integrationsSaving = false;
+		}
+	}
+
 	$: navItems = [
 		{ id: 'project', label: 'Project' },
 		{ id: 'runners', label: 'Runners' },
 		{ id: 'repository', label: 'Repository' },
+		{ id: 'integrations', label: 'Integrations' },
 		{ id: 'account', label: 'Account' },
 		...($auth.user?.role === 'admin' ? [{ id: 'users', label: 'Users' }] : []),
 		{ id: 'backup', label: 'Backup' }
@@ -811,6 +837,70 @@
 				</div>
 			</div>
 
+			<!-- INTEGRATIONS -->
+		{:else if section === 'integrations'}
+			<div class="content-section" transition:fly={{ y: 6, duration: 180 }}>
+				<div class="content-header">
+					<h2>Integrations</h2>
+					<p class="content-desc">
+						Connect Discord and Slack to receive run notifications with pass/fail results and report
+						links.
+					</p>
+				</div>
+
+				<div class="card settings-card">
+					<p class="card-title">Webhooks</p>
+
+					<div class="field">
+						<label class="field-label" for="discord-url">
+							<span>Discord Webhook URL</span>
+							<span class="field-hint">Leave blank to disable Discord notifications</span>
+						</label>
+						<input
+							id="discord-url"
+							type="url"
+							class="field-input"
+							bind:value={integrations.discordWebhookUrl}
+							placeholder="https://discord.com/api/webhooks/…"
+						/>
+					</div>
+
+					<div class="field">
+						<label class="field-label" for="slack-url">
+							<span>Slack Webhook URL</span>
+							<span class="field-hint">Leave blank to disable Slack notifications</span>
+						</label>
+						<input
+							id="slack-url"
+							type="url"
+							class="field-input"
+							bind:value={integrations.slackWebhookUrl}
+							placeholder="https://hooks.slack.com/services/…"
+						/>
+					</div>
+
+					<div class="field">
+						<label class="field-label" for="public-url">
+							<span>Public URL</span>
+							<span class="field-hint"
+								>Base URL of this Plum instance, used to link reports in notifications</span
+							>
+						</label>
+						<input
+							id="public-url"
+							type="url"
+							class="field-input"
+							bind:value={integrations.notifyPublicUrl}
+							placeholder="https://plum.yourcompany.com"
+						/>
+					</div>
+
+					<Button on:click={handleSaveIntegrations} disabled={integrationsSaving}>
+						{integrationsSaving ? 'Saving…' : 'Save Integrations'}
+					</Button>
+				</div>
+			</div>
+
 			<!-- ACCOUNT -->
 		{:else if section === 'account'}
 			<div class="content-section" transition:fly={{ y: 6, duration: 180 }}>

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "plum-e2e",
-	"version": "2.1.0",
+	"version": "2.2.0",
 	"repository": {
 		"type": "git",
 		"url": "https://github.com/silverlunah/plum.git"