diff --git a/src/lib/components/dashboard/BasicSummary.svelte b/src/lib/components/dashboard/BasicSummary.svelte
index ef160eb..3b3fa96 100644
--- a/src/lib/components/dashboard/BasicSummary.svelte
+++ b/src/lib/components/dashboard/BasicSummary.svelte
@@ -6,7 +6,7 @@
 	export let data: BasicSummaryEntry;
 </script>
 
-<Card class="shadow-sm !p-4">
+<Card class="summary-card shadow-sm !p-4">
 	<div class="space-y-2">
 		<h4 class="h4">{data.title}</h4>
 		<h3 class="h3">{data.valueParsed}</h3>
diff --git a/tests/dashboard.spec.ts b/tests/dashboard.spec.ts
new file mode 100644
index 0000000..e7115b5
--- /dev/null
+++ b/tests/dashboard.spec.ts
@@ -0,0 +1,13 @@
+import { expect, test } from '@playwright/test';
+
+test('Summary Cards Visible', async ({ page }) => {
+	await page.goto('/');
+
+	const main = await page.getByRole('main');
+	await expect(main).toBeVisible();
+
+	const summaryCards = await page.locator('.summary-card');
+
+	await expect(summaryCards).toHaveCount(2);
+	await expect(summaryCards.nth(0)).toBeVisible();
+});